Class GoogleLayer

A Google Layer allows you to embed a Google Map inside a Map.

To be able to use this layer, you need to include the Google Maps v3 API on the web page. Do this by adding a script tag to your page. For more details, check out the Google Map API getting started documentation. Note that Google Maps has dropped support for IE11 in November 2022, so GoogleLayer is no longer supported on that browser. In IE11 you can still use a GoogleImageModel.

A Google Map is restricted in the number of zoom levels it can show, as well as the extent of your navigation range. By adding this layer to a map, the Map will be limited to these same constraints. This means that when you send instructions that violate the constraints of Google Maps to the mapNavigator, for example by zooming to an unsupported scale or navigating to an unsupported extent, the map will make a best effort to snap to an extent and scale supported by Google Maps. Because a GoogleLayer will not render anything when scale snapping is disabled, MapNavigator.defaults map.mapNavigator.defaults.snapToScaleLevels will automatically be set to 'true' when adding a GoogleLayer to the Map.

You can also use a GoogleImageModel to add Google map data to a map. The advantage is that you are not restricted by the navigation restrictions imposed by Google Maps. Another advantage of using a GoogleImageModel rather than GoogleLayer is that performance and memory consumption will be better.

Please review the Google's Terms of Service carefully to determine if your application may use the Google Maps v3 API. 

var googleLayerOptions = {
  mapType: "hybrid",
  styles: [
    {
      featureType: "road.local",
      elementType: "geometry.stroke",
      stylers: [
        {color: "#282B2A"}
      ]
    }
  ]
};

var googleLayer = new GoogleLayer(googleLayerOptions);
map.layerTree.addChild(googleLayer, "bottom");

Since

2013.1

Hierarchy

Constructors

constructor

Accessors

balloonContentProvider children editable id label map mapType model parent scaleRange styles supportedPaintRepresentations treeNodeType type visible visibleInTree

Methods

accept darkenGoogleMap findLayerById findLayerGroupById findLayerTreeNodeById getModelBoundsVisibleOnMap isPaintRepresentationSupported isPaintRepresentationVisible isPaintRepresentationVisibleInTree onClick onCreateContextMenu setPaintRepresentationVisible setPaintRepresentationVisibleInTree visitChildren whenReady

Events

EditableChanged

Constructors

constructor

Accessors

balloonContentProvider

  • get balloonContentProvider(): ((obj) => string | HTMLElement)

  • The content provider that may be used when showBalloon is called on the map. The content provider is a function that takes a single parameter and returns the contents for the balloon. The parameter is the object for which the balloon is shown, which is typically a Feature. The return value of the function can be a string or a DOM-node.

    See showBalloon for information on how to style the balloon.

    Returns ((obj) => string | HTMLElement)

      • (obj): string | HTMLElement

      • The content provider that may be used when showBalloon is called on the map. The content provider is a function that takes a single parameter and returns the contents for the balloon. The parameter is the object for which the balloon is shown, which is typically a Feature. The return value of the function can be a string or a DOM-node.

        See showBalloon for information on how to style the balloon.

        Parameters

        Returns string | HTMLElement

  • set balloonContentProvider(balloonContentProvider): void

  • Parameters

    Returns void

children

  • get children(): LayerTreeNode[]

  • The list of direct children of the node. The children are ordered according to the painting order (the bottom layer is the first element in the array). Note that also the nodes that are not visible will be included.

    Returns LayerTreeNode[]

editable

  • get editable(): boolean

  • Denotes whether the layer can be edited

    Returns boolean

  • set editable(editable): void

  • Parameters

    • editable: boolean

    Returns void

id

  • get id(): string

  • The node's ID (immutable). This ID was configured at construction time and is unique over the whole layer tree. If no ID was given, a UUID will have been generated automatically.

    Returns string

label

  • get label(): string

  • The node's label. This label was configured at construction time. If no label was given, the label will correspond to the layer's ID.

    Returns string

  • set label(value): void

  • Parameters

    • value: string

    Returns void

map

  • get map(): null | Map

  • The map this note is attached to, or null. This property will be null if this node is not attached to a map.

    Returns null | Map

