Interface: GoogleMapProps

Props for the GoogleMap component.

Properties

addMarkerOnSearch

addMarkerOnSearch: boolean

Whether to add a marker on search.

---

allowChangingMarkers

allowChangingMarkers: boolean

If true, the user can change the markers.

---

allowMultipleMarkers?

optional allowMultipleMarkers: boolean

Whether multiple markers can be added to the map. Defaults to false.

---

apiKey

apiKey: string

Google Maps API key used to load the map.

---

className?

optional className: string

The CSS class name.

---

collisionBehavior?

optional collisionBehavior: CollisionBehavior

The markers collision behavior.

---

colorScheme?

optional colorScheme: "DARK" | "LIGHT" | "FOLLOW_SYSTEM"

The color scheme to use for the map.

---

gestureHandling?

optional gestureHandling: "none" | "auto" | "cooperative" | "greedy"

This setting controls how the API handles gestures on the map.

---

label?

optional label: string

The label of the component.

---

language?

optional language: string

Use a specific language for the map. Read more about localizing the Map: https://developers.google.com/maps/documentation/javascript/localization. Part of: https://developers.google.com/maps/documentation/javascript/url-params.

---

latitude

latitude: number

Latitude of the center point on the map.

---

longitude

longitude: number

Longitude of the center point on the map.

---

mapControlPosition

mapControlPosition: ControlPosition

The position of the map control.

---

mapId?

optional mapId: string

The map ID is an identifier that's associated with a specific map style or feature.

---

mapTypeId

mapTypeId: "hybrid" | "roadmap" | "satellite" | "terrain"

The default map type to use.

---

markers?

optional markers: MapMarker[]

Coordinates of the markers

---

markerWindowTitle

markerWindowTitle: string

The title for the marker window.

---

onMapClick()?

optional onMapClick: (event) => void

The callback function called when the map is clicked.

Parameters

event

MapMouseEvent

Returns

void

---

onMarkerAdd()?

optional onMarkerAdd: (marker) => void

The callback function called when a marker is added.

Parameters

marker

MapMarker

Returns

void

---

onMarkerClick()?

optional onMarkerClick: (marker, element) => void

The callback function called when a marker is clicked.

Parameters

marker

null | MapMarker

element

AdvancedMarkerElement

Returns

void

---

onMarkerDelete()?

optional onMarkerDelete: (marker) => void

The callback function called when a marker is deleted.

Parameters

marker

MapMarker

Returns

void

---

onPlaceSelect()?

optional onPlaceSelect: (place, address?) => void

The callback function called when a place is selected.

Parameters

place

PlaceResult

the selected place.

address?

Address

the address of the selected place.

Returns

void

---

region?

optional region: string

Sets the map to a specific region. Read more about localizing the Map: https://developers.google.com/maps/documentation/javascript/localization. Part of: https://developers.google.com/maps/documentation/javascript/url-params.

---

removeMarkerCaption

removeMarkerCaption: string

The caption for the remove marker button.

---

searchPlaceholder?

optional searchPlaceholder: string

The search input placeholder.

---

showMapControl

showMapControl: ControlPosition

Whether to show the map control.

---

zoom

zoom: number

Zoom level of the map.