Google Maps

(part of package 'googlemaps') Extends designtime/SolutionModel: JSWebComponent Extends runtime: RuntimeWebComponent

This is a reference page; many components have detailed usage guides here.

Properties

KmlLayerURL

Type: dataprovider

---

apiKey

Type: dataprovider

---

directionsSettings

Type: routeSettings

---

fullscreenControl

Type: boolean Default Value: true

---

gestureHandling

Type: string Default Value: "auto"

---

mapEvents

Type: string[]

---

mapType

Type: string Default Value: "ROADMAP"

---

mapTypeControl

Type: boolean Default Value: true

---

markerEvents

Type: string[]

---

markers

Type: marker[] Default Value: []

---

streetViewControl

Type: boolean Default Value: true

---

styleClass

Type: styleclass

---

useGoogleMapCluster

Type: boolean Default Value: false

---

useGoogleMapDirections

Type: boolean Default Value: false

---

visible

Type: visible

---

zoomControl

Type: boolean Default Value: true

---

zoomLevel

Type: dataprovider

---

Events

onMapEvent

Parameters:

event JSEvent latLng latLng

---

onMarkerEvent

Parameters:

event JSEvent markerIndex int latLng latLng

---

onMarkerGeocoded

Parameters:

marker marker latLng latLng

---

onRouteChanged

Parameters:

routeDetails routeResult

---

API

addMarker

Adds the given marker

@param {googlemaps-svy-G-Maps.marker} marker @param {Number} [index] optional starting point where to add the marker (useful to add waypoints in routes in a specific order)

Parameters:

marker marker index int (optional)

---

addMarkers

Adds the given markers

@param {Array<googlemaps-svy-G-Maps.marker>} markers @param {Number} [index] optional starting point where to add the markers (useful to add waypoints in routes in a specific order)

Parameters:

markers marker[] index int (optional)

---

centerAtAddress

Center google maps at the given address

@example

myElement.centerAtAddress(address);

@returns {Boolean}

Parameters:

address string

Returns: boolean

---

centerAtLatLng

Center google maps at LatLng

@example

myElement.centerAtLatLng(lat, lng);

@returns {Boolean}

Parameters:

lat int lng int

Returns: boolean

---

createMarker

Creates a new, empty marker with the given marker ID and position

@param {Object} markerId @param {String|googlemaps-svy-G-Maps.latLng} addressOrLatLng @param {String} [title] @return {googlemaps-svy-G-Maps.marker}

Parameters:

markerId object addressOrLatLng object title string (optional)

Returns: marker

---

fitBounds

Sets the viewport to contain the given bounds.

@return {CustomType<googlemaps-svy-G-Maps.latLngBounds>}

Parameters:

latLngBounds object

---

getBounds

Returns the lat/lng bounds of the current viewport. If more than one copy of the world is visible, the bounds range in longitude from -180 to 180 degrees inclusive. If the map is not yet initialized (i.e. the mapType is still null), or center and zoom have not been set then the result is null or undefined.

@return {CustomType<googlemaps-svy-G-Maps.latLngBounds>}

Returns: latLngBounds

---

getCenter

Returns the position displayed at the center of the map

@return {CustomType<googlemaps-svy-G-Maps.latLng>}

Returns: latLng

---

getMarker

Returns the marker with the given index

@param {Number} index @return {googlemaps-svy-G-Maps.marker}

Parameters:

index int

Returns: marker

---

getMarkerById

Returns the marker with the given markerId

@param {Object} markerId @return {googlemaps-svy-G-Maps.marker}

Parameters:

markerId object

Returns: marker

---

getMarkers

Returns all markers

@return {Array<googlemaps-svy-G-Maps.marker>}

Returns: marker[]

---

newMarkers

Add a new google marker to the map

@example

myElement.newMarkers([{addressString: 'Fred. Roeskestraat 97, Amsterdam, NL'}]);

@deprecated please use addMarkers(markers, index) instead @param {Array<googlemaps-svy-G-Maps.marker>} newMarkers @param {Number} [index] optional starting point where to add the markers

Parameters:

markers marker[] index int (optional)

---

refresh

Refresh google maps

@example

myElement.refresh();

@returns {Boolean}

Returns: boolean

---

removeAllMarkers

Remove all google markers

@example

myElement.removeAllMarkers();

@returns {Boolean}

Returns: boolean

---

removeMarker

Remove google marker at given index

@example

myElement.removeMarker(index);

@param {Number} index @returns {Boolean}

Parameters:

index int

Returns: boolean

---

setOptions

Set Google Maps options. See here: https://developers.google.com/maps/documentation/javascript/reference/map#MapOptions the list of available options.

@param {Object} options

Parameters:

options object

---

Types

latLng

• lat

  • Type: double

  • Default Value: 0

• lng

  • Type: double

  • Default Value: 0

latLngBounds

• ne

  • Type: latLng

• sw

  • Type: latLng

leg

• distance

  • Type: string

• distance_meters

  • Type: int

• duration

  • Type: string

• duration_seconds

  • Type: int

• end_address

  • Type: string

• end_markerId

  • Type: object

• start_address

  • Type: string

• start_markerId

  • Type: object

marker

• addressDataprovider

  • Type: dataprovider

• addressString

  • Type: string

• animation

  • Type: string

  • Default Value: null

• clickable

  • Type: boolean

  • Default Value: true

• crossOnDrag

  • Type: boolean

  • Default Value: true

• cursor

  • Type: string

• draggable

  • Type: boolean

  • Default Value: false

• drawRadius

  • Type: boolean

  • Default Value: false

• iconLabel

  • Type: string

• iconMedia

  • Type: media

• iconUrl

  • Type: string

• infoWindowString

  • Type: tagstring

• latitude

  • Type: double

• longitude

  • Type: double

• markerId

  • Type: object

• opacity

  • Type: double

  • Default Value: 1

• position

  • Type: latLng

• radiusColor

  • Type: color

  • Default Value: "#AA0000"

• radiusMeters

  • Type: int

  • Default Value: 2000

• title

  • Type: string

• tooltip

  • Type: string

• userObject

  • Type: object

• visible

  • Type: boolean

  • Default Value: true

• zIndex

  • Type: int

routeResult

• legs

  • Type: leg[]

• total_distance

  • Type: int

• total_duration

  • Type: int

routeSettings

• avoidFerries

  • Type: boolean

  • Default Value: false

• avoidHighways

  • Type: boolean

  • Default Value: false

• avoidTolls

  • Type: boolean

  • Default Value: false

• optimize

  • Type: boolean

  • Default Value: true

• travelMode

  • Type: string

  • Default Value: "driving"