mapType

  • get mapType(): GoogleMapType

  • The Google map type. Available options are "roadmap", "satellite", "hybrid", and "terrain".

    Returns GoogleMapType

  • set mapType(value): void

  • Parameters

    Returns void

model

parent

  • get parent(): null | LayerGroup

  • The parent of this node or null. This property will be null if this node has not been added as the child of another node yet.

    Returns null | LayerGroup

scaleRange

  • get scaleRange(): Interval

  • The scale range of this layer.

    Returns Interval

styles

  • get styles(): null | object[]

  • The map style that will be applied to the Google Map. The format of this property adheres to the Google Maps style array as specified in the Google's Styled Maps Documentation.

    googleLayer.styles = [
      {
        featureType: "road.local",
        elementType: "geometry.stroke",
        stylers: [
          {color: "#282B2A"}
        ]
      }
    ];

    Returns null | object[]

  • set styles(value): void

  • Parameters

    • value: null | object[]

    Returns void

supportedPaintRepresentations

treeNodeType

type

  • get type(): LayerType

  • The LayerType of this layer. The layer type is used by the Map to optimize rendering. It is an optional parameter of the layer constructor.

    Returns LayerType

visible

  • get visible(): boolean

  • Denotes whether the node is visible. This can be considered to be the master visibility switch: Setting this to false makes the layer entirely invisible. If it is true, the visible paint representations will be visible.

    This property does not reflect whether this node's parent is visible as well, If this is desired, use visibleInTree instead.

    Returns boolean

  • set visible(visible): void

  • Parameters

    • visible: boolean

    Returns void

visibleInTree

  • get visibleInTree(): boolean

  • Denotes whether this layer is visible on the map. This method will only return true if this layer and every parent layer up to the root of the layer tree is visible.

    If visibleInTree is set to true, this will ensure that every parent LayerTreeNode up to the of the tree is configured to be visible as well.

    Returns boolean

  • set visibleInTree(value): void

  • Parameters

    • value: boolean

    Returns void

Methods

accept

darkenGoogleMap

  • Parameters

    • darken: boolean

      whether or not to darken the Google layer

    • googMapContainer: HTMLElement

    Returns void

findLayerById

  • Returns the layer with the given ID if that layer is this node or one of its children. Note that the layer's ID does not correspond with the layer's label.

    Parameters

    • id: string

      The id of the layer that you want to retrieve.

    Returns Layer

    the requested layer or undefined if it is not present in the tree

findLayerGroupById

  • Returns the layer group with the given ID if that layer is this node or one of its children.

    Parameters

    • id: string

      The id of the layer group that you want to retrieve.

    Returns LayerGroup

    the requested layer group or undefined if it is not present in the tree

    Since

    2014.0

findLayerTreeNodeById

  • Returns the layer tree node with the given ID if that layer is this node or one of its children. This may be a layer-group or a layer.

    Parameters

    • id: string

      The id of the layerTreeNode that you want to retrieve.

    Returns LayerTreeNode

    the requested layerTreeNode or undefined if it is not present in the tree

    Since

    2014.0

getModelBoundsVisibleOnMap

  • Returns the area of the map that is currently visible, expressed in model coordinates.

    Returns null | Bounds

    the visible bounds in model coordinates or null if nothing is visible

    Deprecated

    Please use mapBounds instead.

isPaintRepresentationSupported

  • Indicates whether the specified paint representation is supported for this layer. Not every LayerTreeNode may support all paint representations. E.g. raster layers may not b have a PaintRepresentation.LABEL paint representation.

    Parameters

    Returns boolean

    true when paintRepresentation is supported, false otherwise.

isPaintRepresentationVisible

isPaintRepresentationVisibleInTree

  • Indicates whether the specified paint representation is visible on the map. This method will only return true if this paint representation is visible for this layer and every parent layer up to the layer tree.

    Parameters

    Returns boolean

    true when paintRepresentation is supported and visible, false otherwise

    See

    setPaintRepresentationVisibleInTree

onClick

  • Called when the map has detected a single click on an object that is contained by this layer. This method can be overridden to take action when the click is detected. The default implementation of this method simply returns false.

    Parameters

    Returns boolean

    true to indicate that the click was handled and default behavior should not occur; false otherwise

