Map

The map component is for embedding maps into pages.

Map

Maven Central Class reference Source code

Price Marker

Day Night
Maps component Maps component - dark mode

Price Marker V2

Day Night
Maps component Maps component - dark mode

Icon Marker

Day Night
Maps component Maps component - dark mode

Pointer Marker

Day Night
Maps component Maps component - dark mode

Location Marker

Day Night
Maps component Maps component - dark mode

Poi Marker

Day Night
Maps component Maps component - dark mode

Hotel Marker

Day Night
Maps component Maps component - dark mode

Installation

Backpack Compose is available through Maven Central. Check the main Readme for a complete installation guide.

Usage

Example of an price marker:


                                                
                                                import net.skyscanner.backpack.compose.map.BpkPriceMapMarker
                                                import net.skyscanner.backpack.compose.map.BpkPriceMarkerStatus
                                                
                                                BpkPriceMapMarker(
                                                    title = "£198",
                                                    status = BpkPriceMarkerStatus.Focused,
                                                )

Example of an price marker v2:


                                                
                                                import net.skyscanner.backpack.compose.map.BpkPriceMapMarkerV2
                                                import net.skyscanner.backpack.compose.map.BpkPriceMarkerV2Status
                                                
                                                BpkPriceMapMarkerV2(
                                                    title = "£198",
                                                    status = BpkPriceMarkerV2Status.Selected,
                                                )

Example of an icon marker:


                                                
                                                import net.skyscanner.backpack.compose.map.BpkIconMapMarker
                                                import net.skyscanner.backpack.compose.map.BpkIconMarkerStatus
                                                
                                                BpkIconMapMarker(
                                                    contentDescription = "Landmark",
                                                    icon = BpkIcon.Landmark,
                                                    status = BpkIconMarkerStatus.Disabled
                                                )

Example of a pointer marker:


                                                
                                                import net.skyscanner.backpack.compose.map.BpkPointerMapMarker
                                                
                                                BpkPointerMapMarker(
                                                    title = "Pointer",
                                                )

Example of a location marker:


                                                
                                                import net.skyscanner.backpack.compose.map.BpkLocationMapMarker
                                                
                                                BpkLocationMapMarker(
                                                    title = "Location",
                                                )

Example of a poi marker:


                                                
                                                import net.skyscanner.backpack.compose.map.BpkPoiMapMarker
                                                
                                                BpkPoiMapMarker(
                                                    title = "Poi",
                                                )

Example of a hotel marker:


                                                
                                                import net.skyscanner.backpack.compose.map.BpkHotelMapMarker
                                                
                                                BpkHotelMapMarker(
                                                    title = "Hotel",
                                                )