onCreateContextMenu

  • Called when the map is going to display a context menu for an object that is contained by this layer. This method can be overridden to populate the given context menu with additional items.

    Parameters

    • contextMenu: ContextMenu

      The context menu to populate

    • map: Map

      The map that is about to show a context menu

    • contextMenuInfo: any

      The object that was passed to the map when requesting the context menu. The context menu info object. This object may contain arbitrary data. The default implementation expects a pickInfo object which will be passed to the appropriate Layer's onCreateContextMenu method. A pickInfo object is JavaScript object with two properties: the objects that were touched (an array of Features) and the layer that object resides in.

    Returns void

setPaintRepresentationVisible

  • Sets the visibility of a specific paint representation. This allows for example to only show the PaintRepresentation.BODY of a layer and not the PaintRepresentation.LABEL:

      var layer = ...;
      layer.setPaintRepresentationVisible( PaintRepresentation.BODY, true );
      layer.setPaintRepresentationVisible( PaintRepresentation.LABEL, false );

    Parameters

    Returns void

setPaintRepresentationVisibleInTree

  • Sets the visibility of a specific paint representation in a layer tree. If it set to true, this will ensure that the paint representation of every parent LayerTreeNode up to the roof of the tree is configured to be visible as well.

    Parameters

    Returns void

visitChildren

  • Accepts the given visitor on the children of this.

    Parameters

    • visitor: LayerTreeVisitor

      The visitor which will receive the callbacks for the children.

    • order: VisitOrder

      The order in which the children need to be traversed.

    Returns void

whenReady

  • Wait until this layer or layer group is finished with all possible work related to any change that happened before this call.
    At that moment, the screen is up-to-date with all changes.

    Examples: 

      map.mapNavigator.fit({ bounds: somewhere });
      map.layerTree.whenReady().then(makeScreenshot);

    or

        layer.painter.invalidateAll();
        layer.whenReady().then(alert);

    or

        layer.model.add(newFeature);
        layer.whenReady().then(alert);

    This call can be used to have a reliable, programmatic way to wait for all work leading up to the call to be reflected on the screen.
    The returned promise will always resolve once, when the layer is ready. The promise is rejected when the layer does not become ready in 5 minutes.

    Examples (not exhaustive) of aspects this promise will wait for:

    • While loading image data when it displayed for the first time, or after navigating the view
    • While loading image data after changing raster model properties such as WMS style
    • While loading feature data when it displayed for the first time, enters its scale range, or after navigating the view
    • While loading feature data after invalidating the layer query provider
    • While processing features after invalidating the layer feature painter or shape provider, or changing the layer filter
    • While processing features after they were added, updated or removed to/in/from a model or workingSet

    NOTE: The promise gets resolved also when an error (QueryStatus.QUERY_ERROR) occurs while handling underlying query or when the node is invisible.

    A LayerTree will wait until all its children are ready.

    Returns Promise<LayerTreeNode>

    A promise that resolves to the LayerTreeNode when all current work is done

Events

"" event

  • on("", callback: ((...args) => void), context?: any) : Handle

  • Registers a callback function for a given event type.

    Parameters

    • event: string

      the event type to register on

    • callback: ((...args) => void)

      the callback function to register

        • (...args): void

        • Parameters

          • Rest ...args: any[]

          Returns void

    • Optional context: any

      the context in which the callback function should be invoked implementation dependent.

    Returns Handle

    a handle to the registered callback with a single function 'remove'. This function can be used to unregister the callback function.

"EditableChanged" event

  • on("EditableChanged", callback: ((editable) => void), context?: any) : Handle

  • Event fired when the editability of the layer changes.

    Parameters

    • event: "EditableChanged"

      the 'EditableChanged' changed event.

    • callback: ((editable) => void)

      the callback to be invoked when the editability of the layer changes. The callback gets the 'editable' boolean parameter, which indicates whether or not the layer is editable.

        • (editable): void

        • Parameters

          • editable: boolean

          Returns void

    • Optional context: any

      value to use as this when executing callback

    Returns Handle

Settings

Member Visibility

Theme