angular2-google-maps

  • Version 0.17.0
  • Published
  • No dependencies
  • MIT license

Install

npm i angular2-google-maps
yarn add angular2-google-maps
pnpm add angular2-google-maps

Overview

Angular 2 components for Google Maps

Index

Variables

Classes

Interfaces

Enums

Variables

variable LAZY_MAPS_API_CONFIG

const LAZY_MAPS_API_CONFIG: any;

Classes

class AgmCoreModule

@NgModule({ declarations: coreDirectives(), exports: coreDirectives() })
export class AgmCoreModule {}
  • The angular2-google-maps core module. Contains all Directives/Services/Pipes of the core module. Please use AgmCoreModule.forRoot() in your app module.

method forRoot

static forRoot: (
lazyMapsAPILoaderConfig?: LazyMapsAPILoaderConfigLiteral
) => any;
  • Please use this method when you register the module at the root level.

class CircleManager

@Injectable()
export class CircleManager {}

    constructor

    constructor(_apiWrapper: GoogleMapsAPIWrapper, _zone: any);

      method addCircle

      addCircle: (circle: SebmGoogleMapCircle) => void;

        method createEventObservable

        createEventObservable: <T>(
        eventName: string,
        circle: SebmGoogleMapCircle
        ) => any;

          method getBounds

          getBounds: (circle: SebmGoogleMapCircle) => Promise<mapTypes.LatLngBounds>;

            method getCenter

            getCenter: (circle: SebmGoogleMapCircle) => Promise<mapTypes.LatLng>;

              method getRadius

              getRadius: (circle: SebmGoogleMapCircle) => Promise<number>;

                method removeCircle

                removeCircle: (circle: SebmGoogleMapCircle) => Promise<void>;
                • Removes the given circle from the map.

                method setCenter

                setCenter: (circle: SebmGoogleMapCircle) => Promise<void>;

                  method setDraggable

                  setDraggable: (circle: SebmGoogleMapCircle) => Promise<void>;

                    method setEditable

                    setEditable: (circle: SebmGoogleMapCircle) => Promise<void>;

                      method setOptions

                      setOptions: (
                      circle: SebmGoogleMapCircle,
                      options: mapTypes.CircleOptions
                      ) => Promise<void>;

                        method setRadius

                        setRadius: (circle: SebmGoogleMapCircle) => Promise<void>;

                          method setVisible

                          setVisible: (circle: SebmGoogleMapCircle) => Promise<void>;

                            class GoogleMapsAPIWrapper

                            @Injectable()
                            export class GoogleMapsAPIWrapper {}
                            • Wrapper class that handles the communication with the Google Maps Javascript API v3

                            constructor

                            constructor(_loader: MapsAPILoader, _zone: any);

                              method containsLocation

                              containsLocation: (
                              latLng: mapTypes.LatLngLiteral,
                              polygon: mapTypes.Polygon
                              ) => Promise<boolean>;
                              • Determines if given coordinates are insite a Polygon path.

                              method createCircle

                              createCircle: (options: mapTypes.CircleOptions) => Promise<mapTypes.Circle>;
                              • Creates a google.map.Circle for the current map.

                              method createInfoWindow

                              createInfoWindow: (
                              options?: mapTypes.InfoWindowOptions
                              ) => Promise<mapTypes.InfoWindow>;

                                method createMap

                                createMap: (el: HTMLElement, mapOptions: mapTypes.MapOptions) => Promise<void>;

                                  method createMarker

                                  createMarker: (options?: mapTypes.MarkerOptions) => Promise<mapTypes.Marker>;
                                  • Creates a google map marker with the map context

                                  method createPolygon

                                  createPolygon: (options: mapTypes.PolygonOptions) => Promise<mapTypes.Polyline>;

                                    method createPolyline

                                    createPolyline: (options: PolylineOptions) => Promise<Polyline>;

                                      method fitBounds

                                      fitBounds: (
                                      latLng: mapTypes.LatLngBounds | mapTypes.LatLngBoundsLiteral
                                      ) => Promise<void>;

                                        method getBounds

                                        getBounds: () => Promise<mapTypes.LatLngBounds>;

                                          method getCenter

                                          getCenter: () => Promise<mapTypes.LatLng>;

                                            method getNativeMap

                                            getNativeMap: () => Promise<mapTypes.GoogleMap>;
                                            • Returns the native Google Maps Map instance. Be careful when using this instance directly.

                                            method getZoom

                                            getZoom: () => Promise<number>;

                                              method panTo

                                              panTo: (latLng: mapTypes.LatLng | mapTypes.LatLngLiteral) => Promise<void>;

                                                method panToBounds

                                                panToBounds: (
                                                latLng: mapTypes.LatLngBounds | mapTypes.LatLngBoundsLiteral
                                                ) => Promise<void>;

                                                  method setCenter

                                                  setCenter: (latLng: mapTypes.LatLngLiteral) => Promise<void>;

                                                    method setMapOptions

                                                    setMapOptions: (options: mapTypes.MapOptions) => void;

                                                      method setZoom

                                                      setZoom: (zoom: number) => Promise<void>;

                                                        method subscribeToMapEvent

                                                        subscribeToMapEvent: <E>(eventName: string) => any;

                                                          method triggerMapEvent

                                                          triggerMapEvent: (eventName: string) => Promise<void>;
                                                          • Triggers the given event name on the map instance.

                                                          class InfoWindowManager

                                                          @Injectable()
                                                          export class InfoWindowManager {}

                                                            constructor

                                                            constructor(
                                                            _mapsWrapper: GoogleMapsAPIWrapper,
                                                            _zone: any,
                                                            _markerManager: MarkerManager
                                                            );

                                                              method addInfoWindow

                                                              addInfoWindow: (infoWindow: SebmGoogleMapInfoWindow) => void;

                                                                method close

                                                                close: (infoWindow: SebmGoogleMapInfoWindow) => Promise<void>;

                                                                  method createEventObservable

                                                                  createEventObservable: <T>(
                                                                  eventName: string,
                                                                  infoWindow: SebmGoogleMapInfoWindow
                                                                  ) => any;
                                                                  • Creates a Google Maps event listener for the given InfoWindow as an Observable

                                                                  method deleteInfoWindow

                                                                  deleteInfoWindow: (infoWindow: SebmGoogleMapInfoWindow) => Promise<void>;

                                                                    method open

                                                                    open: (infoWindow: SebmGoogleMapInfoWindow) => Promise<void>;

                                                                      method setOptions

                                                                      setOptions: (
                                                                      infoWindow: SebmGoogleMapInfoWindow,
                                                                      options: InfoWindowOptions
                                                                      ) => Promise<void>;

                                                                        method setPosition

                                                                        setPosition: (infoWindow: SebmGoogleMapInfoWindow) => Promise<void>;

                                                                          method setZIndex

                                                                          setZIndex: (infoWindow: SebmGoogleMapInfoWindow) => Promise<void>;

                                                                            class KmlLayerManager

                                                                            @Injectable()
                                                                            export class KmlLayerManager {}
                                                                            • Manages all KML Layers for a Google Map instance.

                                                                            constructor

                                                                            constructor(_wrapper: GoogleMapsAPIWrapper, _zone: any);

                                                                              method addKmlLayer

                                                                              addKmlLayer: (layer: SebmGoogleMapKmlLayer) => void;
                                                                              • Adds a new KML Layer to the map.

                                                                              method createEventObservable

                                                                              createEventObservable: <T>(
                                                                              eventName: string,
                                                                              layer: SebmGoogleMapKmlLayer
                                                                              ) => any;
                                                                              • Creates a Google Maps event listener for the given KmlLayer as an Observable

                                                                              method deleteKmlLayer

                                                                              deleteKmlLayer: (layer: SebmGoogleMapKmlLayer) => void;

                                                                                method setOptions

                                                                                setOptions: (layer: SebmGoogleMapKmlLayer, options: KmlLayerOptions) => void;

                                                                                  class LazyMapsAPILoader

                                                                                  @Injectable()
                                                                                  export class LazyMapsAPILoader extends MapsAPILoader {}

                                                                                    constructor

                                                                                    constructor(config: any, w: WindowRef, d: DocumentRef);

                                                                                      method load

                                                                                      load: () => Promise<void>;

                                                                                        class MapsAPILoader

                                                                                        @Injectable()
                                                                                        export abstract class MapsAPILoader {}

                                                                                          method load

                                                                                          abstract load: () => Promise<void>;

                                                                                            class MarkerManager

                                                                                            @Injectable()
                                                                                            export class MarkerManager {}

                                                                                              constructor

                                                                                              constructor(_mapsWrapper: GoogleMapsAPIWrapper, _zone: any);

                                                                                                method addMarker

                                                                                                addMarker: (marker: SebmGoogleMapMarker) => void;

                                                                                                  method createEventObservable

                                                                                                  createEventObservable: <T>(
                                                                                                  eventName: string,
                                                                                                  marker: SebmGoogleMapMarker
                                                                                                  ) => any;

                                                                                                    method deleteMarker

                                                                                                    deleteMarker: (marker: SebmGoogleMapMarker) => Promise<void>;

                                                                                                      method getNativeMarker

                                                                                                      getNativeMarker: (marker: SebmGoogleMapMarker) => Promise<Marker>;

                                                                                                        method updateDraggable

                                                                                                        updateDraggable: (marker: SebmGoogleMapMarker) => Promise<void>;

                                                                                                          method updateIcon

                                                                                                          updateIcon: (marker: SebmGoogleMapMarker) => Promise<void>;

                                                                                                            method updateLabel

                                                                                                            updateLabel: (marker: SebmGoogleMapMarker) => Promise<void>;

                                                                                                              method updateMarkerPosition

                                                                                                              updateMarkerPosition: (marker: SebmGoogleMapMarker) => Promise<void>;

                                                                                                                method updateOpacity

                                                                                                                updateOpacity: (marker: SebmGoogleMapMarker) => Promise<void>;

                                                                                                                  method updateTitle

                                                                                                                  updateTitle: (marker: SebmGoogleMapMarker) => Promise<void>;

                                                                                                                    method updateVisible

                                                                                                                    updateVisible: (marker: SebmGoogleMapMarker) => Promise<void>;

                                                                                                                      method updateZIndex

                                                                                                                      updateZIndex: (marker: SebmGoogleMapMarker) => Promise<void>;

                                                                                                                        class NoOpMapsAPILoader

                                                                                                                        class NoOpMapsAPILoader implements MapsAPILoader {}
                                                                                                                        • When using the NoOpMapsAPILoader, the Google Maps API must be added to the page via a <script> Tag. It's important that the Google Maps API script gets loaded first on the page.

                                                                                                                        method load

                                                                                                                        load: () => Promise<void>;

                                                                                                                          class PolygonManager

                                                                                                                          @Injectable()
                                                                                                                          export class PolygonManager {}

                                                                                                                            constructor

                                                                                                                            constructor(_mapsWrapper: GoogleMapsAPIWrapper, _zone: any);

                                                                                                                              method addPolygon

                                                                                                                              addPolygon: (path: SebmGoogleMapPolygon) => void;

                                                                                                                                method createEventObservable

                                                                                                                                createEventObservable: <T>(eventName: string, path: SebmGoogleMapPolygon) => any;

                                                                                                                                  method deletePolygon

                                                                                                                                  deletePolygon: (paths: SebmGoogleMapPolygon) => Promise<void>;

                                                                                                                                    method setPolygonOptions

                                                                                                                                    setPolygonOptions: (
                                                                                                                                    path: SebmGoogleMapPolygon,
                                                                                                                                    options: { [propName: string]: any }
                                                                                                                                    ) => Promise<void>;

                                                                                                                                      method updatePolygon

                                                                                                                                      updatePolygon: (polygon: SebmGoogleMapPolygon) => Promise<void>;

                                                                                                                                        class PolylineManager

                                                                                                                                        @Injectable()
                                                                                                                                        export class PolylineManager {}

                                                                                                                                          constructor

                                                                                                                                          constructor(_mapsWrapper: GoogleMapsAPIWrapper, _zone: any);

                                                                                                                                            method addPolyline

                                                                                                                                            addPolyline: (line: SebmGoogleMapPolyline) => void;

                                                                                                                                              method createEventObservable

                                                                                                                                              createEventObservable: <T>(
                                                                                                                                              eventName: string,
                                                                                                                                              line: SebmGoogleMapPolyline
                                                                                                                                              ) => any;

                                                                                                                                                method deletePolyline

                                                                                                                                                deletePolyline: (line: SebmGoogleMapPolyline) => Promise<void>;

                                                                                                                                                  method setPolylineOptions

                                                                                                                                                  setPolylineOptions: (
                                                                                                                                                  line: SebmGoogleMapPolyline,
                                                                                                                                                  options: { [propName: string]: any }
                                                                                                                                                  ) => Promise<void>;

                                                                                                                                                    method updatePolylinePoints

                                                                                                                                                    updatePolylinePoints: (line: SebmGoogleMapPolyline) => Promise<void>;

                                                                                                                                                      class SebmGoogleMap

                                                                                                                                                      @Component({
                                                                                                                                                      selector: 'sebm-google-map',
                                                                                                                                                      providers: [
                                                                                                                                                      GoogleMapsAPIWrapper,
                                                                                                                                                      MarkerManager,
                                                                                                                                                      InfoWindowManager,
                                                                                                                                                      CircleManager,
                                                                                                                                                      PolylineManager,
                                                                                                                                                      PolygonManager,
                                                                                                                                                      KmlLayerManager,
                                                                                                                                                      ],
                                                                                                                                                      inputs: [
                                                                                                                                                      'longitude',
                                                                                                                                                      'latitude',
                                                                                                                                                      'zoom',
                                                                                                                                                      'minZoom',
                                                                                                                                                      'maxZoom',
                                                                                                                                                      'draggable: mapDraggable',
                                                                                                                                                      'disableDoubleClickZoom',
                                                                                                                                                      'disableDefaultUI',
                                                                                                                                                      'scrollwheel',
                                                                                                                                                      'backgroundColor',
                                                                                                                                                      'draggableCursor',
                                                                                                                                                      'draggingCursor',
                                                                                                                                                      'keyboardShortcuts',
                                                                                                                                                      'zoomControl',
                                                                                                                                                      'styles',
                                                                                                                                                      'usePanning',
                                                                                                                                                      'streetViewControl',
                                                                                                                                                      'fitBounds',
                                                                                                                                                      'scaleControl',
                                                                                                                                                      'mapTypeControl',
                                                                                                                                                      ],
                                                                                                                                                      outputs: [
                                                                                                                                                      'mapClick',
                                                                                                                                                      'mapRightClick',
                                                                                                                                                      'mapDblClick',
                                                                                                                                                      'centerChange',
                                                                                                                                                      'idle',
                                                                                                                                                      'boundsChange',
                                                                                                                                                      'zoomChange',
                                                                                                                                                      ],
                                                                                                                                                      host: { '[class.sebm-google-map-container]': 'true' },
                                                                                                                                                      styles: [
                                                                                                                                                      `
                                                                                                                                                      .sebm-google-map-container-inner {
                                                                                                                                                      width: inherit;
                                                                                                                                                      height: inherit;
                                                                                                                                                      }
                                                                                                                                                      .sebm-google-map-content {
                                                                                                                                                      display: none;
                                                                                                                                                      }
                                                                                                                                                      `,
                                                                                                                                                      ],
                                                                                                                                                      template: `
                                                                                                                                                      <div class="sebm-google-map-container-inner"></div>
                                                                                                                                                      <div class="sebm-google-map-content">
                                                                                                                                                      <ng-content></ng-content>
                                                                                                                                                      </div>
                                                                                                                                                      `,
                                                                                                                                                      })
                                                                                                                                                      export class SebmGoogleMap implements OnChanges, OnInit, OnDestroy {}
                                                                                                                                                      • SebMGoogleMap renders a Google Map. **Important note**: To be able see a map in the browser, you have to define a height for the CSS class sebm-google-map-container.

                                                                                                                                                        ### Example

                                                                                                                                                        import { Component } from '@angular/core';
                                                                                                                                                        import { SebmGoogleMap } from 'angular2-google-maps/core';
                                                                                                                                                        @Component({
                                                                                                                                                        selector: 'my-map-cmp',
                                                                                                                                                        directives: [SebmGoogleMap],
                                                                                                                                                        styles: [`
                                                                                                                                                        .sebm-google-map-container {
                                                                                                                                                        height: 300px;
                                                                                                                                                        }
                                                                                                                                                        `],
                                                                                                                                                        template: `
                                                                                                                                                        <sebm-google-map [latitude]="lat" [longitude]="lng" [zoom]="zoom">
                                                                                                                                                        </sebm-google-map>
                                                                                                                                                        `
                                                                                                                                                        })

                                                                                                                                                      constructor

                                                                                                                                                      constructor(_elem: any, _mapsWrapper: GoogleMapsAPIWrapper);

                                                                                                                                                        property backgroundColor

                                                                                                                                                        backgroundColor: string;
                                                                                                                                                        • Color used for the background of the Map div. This color will be visible when tiles have not yet loaded as the user pans. This option can only be set when the map is initialized.

                                                                                                                                                        property boundsChange

                                                                                                                                                        boundsChange: any;
                                                                                                                                                        • This event is fired when the viewport bounds have changed.

                                                                                                                                                        property centerChange

                                                                                                                                                        centerChange: any;
                                                                                                                                                        • This event emitter is fired when the map center changes.

                                                                                                                                                        property disableDefaultUI

                                                                                                                                                        disableDefaultUI: boolean;
                                                                                                                                                        • Enables/disables all default UI of the Google map. Please note: When the map is created, this value cannot get updated.

                                                                                                                                                        property disableDoubleClickZoom

                                                                                                                                                        disableDoubleClickZoom: boolean;
                                                                                                                                                        • Enables/disables zoom and center on double click. Enabled by default.

                                                                                                                                                        property draggable

                                                                                                                                                        draggable: boolean;
                                                                                                                                                        • Enables/disables if map is draggable.

                                                                                                                                                        property draggableCursor

                                                                                                                                                        draggableCursor: string;
                                                                                                                                                        • The name or url of the cursor to display when mousing over a draggable map. This property uses the css * cursor attribute to change the icon. As with the css property, you must specify at least one fallback cursor that is not a URL. For example: [draggableCursor]="'url(http://www.example.com/icon.png), auto;'"

                                                                                                                                                        property draggingCursor

                                                                                                                                                        draggingCursor: string;
                                                                                                                                                        • The name or url of the cursor to display when the map is being dragged. This property uses the css cursor attribute to change the icon. As with the css property, you must specify at least one fallback cursor that is not a URL. For example: [draggingCursor]="'url(http://www.example.com/icon.png), auto;'"

                                                                                                                                                        property fitBounds

                                                                                                                                                        fitBounds: LatLngBounds | LatLngBoundsLiteral;
                                                                                                                                                        • Sets the viewport to contain the given bounds.

                                                                                                                                                        property idle

                                                                                                                                                        idle: any;
                                                                                                                                                        • This event is fired when the map becomes idle after panning or zooming.

                                                                                                                                                        property keyboardShortcuts

                                                                                                                                                        keyboardShortcuts: boolean;
                                                                                                                                                        • If false, prevents the map from being controlled by the keyboard. Keyboard shortcuts are enabled by default.

                                                                                                                                                        property latitude

                                                                                                                                                        latitude: number;
                                                                                                                                                        • The latitude that defines the center of the map.

                                                                                                                                                        property longitude

                                                                                                                                                        longitude: number;
                                                                                                                                                        • The longitude that defines the center of the map.

                                                                                                                                                        property mapClick

                                                                                                                                                        mapClick: any;
                                                                                                                                                        • This event emitter gets emitted when the user clicks on the map (but not when they click on a marker or infoWindow).

                                                                                                                                                        property mapDblClick

                                                                                                                                                        mapDblClick: any;
                                                                                                                                                        • This event emitter gets emitted when the user double-clicks on the map (but not when they click on a marker or infoWindow).

                                                                                                                                                        property mapRightClick

                                                                                                                                                        mapRightClick: any;
                                                                                                                                                        • This event emitter gets emitted when the user right-clicks on the map (but not when they click on a marker or infoWindow).

                                                                                                                                                        property mapTypeControl

                                                                                                                                                        mapTypeControl: boolean;
                                                                                                                                                        • The initial enabled/disabled state of the Map type control.

                                                                                                                                                        property maxZoom

                                                                                                                                                        maxZoom: number;
                                                                                                                                                        • The maximal zoom level of the map allowed. When not provided, no restrictions to the zoom level are enforced.

                                                                                                                                                        property minZoom

                                                                                                                                                        minZoom: number;
                                                                                                                                                        • The minimal zoom level of the map allowed. When not provided, no restrictions to the zoom level are enforced.

                                                                                                                                                        property scaleControl

                                                                                                                                                        scaleControl: boolean;
                                                                                                                                                        • The initial enabled/disabled state of the Scale control. This is disabled by default.

                                                                                                                                                        property scrollwheel

                                                                                                                                                        scrollwheel: boolean;
                                                                                                                                                        • If false, disables scrollwheel zooming on the map. The scrollwheel is enabled by default.

                                                                                                                                                        property streetViewControl

                                                                                                                                                        streetViewControl: boolean;
                                                                                                                                                        • The initial enabled/disabled state of the Street View Pegman control. This control is part of the default UI, and should be set to false when displaying a map type on which the Street View road overlay should not appear (e.g. a non-Earth map type).

                                                                                                                                                        property styles

                                                                                                                                                        styles: MapTypeStyle[];
                                                                                                                                                        • Styles to apply to each of the default map types. Note that for Satellite/Hybrid and Terrain modes, these styles will only apply to labels and geometry.

                                                                                                                                                        property usePanning

                                                                                                                                                        usePanning: boolean;
                                                                                                                                                        • When true and the latitude and/or longitude values changes, the Google Maps panTo method is used to center the map. See: https://developers.google.com/maps/documentation/javascript/reference#Map

                                                                                                                                                        property zoom

                                                                                                                                                        zoom: number;
                                                                                                                                                        • The zoom level of the map. The default zoom level is 8.

                                                                                                                                                        property zoomChange

                                                                                                                                                        zoomChange: any;
                                                                                                                                                        • This event is fired when the zoom level has changed.

                                                                                                                                                        property zoomControl

                                                                                                                                                        zoomControl: boolean;
                                                                                                                                                        • The enabled/disabled state of the Zoom control.

                                                                                                                                                        method ngOnChanges

                                                                                                                                                        ngOnChanges: (changes: { [propName: string]: any }) => void;

                                                                                                                                                          method triggerResize

                                                                                                                                                          triggerResize: () => Promise<void>;
                                                                                                                                                          • Triggers a resize event on the google map instance. Returns a promise that gets resolved after the event was triggered.

                                                                                                                                                          class SebmGoogleMapCircle

                                                                                                                                                          @Directive({
                                                                                                                                                          selector: 'sebm-google-map-circle',
                                                                                                                                                          inputs: [
                                                                                                                                                          'latitude',
                                                                                                                                                          'longitude',
                                                                                                                                                          'clickable',
                                                                                                                                                          'draggable: circleDraggable',
                                                                                                                                                          'editable',
                                                                                                                                                          'fillColor',
                                                                                                                                                          'fillOpacity',
                                                                                                                                                          'radius',
                                                                                                                                                          'strokeColor',
                                                                                                                                                          'strokeOpacity',
                                                                                                                                                          'strokePosition',
                                                                                                                                                          'strokeWeight',
                                                                                                                                                          'visible',
                                                                                                                                                          'zIndex',
                                                                                                                                                          ],
                                                                                                                                                          outputs: [
                                                                                                                                                          'centerChange',
                                                                                                                                                          'circleClick',
                                                                                                                                                          'circleDblClick',
                                                                                                                                                          'drag',
                                                                                                                                                          'dragEnd',
                                                                                                                                                          'dragStart',
                                                                                                                                                          'mouseDown',
                                                                                                                                                          'mouseMove',
                                                                                                                                                          'mouseOut',
                                                                                                                                                          'mouseOver',
                                                                                                                                                          'mouseUp',
                                                                                                                                                          'radiusChange',
                                                                                                                                                          'rightClick',
                                                                                                                                                          ],
                                                                                                                                                          })
                                                                                                                                                          export class SebmGoogleMapCircle implements OnInit, OnChanges, OnDestroy {}

                                                                                                                                                            constructor

                                                                                                                                                            constructor(_manager: CircleManager);

                                                                                                                                                              property centerChange

                                                                                                                                                              centerChange: any;
                                                                                                                                                              • This event is fired when the circle's center is changed.

                                                                                                                                                              property circleClick

                                                                                                                                                              circleClick: any;
                                                                                                                                                              • This event emitter gets emitted when the user clicks on the circle.

                                                                                                                                                              property circleDblClick

                                                                                                                                                              circleDblClick: any;
                                                                                                                                                              • This event emitter gets emitted when the user clicks on the circle.

                                                                                                                                                              property clickable

                                                                                                                                                              clickable: boolean;
                                                                                                                                                              • Indicates whether this Circle handles mouse events. Defaults to true.

                                                                                                                                                              property drag

                                                                                                                                                              drag: any;
                                                                                                                                                              • This event is repeatedly fired while the user drags the circle.

                                                                                                                                                              property dragEnd

                                                                                                                                                              dragEnd: any;
                                                                                                                                                              • This event is fired when the user stops dragging the circle.

                                                                                                                                                              property draggable

                                                                                                                                                              draggable: boolean;
                                                                                                                                                              • If set to true, the user can drag this circle over the map. Defaults to false.

                                                                                                                                                              property dragStart

                                                                                                                                                              dragStart: any;
                                                                                                                                                              • This event is fired when the user starts dragging the circle.

                                                                                                                                                              property editable

                                                                                                                                                              editable: boolean;
                                                                                                                                                              • If set to true, the user can edit this circle by dragging the control points shown at the center and around the circumference of the circle. Defaults to false.

                                                                                                                                                              property fillColor

                                                                                                                                                              fillColor: string;
                                                                                                                                                              • The fill color. All CSS3 colors are supported except for extended named colors.

                                                                                                                                                              property fillOpacity

                                                                                                                                                              fillOpacity: number;
                                                                                                                                                              • The fill opacity between 0.0 and 1.0.

                                                                                                                                                              property latitude

                                                                                                                                                              latitude: number;
                                                                                                                                                              • The latitude position of the circle (required).

                                                                                                                                                              property longitude

                                                                                                                                                              longitude: number;
                                                                                                                                                              • The clickable position of the circle (required).

                                                                                                                                                              property mouseDown

                                                                                                                                                              mouseDown: any;
                                                                                                                                                              • This event is fired when the DOM mousedown event is fired on the circle.

                                                                                                                                                              property mouseMove

                                                                                                                                                              mouseMove: any;
                                                                                                                                                              • This event is fired when the DOM mousemove event is fired on the circle.

                                                                                                                                                              property mouseOut

                                                                                                                                                              mouseOut: any;
                                                                                                                                                              • This event is fired on circle mouseout.

                                                                                                                                                              property mouseOver

                                                                                                                                                              mouseOver: any;
                                                                                                                                                              • This event is fired on circle mouseover.

                                                                                                                                                              property mouseUp

                                                                                                                                                              mouseUp: any;
                                                                                                                                                              • This event is fired when the DOM mouseup event is fired on the circle.

                                                                                                                                                              property radius

                                                                                                                                                              radius: number;
                                                                                                                                                              • The radius in meters on the Earth's surface.

                                                                                                                                                              property radiusChange

                                                                                                                                                              radiusChange: any;
                                                                                                                                                              • This event is fired when the circle's radius is changed.

                                                                                                                                                              property rightClick

                                                                                                                                                              rightClick: any;
                                                                                                                                                              • This event is fired when the circle is right-clicked on.

                                                                                                                                                              property strokeColor

                                                                                                                                                              strokeColor: string;
                                                                                                                                                              • The stroke color. All CSS3 colors are supported except for extended named colors.

                                                                                                                                                              property strokeOpacity

                                                                                                                                                              strokeOpacity: number;
                                                                                                                                                              • The stroke opacity between 0.0 and 1.0

                                                                                                                                                              property strokePosition

                                                                                                                                                              strokePosition: 'CENTER' | 'INSIDE' | 'OUTSIDE';
                                                                                                                                                              • The stroke position. Defaults to CENTER. This property is not supported on Internet Explorer 8 and earlier.

                                                                                                                                                              property strokeWeight

                                                                                                                                                              strokeWeight: number;
                                                                                                                                                              • The stroke width in pixels.

                                                                                                                                                              property visible

                                                                                                                                                              visible: boolean;
                                                                                                                                                              • Whether this circle is visible on the map. Defaults to true.

                                                                                                                                                              property zIndex

                                                                                                                                                              zIndex: number;
                                                                                                                                                              • The zIndex compared to other polys.

                                                                                                                                                              method getBounds

                                                                                                                                                              getBounds: () => Promise<LatLngBounds>;
                                                                                                                                                              • Gets the LatLngBounds of this Circle.

                                                                                                                                                              method getCenter

                                                                                                                                                              getCenter: () => Promise<LatLng>;

                                                                                                                                                                class SebmGoogleMapInfoWindow

                                                                                                                                                                @Component({
                                                                                                                                                                selector: 'sebm-google-map-info-window',
                                                                                                                                                                inputs: [
                                                                                                                                                                'latitude',
                                                                                                                                                                'longitude',
                                                                                                                                                                'disableAutoPan',
                                                                                                                                                                'isOpen',
                                                                                                                                                                'zIndex',
                                                                                                                                                                'maxWidth',
                                                                                                                                                                ],
                                                                                                                                                                outputs: ['infoWindowClose'],
                                                                                                                                                                template: `<div class="sebm-google-map-info-window-content">
                                                                                                                                                                <ng-content></ng-content>
                                                                                                                                                                </div> `,
                                                                                                                                                                })
                                                                                                                                                                export class SebmGoogleMapInfoWindow implements OnDestroy, OnChanges, OnInit {}
                                                                                                                                                                • SebmGoogleMapInfoWindow renders a info window inside a SebmGoogleMapMarker or standalone.

                                                                                                                                                                  ### Example

                                                                                                                                                                  import { Component } from 'angular2/core';
                                                                                                                                                                  import { SebmGoogleMap, SebmGoogleMapMarker, SebmGoogleMapInfoWindow } from
                                                                                                                                                                  'angular2-google-maps/core';
                                                                                                                                                                  @Component({
                                                                                                                                                                  selector: 'my-map-cmp',
                                                                                                                                                                  directives: [SebmGoogleMap, SebmGoogleMapMarker, SebmGoogleMapInfoWindow],
                                                                                                                                                                  styles: [`
                                                                                                                                                                  .sebm-google-map-container {
                                                                                                                                                                  height: 300px;
                                                                                                                                                                  }
                                                                                                                                                                  `],
                                                                                                                                                                  template: `
                                                                                                                                                                  <sebm-google-map [latitude]="lat" [longitude]="lng" [zoom]="zoom">
                                                                                                                                                                  <sebm-google-map-marker [latitude]="lat" [longitude]="lng" [label]="'M'">
                                                                                                                                                                  <sebm-google-map-info-window [disableAutoPan]="true">
                                                                                                                                                                  Hi, this is the content of the <strong>info window</strong>
                                                                                                                                                                  </sebm-google-map-info-window>
                                                                                                                                                                  </sebm-google-map-marker>
                                                                                                                                                                  </sebm-google-map>
                                                                                                                                                                  `
                                                                                                                                                                  })

                                                                                                                                                                constructor

                                                                                                                                                                constructor(_infoWindowManager: InfoWindowManager, _el: any);

                                                                                                                                                                  property content

                                                                                                                                                                  content: Node;
                                                                                                                                                                  • Holds the native element that is used for the info window content.

                                                                                                                                                                  property disableAutoPan

                                                                                                                                                                  disableAutoPan: boolean;
                                                                                                                                                                  • Disable auto-pan on open. By default, the info window will pan the map so that it is fully visible when it opens.

                                                                                                                                                                  property hostMarker

                                                                                                                                                                  hostMarker: SebmGoogleMapMarker;
                                                                                                                                                                  • Holds the marker that is the host of the info window (if available)

                                                                                                                                                                  property infoWindowClose

                                                                                                                                                                  infoWindowClose: any;
                                                                                                                                                                  • Emits an event when the info window is closed.

                                                                                                                                                                  property isOpen

                                                                                                                                                                  isOpen: boolean;
                                                                                                                                                                  • Sets the open state for the InfoWindow. You can also call the open() and close() methods.

                                                                                                                                                                  property latitude

                                                                                                                                                                  latitude: number;
                                                                                                                                                                  • The latitude position of the info window (only usefull if you use it ouside of a SebmGoogleMapMarker).

                                                                                                                                                                  property longitude

                                                                                                                                                                  longitude: number;
                                                                                                                                                                  • The longitude position of the info window (only usefull if you use it ouside of a SebmGoogleMapMarker).

                                                                                                                                                                  property maxWidth

                                                                                                                                                                  maxWidth: number;
                                                                                                                                                                  • Maximum width of the infowindow, regardless of content's width. This value is only considered if it is set before a call to open. To change the maximum width when changing content, call close, update maxWidth, and then open.

                                                                                                                                                                  property zIndex

                                                                                                                                                                  zIndex: number;
                                                                                                                                                                  • All InfoWindows are displayed on the map in order of their zIndex, with higher values displaying in front of InfoWindows with lower values. By default, InfoWindows are displayed according to their latitude, with InfoWindows of lower latitudes appearing in front of InfoWindows at higher latitudes. InfoWindows are always displayed in front of markers.

                                                                                                                                                                  method close

                                                                                                                                                                  close: () => Promise<void>;
                                                                                                                                                                  • Closes the info window.

                                                                                                                                                                  method ngOnInit

                                                                                                                                                                  ngOnInit: () => void;

                                                                                                                                                                    method open

                                                                                                                                                                    open: () => Promise<void>;
                                                                                                                                                                    • Opens the info window.

                                                                                                                                                                    class SebmGoogleMapKmlLayer

                                                                                                                                                                    @Directive({
                                                                                                                                                                    selector: 'sebm-google-map-kml-layer',
                                                                                                                                                                    inputs: [
                                                                                                                                                                    'clickable',
                                                                                                                                                                    'preserveViewport',
                                                                                                                                                                    'screenOverlays',
                                                                                                                                                                    'suppressInfoWindows',
                                                                                                                                                                    'url',
                                                                                                                                                                    'zIndex',
                                                                                                                                                                    ],
                                                                                                                                                                    outputs: ['layerClick', 'defaultViewportChange', 'statusChange'],
                                                                                                                                                                    })
                                                                                                                                                                    export class SebmGoogleMapKmlLayer implements OnInit, OnDestroy, OnChanges {}

                                                                                                                                                                      constructor

                                                                                                                                                                      constructor(_manager: KmlLayerManager);

                                                                                                                                                                        property clickable

                                                                                                                                                                        clickable: boolean;
                                                                                                                                                                        • If true, the layer receives mouse events. Default value is true.

                                                                                                                                                                        property defaultViewportChange

                                                                                                                                                                        defaultViewportChange: any;
                                                                                                                                                                        • This event is fired when the KML layers default viewport has changed.

                                                                                                                                                                        property layerClick

                                                                                                                                                                        layerClick: any;
                                                                                                                                                                        • This event is fired when a feature in the layer is clicked.

                                                                                                                                                                        property preserveViewport

                                                                                                                                                                        preserveViewport: boolean;
                                                                                                                                                                        • By default, the input map is centered and zoomed to the bounding box of the contents of the layer. If this option is set to true, the viewport is left unchanged, unless the map's center and zoom were never set.

                                                                                                                                                                        property screenOverlays

                                                                                                                                                                        screenOverlays: boolean;
                                                                                                                                                                        • Whether to render the screen overlays. Default true.

                                                                                                                                                                        property statusChange

                                                                                                                                                                        statusChange: any;
                                                                                                                                                                        • This event is fired when the KML layer has finished loading. At this point it is safe to read the status property to determine if the layer loaded successfully.

                                                                                                                                                                        property suppressInfoWindows

                                                                                                                                                                        suppressInfoWindows: boolean;
                                                                                                                                                                        • Suppress the rendering of info windows when layer features are clicked.

                                                                                                                                                                        property url

                                                                                                                                                                        url: string;
                                                                                                                                                                        • The URL of the KML document to display.

                                                                                                                                                                        property zIndex

                                                                                                                                                                        zIndex: number;
                                                                                                                                                                        • The z-index of the layer.

                                                                                                                                                                        method ngOnChanges

                                                                                                                                                                        ngOnChanges: (changes: any) => void;

                                                                                                                                                                          method ngOnInit

                                                                                                                                                                          ngOnInit: () => void;

                                                                                                                                                                            class SebmGoogleMapMarker

                                                                                                                                                                            @Directive({
                                                                                                                                                                            selector: 'sebm-google-map-marker',
                                                                                                                                                                            inputs: [
                                                                                                                                                                            'latitude',
                                                                                                                                                                            'longitude',
                                                                                                                                                                            'title',
                                                                                                                                                                            'label',
                                                                                                                                                                            'draggable: markerDraggable',
                                                                                                                                                                            'iconUrl',
                                                                                                                                                                            'openInfoWindow',
                                                                                                                                                                            'opacity',
                                                                                                                                                                            'visible',
                                                                                                                                                                            'zIndex',
                                                                                                                                                                            ],
                                                                                                                                                                            outputs: ['markerClick', 'dragEnd', 'mouseOver', 'mouseOut'],
                                                                                                                                                                            })
                                                                                                                                                                            export class SebmGoogleMapMarker implements OnDestroy, OnChanges, AfterContentInit {}
                                                                                                                                                                            • SebmGoogleMapMarker renders a map marker inside a SebmGoogleMap.

                                                                                                                                                                              ### Example

                                                                                                                                                                              import { Component } from 'angular2/core';
                                                                                                                                                                              import { SebmGoogleMap, SebmGoogleMapMarker } from 'angular2-google-maps/core';
                                                                                                                                                                              @Component({
                                                                                                                                                                              selector: 'my-map-cmp',
                                                                                                                                                                              directives: [SebmGoogleMap, SebmGoogleMapMarker],
                                                                                                                                                                              styles: [`
                                                                                                                                                                              .sebm-google-map-container {
                                                                                                                                                                              height: 300px;
                                                                                                                                                                              }
                                                                                                                                                                              `],
                                                                                                                                                                              template: `
                                                                                                                                                                              <sebm-google-map [latitude]="lat" [longitude]="lng" [zoom]="zoom">
                                                                                                                                                                              <sebm-google-map-marker [latitude]="lat" [longitude]="lng" [label]="'M'">
                                                                                                                                                                              </sebm-google-map-marker>
                                                                                                                                                                              </sebm-google-map>
                                                                                                                                                                              `
                                                                                                                                                                              })

                                                                                                                                                                            constructor

                                                                                                                                                                            constructor(_markerManager: MarkerManager);

                                                                                                                                                                              property dragEnd

                                                                                                                                                                              dragEnd: any;
                                                                                                                                                                              • This event is fired when the user stops dragging the marker.

                                                                                                                                                                              property draggable

                                                                                                                                                                              draggable: boolean;
                                                                                                                                                                              • If true, the marker can be dragged. Default value is false.

                                                                                                                                                                              property iconUrl

                                                                                                                                                                              iconUrl: string;
                                                                                                                                                                              • Icon (the URL of the image) for the foreground.

                                                                                                                                                                              property label

                                                                                                                                                                              label: string;
                                                                                                                                                                              • The label (a single uppercase character) for the marker.

                                                                                                                                                                              property latitude

                                                                                                                                                                              latitude: number;
                                                                                                                                                                              • The latitude position of the marker.

                                                                                                                                                                              property longitude

                                                                                                                                                                              longitude: number;
                                                                                                                                                                              • The longitude position of the marker.

                                                                                                                                                                              property markerClick

                                                                                                                                                                              markerClick: any;
                                                                                                                                                                              • This event emitter gets emitted when the user clicks on the marker.

                                                                                                                                                                              property mouseOut

                                                                                                                                                                              mouseOut: any;
                                                                                                                                                                              • This event is fired when the user mouses outside the marker.

                                                                                                                                                                              property mouseOver

                                                                                                                                                                              mouseOver: any;
                                                                                                                                                                              • This event is fired when the user mouses over the marker.

                                                                                                                                                                              property opacity

                                                                                                                                                                              opacity: number;
                                                                                                                                                                              • The marker's opacity between 0.0 and 1.0.

                                                                                                                                                                              property openInfoWindow

                                                                                                                                                                              openInfoWindow: boolean;
                                                                                                                                                                              • Whether to automatically open the child info window when the marker is clicked.

                                                                                                                                                                              property title

                                                                                                                                                                              title: string;
                                                                                                                                                                              • The title of the marker.

                                                                                                                                                                              property visible

                                                                                                                                                                              visible: boolean;
                                                                                                                                                                              • If true, the marker is visible

                                                                                                                                                                              property zIndex

                                                                                                                                                                              zIndex: number;
                                                                                                                                                                              • All markers are displayed on the map in order of their zIndex, with higher values displaying in front of markers with lower values. By default, markers are displayed according to their vertical position on screen, with lower markers appearing in front of markers further up the screen.

                                                                                                                                                                              method ngAfterContentInit

                                                                                                                                                                              ngAfterContentInit: () => void;

                                                                                                                                                                                class SebmGoogleMapPolygon

                                                                                                                                                                                @Directive({
                                                                                                                                                                                selector: 'sebm-map-polygon',
                                                                                                                                                                                inputs: [
                                                                                                                                                                                'clickable',
                                                                                                                                                                                'draggable: polyDraggable',
                                                                                                                                                                                'editable',
                                                                                                                                                                                'fillColor',
                                                                                                                                                                                'fillOpacity',
                                                                                                                                                                                'geodesic',
                                                                                                                                                                                'paths',
                                                                                                                                                                                'strokeColor',
                                                                                                                                                                                'strokeOpacity',
                                                                                                                                                                                'strokeWeight',
                                                                                                                                                                                'visible',
                                                                                                                                                                                'zIndex',
                                                                                                                                                                                ],
                                                                                                                                                                                outputs: [
                                                                                                                                                                                'polyClick',
                                                                                                                                                                                'polyDblClick',
                                                                                                                                                                                'polyDrag',
                                                                                                                                                                                'polyDragEnd',
                                                                                                                                                                                'polyMouseDown',
                                                                                                                                                                                'polyMouseMove',
                                                                                                                                                                                'polyMouseOut',
                                                                                                                                                                                'polyMouseOver',
                                                                                                                                                                                'polyMouseUp',
                                                                                                                                                                                'polyRightClick',
                                                                                                                                                                                ],
                                                                                                                                                                                })
                                                                                                                                                                                export class SebmGoogleMapPolygon
                                                                                                                                                                                implements OnDestroy, OnChanges, AfterContentInit {}
                                                                                                                                                                                • SebmGoogleMapPolygon renders a polygon on a SebmGoogleMap

                                                                                                                                                                                  ### Example

                                                                                                                                                                                  import { Component } from '@angular/core';
                                                                                                                                                                                  import { SebmGoogleMap, SebmGooglePolygon, LatLngLiteral } from 'angular2-maps/core';
                                                                                                                                                                                  @Component({
                                                                                                                                                                                  selector: 'my-map-cmp',
                                                                                                                                                                                  styles: [`
                                                                                                                                                                                  .semb-map-container {
                                                                                                                                                                                  height: 300px;
                                                                                                                                                                                  }
                                                                                                                                                                                  `],
                                                                                                                                                                                  template: `
                                                                                                                                                                                  <semb-map [latitude]="lat" [longitude]="lng" [zoom]="zoom">
                                                                                                                                                                                  <semb-map-polygon [paths]="paths">
                                                                                                                                                                                  </semb-map-polygon>
                                                                                                                                                                                  </semb-map>
                                                                                                                                                                                  `
                                                                                                                                                                                  })
                                                                                                                                                                                  export class MyMapCmp {
                                                                                                                                                                                  lat: number = 0;
                                                                                                                                                                                  lng: number = 0;
                                                                                                                                                                                  zoom: number = 10;
                                                                                                                                                                                  paths: Array<LatLngLiteral> = [
                                                                                                                                                                                  { lat: 0, lng: 10 },
                                                                                                                                                                                  { lat: 0, lng: 20 },
                                                                                                                                                                                  { lat: 10, lng: 20 },
                                                                                                                                                                                  { lat: 10, lng: 10 },
                                                                                                                                                                                  { lat: 0, lng: 10 }
                                                                                                                                                                                  ]
                                                                                                                                                                                  // Nesting paths will create a hole where they overlap;
                                                                                                                                                                                  nestedPaths: Array<Array<LatLngLiteral>> = [[
                                                                                                                                                                                  { lat: 0, lng: 10 },
                                                                                                                                                                                  { lat: 0, lng: 20 },
                                                                                                                                                                                  { lat: 10, lng: 20 },
                                                                                                                                                                                  { lat: 10, lng: 10 },
                                                                                                                                                                                  { lat: 0, lng: 10 }
                                                                                                                                                                                  ], [
                                                                                                                                                                                  { lat: 0, lng: 15 },
                                                                                                                                                                                  { lat: 0, lng: 20 },
                                                                                                                                                                                  { lat: 5, lng: 20 },
                                                                                                                                                                                  { lat: 5, lng: 15 },
                                                                                                                                                                                  { lat: 0, lng: 15 }
                                                                                                                                                                                  ]]
                                                                                                                                                                                  }

                                                                                                                                                                                constructor

                                                                                                                                                                                constructor(_polygonManager: PolygonManager);

                                                                                                                                                                                  property clickable

                                                                                                                                                                                  clickable: boolean;
                                                                                                                                                                                  • Indicates whether this Polygon handles mouse events. Defaults to true.

                                                                                                                                                                                  property draggable

                                                                                                                                                                                  draggable: boolean;
                                                                                                                                                                                  • If set to true, the user can drag this shape over the map. The geodesic property defines the mode of dragging. Defaults to false.

                                                                                                                                                                                  property editable

                                                                                                                                                                                  editable: boolean;
                                                                                                                                                                                  • If set to true, the user can edit this shape by dragging the control points shown at the vertices and on each segment. Defaults to false.

                                                                                                                                                                                  property fillColor

                                                                                                                                                                                  fillColor: string;
                                                                                                                                                                                  • The fill color. All CSS3 colors are supported except for extended named colors.

                                                                                                                                                                                  property fillOpacity

                                                                                                                                                                                  fillOpacity: number;
                                                                                                                                                                                  • The fill opacity between 0.0 and 1.0

                                                                                                                                                                                  property geodesic

                                                                                                                                                                                  geodesic: boolean;
                                                                                                                                                                                  • When true, edges of the polygon are interpreted as geodesic and will follow the curvature of the Earth. When false, edges of the polygon are rendered as straight lines in screen space. Note that the shape of a geodesic polygon may appear to change when dragged, as the dimensions are maintained relative to the surface of the earth. Defaults to false.

                                                                                                                                                                                  property paths

                                                                                                                                                                                  paths: (LatLng | LatLngLiteral)[] | (LatLng | LatLngLiteral)[][];
                                                                                                                                                                                  • The ordered sequence of coordinates that designates a closed loop. Unlike polylines, a polygon may consist of one or more paths. As a result, the paths property may specify one or more arrays of LatLng coordinates. Paths are closed automatically; do not repeat the first vertex of the path as the last vertex. Simple polygons may be defined using a single array of LatLngs. More complex polygons may specify an array of arrays. Any simple arrays are converted into Arrays. Inserting or removing LatLngs from the Array will automatically update the polygon on the map.

                                                                                                                                                                                  property polyClick

                                                                                                                                                                                  polyClick: any;
                                                                                                                                                                                  • This event is fired when the DOM click event is fired on the Polygon.

                                                                                                                                                                                  property polyDblClick

                                                                                                                                                                                  polyDblClick: any;
                                                                                                                                                                                  • This event is fired when the DOM dblclick event is fired on the Polygon.

                                                                                                                                                                                  property polyDrag

                                                                                                                                                                                  polyDrag: any;
                                                                                                                                                                                  • This event is repeatedly fired while the user drags the polygon.

                                                                                                                                                                                  property polyDragEnd

                                                                                                                                                                                  polyDragEnd: any;
                                                                                                                                                                                  • This event is fired when the user stops dragging the polygon.

                                                                                                                                                                                  property polyDragStart

                                                                                                                                                                                  polyDragStart: any;
                                                                                                                                                                                  • This event is fired when the user starts dragging the polygon.

                                                                                                                                                                                  property polyMouseDown

                                                                                                                                                                                  polyMouseDown: any;
                                                                                                                                                                                  • This event is fired when the DOM mousedown event is fired on the Polygon.

                                                                                                                                                                                  property polyMouseMove

                                                                                                                                                                                  polyMouseMove: any;
                                                                                                                                                                                  • This event is fired when the DOM mousemove event is fired on the Polygon.

                                                                                                                                                                                  property polyMouseOut

                                                                                                                                                                                  polyMouseOut: any;
                                                                                                                                                                                  • This event is fired on Polygon mouseout.

                                                                                                                                                                                  property polyMouseOver

                                                                                                                                                                                  polyMouseOver: any;
                                                                                                                                                                                  • This event is fired on Polygon mouseover.

                                                                                                                                                                                  property polyMouseUp

                                                                                                                                                                                  polyMouseUp: any;
                                                                                                                                                                                  • This event is fired whe the DOM mouseup event is fired on the Polygon

                                                                                                                                                                                  property polyRightClick

                                                                                                                                                                                  polyRightClick: any;
                                                                                                                                                                                  • This even is fired when the Polygon is right-clicked on.

                                                                                                                                                                                  property strokeColor

                                                                                                                                                                                  strokeColor: string;
                                                                                                                                                                                  • The stroke color. All CSS3 colors are supported except for extended named colors.

                                                                                                                                                                                  property strokeOpacity

                                                                                                                                                                                  strokeOpacity: number;
                                                                                                                                                                                  • The stroke opacity between 0.0 and 1.0

                                                                                                                                                                                  property strokeWeight

                                                                                                                                                                                  strokeWeight: number;
                                                                                                                                                                                  • The stroke width in pixels.

                                                                                                                                                                                  property visible

                                                                                                                                                                                  visible: boolean;
                                                                                                                                                                                  • Whether this polygon is visible on the map. Defaults to true.

                                                                                                                                                                                  property zIndex

                                                                                                                                                                                  zIndex: number;
                                                                                                                                                                                  • The zIndex compared to other polys.

                                                                                                                                                                                  method ngOnChanges

                                                                                                                                                                                  ngOnChanges: (changes: any) => any;

                                                                                                                                                                                    class SebmGoogleMapPolyline

                                                                                                                                                                                    @Directive({
                                                                                                                                                                                    selector: 'sebm-google-map-polyline',
                                                                                                                                                                                    inputs: [
                                                                                                                                                                                    'clickable',
                                                                                                                                                                                    'draggable: polylineDraggable',
                                                                                                                                                                                    'editable',
                                                                                                                                                                                    'geodesic',
                                                                                                                                                                                    'strokeColor',
                                                                                                                                                                                    'strokeWeight',
                                                                                                                                                                                    'strokeOpacity',
                                                                                                                                                                                    'visible',
                                                                                                                                                                                    'zIndex',
                                                                                                                                                                                    ],
                                                                                                                                                                                    outputs: [
                                                                                                                                                                                    'lineClick',
                                                                                                                                                                                    'lineDblClick',
                                                                                                                                                                                    'lineDrag',
                                                                                                                                                                                    'lineDragEnd',
                                                                                                                                                                                    'lineMouseDown',
                                                                                                                                                                                    'lineMouseMove',
                                                                                                                                                                                    'lineMouseOut',
                                                                                                                                                                                    'lineMouseOver',
                                                                                                                                                                                    'lineMouseUp',
                                                                                                                                                                                    'lineRightClick',
                                                                                                                                                                                    ],
                                                                                                                                                                                    })
                                                                                                                                                                                    export class SebmGoogleMapPolyline
                                                                                                                                                                                    implements OnDestroy, OnChanges, AfterContentInit {}
                                                                                                                                                                                    • SebmGoogleMapPolyline renders a polyline on a SebmGoogleMap

                                                                                                                                                                                      ### Example

                                                                                                                                                                                      import { Component } from 'angular2/core';
                                                                                                                                                                                      import { SebmGoogleMap, SebmGooglePolyline, SebmGooglePolylinePoint } from
                                                                                                                                                                                      'angular2-google-maps/core';
                                                                                                                                                                                      @Component({
                                                                                                                                                                                      selector: 'my-map-cmp',
                                                                                                                                                                                      directives: [SebmGoogleMap, SebmGooglePolyline, SebmGooglePolylinePoint],
                                                                                                                                                                                      styles: [`
                                                                                                                                                                                      .sebm-google-map-container {
                                                                                                                                                                                      height: 300px;
                                                                                                                                                                                      }
                                                                                                                                                                                      `],
                                                                                                                                                                                      template: `
                                                                                                                                                                                      <sebm-google-map [latitude]="lat" [longitude]="lng" [zoom]="zoom">
                                                                                                                                                                                      <sebm-google-map-polyline>
                                                                                                                                                                                      <sebm-google-map-polyline-point [latitude]="latA" [longitude]="lngA">
                                                                                                                                                                                      </sebm-google-map-polyline-point>
                                                                                                                                                                                      <sebm-google-map-polyline-point [latitude]="latB" [longitude]="lngB">
                                                                                                                                                                                      </sebm-google-map-polyline-point>
                                                                                                                                                                                      </sebm-google-map-polyline>
                                                                                                                                                                                      </sebm-google-map>
                                                                                                                                                                                      `
                                                                                                                                                                                      })

                                                                                                                                                                                    constructor

                                                                                                                                                                                    constructor(_polylineManager: PolylineManager);

                                                                                                                                                                                      property clickable

                                                                                                                                                                                      clickable: boolean;
                                                                                                                                                                                      • Indicates whether this Polyline handles mouse events. Defaults to true.

                                                                                                                                                                                      property draggable

                                                                                                                                                                                      draggable: boolean;
                                                                                                                                                                                      • If set to true, the user can drag this shape over the map. The geodesic property defines the mode of dragging. Defaults to false.

                                                                                                                                                                                      property editable

                                                                                                                                                                                      editable: boolean;
                                                                                                                                                                                      • If set to true, the user can edit this shape by dragging the control points shown at the vertices and on each segment. Defaults to false.

                                                                                                                                                                                      property geodesic

                                                                                                                                                                                      geodesic: boolean;
                                                                                                                                                                                      • When true, edges of the polygon are interpreted as geodesic and will follow the curvature of the Earth. When false, edges of the polygon are rendered as straight lines in screen space. Note that the shape of a geodesic polygon may appear to change when dragged, as the dimensions are maintained relative to the surface of the earth. Defaults to false.

                                                                                                                                                                                      property lineClick

                                                                                                                                                                                      lineClick: any;
                                                                                                                                                                                      • This event is fired when the DOM click event is fired on the Polyline.

                                                                                                                                                                                      property lineDblClick

                                                                                                                                                                                      lineDblClick: any;
                                                                                                                                                                                      • This event is fired when the DOM dblclick event is fired on the Polyline.

                                                                                                                                                                                      property lineDrag

                                                                                                                                                                                      lineDrag: any;
                                                                                                                                                                                      • This event is repeatedly fired while the user drags the polyline.

                                                                                                                                                                                      property lineDragEnd

                                                                                                                                                                                      lineDragEnd: any;
                                                                                                                                                                                      • This event is fired when the user stops dragging the polyline.

                                                                                                                                                                                      property lineDragStart

                                                                                                                                                                                      lineDragStart: any;
                                                                                                                                                                                      • This event is fired when the user starts dragging the polyline.

                                                                                                                                                                                      property lineMouseDown

                                                                                                                                                                                      lineMouseDown: any;
                                                                                                                                                                                      • This event is fired when the DOM mousedown event is fired on the Polyline.

                                                                                                                                                                                      property lineMouseMove

                                                                                                                                                                                      lineMouseMove: any;
                                                                                                                                                                                      • This event is fired when the DOM mousemove event is fired on the Polyline.

                                                                                                                                                                                      property lineMouseOut

                                                                                                                                                                                      lineMouseOut: any;
                                                                                                                                                                                      • This event is fired on Polyline mouseout.

                                                                                                                                                                                      property lineMouseOver

                                                                                                                                                                                      lineMouseOver: any;
                                                                                                                                                                                      • This event is fired on Polyline mouseover.

                                                                                                                                                                                      property lineMouseUp

                                                                                                                                                                                      lineMouseUp: any;
                                                                                                                                                                                      • This event is fired whe the DOM mouseup event is fired on the Polyline

                                                                                                                                                                                      property lineRightClick

                                                                                                                                                                                      lineRightClick: any;
                                                                                                                                                                                      • This even is fired when the Polyline is right-clicked on.

                                                                                                                                                                                      property strokeColor

                                                                                                                                                                                      strokeColor: string;
                                                                                                                                                                                      • The stroke color. All CSS3 colors are supported except for extended named colors.

                                                                                                                                                                                      property strokeOpacity

                                                                                                                                                                                      strokeOpacity: number;
                                                                                                                                                                                      • The stroke opacity between 0.0 and 1.0.

                                                                                                                                                                                      property strokeWeight

                                                                                                                                                                                      strokeWeight: number;
                                                                                                                                                                                      • The stroke width in pixels.

                                                                                                                                                                                      property visible

                                                                                                                                                                                      visible: boolean;
                                                                                                                                                                                      • Whether this polyline is visible on the map. Defaults to true.

                                                                                                                                                                                      property zIndex

                                                                                                                                                                                      zIndex: number;
                                                                                                                                                                                      • The zIndex compared to other polys.

                                                                                                                                                                                      method ngOnChanges

                                                                                                                                                                                      ngOnChanges: (changes: any) => any;

                                                                                                                                                                                        class SebmGoogleMapPolylinePoint

                                                                                                                                                                                        @Directive({ selector: 'sebm-google-map-polyline-point' })
                                                                                                                                                                                        export class SebmGoogleMapPolylinePoint implements OnChanges {}

                                                                                                                                                                                        constructor

                                                                                                                                                                                        constructor();

                                                                                                                                                                                          property latitude

                                                                                                                                                                                          latitude: number;
                                                                                                                                                                                          • The latitude position of the point.

                                                                                                                                                                                          property longitude

                                                                                                                                                                                          longitude: number;
                                                                                                                                                                                          • The longitude position of the point;

                                                                                                                                                                                          property positionChanged

                                                                                                                                                                                          positionChanged: any;
                                                                                                                                                                                          • This event emitter gets emitted when the position of the point changed.

                                                                                                                                                                                          method ngOnChanges

                                                                                                                                                                                          ngOnChanges: (changes: any) => any;

                                                                                                                                                                                            Interfaces

                                                                                                                                                                                            interface KmlMouseEvent

                                                                                                                                                                                            interface KmlMouseEvent extends MouseEvent {}

                                                                                                                                                                                              property featureData

                                                                                                                                                                                              featureData: KmlFeatureData;

                                                                                                                                                                                                property pixelOffset

                                                                                                                                                                                                pixelOffset: Size;

                                                                                                                                                                                                  interface LatLng

                                                                                                                                                                                                  interface LatLng {}

                                                                                                                                                                                                    method constructor

                                                                                                                                                                                                    constructor: (lat: number, lng: number) => void;

                                                                                                                                                                                                      method lat

                                                                                                                                                                                                      lat: () => number;

                                                                                                                                                                                                        method lng

                                                                                                                                                                                                        lng: () => number;

                                                                                                                                                                                                          interface LatLngBounds

                                                                                                                                                                                                          interface LatLngBounds {}

                                                                                                                                                                                                            method contains

                                                                                                                                                                                                            contains: (latLng: LatLng) => boolean;

                                                                                                                                                                                                              method equals

                                                                                                                                                                                                              equals: (other: LatLngBounds | LatLngBoundsLiteral) => boolean;

                                                                                                                                                                                                                method extend

                                                                                                                                                                                                                extend: (point: LatLng) => void;

                                                                                                                                                                                                                  method getCenter

                                                                                                                                                                                                                  getCenter: () => LatLng;

                                                                                                                                                                                                                    method getNorthEast

                                                                                                                                                                                                                    getNorthEast: () => LatLng;

                                                                                                                                                                                                                      method getSouthWest

                                                                                                                                                                                                                      getSouthWest: () => LatLng;

                                                                                                                                                                                                                        method intersects

                                                                                                                                                                                                                        intersects: (other: LatLngBounds | LatLngBoundsLiteral) => boolean;

                                                                                                                                                                                                                          method isEmpty

                                                                                                                                                                                                                          isEmpty: () => boolean;

                                                                                                                                                                                                                            method toJSON

                                                                                                                                                                                                                            toJSON: () => LatLngBoundsLiteral;

                                                                                                                                                                                                                              method toSpan

                                                                                                                                                                                                                              toSpan: () => LatLng;

                                                                                                                                                                                                                                method toString

                                                                                                                                                                                                                                toString: () => string;

                                                                                                                                                                                                                                  method toUrlValue

                                                                                                                                                                                                                                  toUrlValue: (precision?: number) => string;

                                                                                                                                                                                                                                    method union

                                                                                                                                                                                                                                    union: (other: LatLngBounds | LatLngBoundsLiteral) => LatLngBounds;

                                                                                                                                                                                                                                      interface LatLngBoundsLiteral

                                                                                                                                                                                                                                      interface LatLngBoundsLiteral {}

                                                                                                                                                                                                                                        property east

                                                                                                                                                                                                                                        east: number;

                                                                                                                                                                                                                                          property north

                                                                                                                                                                                                                                          north: number;

                                                                                                                                                                                                                                            property south

                                                                                                                                                                                                                                            south: number;

                                                                                                                                                                                                                                              property west

                                                                                                                                                                                                                                              west: number;

                                                                                                                                                                                                                                                interface LatLngLiteral

                                                                                                                                                                                                                                                interface LatLngLiteral {}

                                                                                                                                                                                                                                                  property lat

                                                                                                                                                                                                                                                  lat: number;

                                                                                                                                                                                                                                                    property lng

                                                                                                                                                                                                                                                    lng: number;

                                                                                                                                                                                                                                                      interface LazyMapsAPILoaderConfigLiteral

                                                                                                                                                                                                                                                      interface LazyMapsAPILoaderConfigLiteral {}

                                                                                                                                                                                                                                                      property apiKey

                                                                                                                                                                                                                                                      apiKey?: string;
                                                                                                                                                                                                                                                      • The Google Maps API Key (see: https://developers.google.com/maps/documentation/javascript/get-api-key)

                                                                                                                                                                                                                                                      property apiVersion

                                                                                                                                                                                                                                                      apiVersion?: string;
                                                                                                                                                                                                                                                      • Google Maps API version.

                                                                                                                                                                                                                                                      property channel

                                                                                                                                                                                                                                                      channel?: string;
                                                                                                                                                                                                                                                      • The Google Maps channel name (for premium plans). A channel parameter is an optional parameter that allows you to track usage under your client ID by assigning a distinct channel to each of your applications.

                                                                                                                                                                                                                                                      property clientId

                                                                                                                                                                                                                                                      clientId?: string;
                                                                                                                                                                                                                                                      • The Google Maps client ID (for premium plans). When you have a Google Maps APIs Premium Plan license, you must authenticate your application with either an API key or a client ID. The Google Maps API will fail to load if both a client ID and an API key are included.

                                                                                                                                                                                                                                                      property hostAndPath

                                                                                                                                                                                                                                                      hostAndPath?: string;
                                                                                                                                                                                                                                                      • Host and Path used for the <script> tag.

                                                                                                                                                                                                                                                      property language

                                                                                                                                                                                                                                                      language?: string;
                                                                                                                                                                                                                                                      • The Google Maps API uses the browser's preferred language when displaying textual information. If you wish to overwrite this behavior and force the API to use a given language, you can use this setting. See https://developers.google.com/maps/documentation/javascript/basics#Language

                                                                                                                                                                                                                                                      property libraries

                                                                                                                                                                                                                                                      libraries?: string[];
                                                                                                                                                                                                                                                      • Defines which Google Maps libraries should get loaded.

                                                                                                                                                                                                                                                      property protocol

                                                                                                                                                                                                                                                      protocol?: GoogleMapsScriptProtocol;
                                                                                                                                                                                                                                                      • Protocol used for the <script> tag.

                                                                                                                                                                                                                                                      property region

                                                                                                                                                                                                                                                      region?: string;
                                                                                                                                                                                                                                                      • The default bias for the map behavior is US. If you wish to alter your application to serve different map tiles or bias the application, you can overwrite the default behavior (US) by defining a region. See https://developers.google.com/maps/documentation/javascript/basics#Region

                                                                                                                                                                                                                                                      interface MapTypeStyle

                                                                                                                                                                                                                                                      interface MapTypeStyle {}

                                                                                                                                                                                                                                                        property elementType

                                                                                                                                                                                                                                                        elementType?:
                                                                                                                                                                                                                                                        | 'all'
                                                                                                                                                                                                                                                        | 'geometry'
                                                                                                                                                                                                                                                        | 'geometry.fill'
                                                                                                                                                                                                                                                        | 'geometry.stroke'
                                                                                                                                                                                                                                                        | 'labels'
                                                                                                                                                                                                                                                        | 'labels.icon'
                                                                                                                                                                                                                                                        | 'labels.text'
                                                                                                                                                                                                                                                        | 'labels.text.fill'
                                                                                                                                                                                                                                                        | 'labels.text.stroke';

                                                                                                                                                                                                                                                          property featureType

                                                                                                                                                                                                                                                          featureType?:
                                                                                                                                                                                                                                                          | 'administrative'
                                                                                                                                                                                                                                                          | 'administrative.country'
                                                                                                                                                                                                                                                          | 'administrative.land_parcel'
                                                                                                                                                                                                                                                          | 'administrative.locality'
                                                                                                                                                                                                                                                          | 'administrative.neighborhood'
                                                                                                                                                                                                                                                          | 'administrative.province'
                                                                                                                                                                                                                                                          | 'all'
                                                                                                                                                                                                                                                          | 'landscape'
                                                                                                                                                                                                                                                          | 'landscape.man_made'
                                                                                                                                                                                                                                                          | 'landscape.natural'
                                                                                                                                                                                                                                                          | 'landscape.natural.landcover'
                                                                                                                                                                                                                                                          | 'landscape.natural.terrain'
                                                                                                                                                                                                                                                          | 'poi'
                                                                                                                                                                                                                                                          | 'poi.attraction'
                                                                                                                                                                                                                                                          | 'poi.business'
                                                                                                                                                                                                                                                          | 'poi.government'
                                                                                                                                                                                                                                                          | 'poi.medical'
                                                                                                                                                                                                                                                          | 'poi.park'
                                                                                                                                                                                                                                                          | 'poi.place_of_worship'
                                                                                                                                                                                                                                                          | 'poi.school'
                                                                                                                                                                                                                                                          | 'poi.sports_complex'
                                                                                                                                                                                                                                                          | 'road'
                                                                                                                                                                                                                                                          | 'road.arterial'
                                                                                                                                                                                                                                                          | 'road.highway'
                                                                                                                                                                                                                                                          | 'road.highway.controlled_access'
                                                                                                                                                                                                                                                          | 'road.local'
                                                                                                                                                                                                                                                          | 'transit'
                                                                                                                                                                                                                                                          | 'transit.line'
                                                                                                                                                                                                                                                          | 'transit.station'
                                                                                                                                                                                                                                                          | 'transit.station.airport'
                                                                                                                                                                                                                                                          | 'transit.station.bus'
                                                                                                                                                                                                                                                          | 'transit.station.rail'
                                                                                                                                                                                                                                                          | 'water';

                                                                                                                                                                                                                                                            property stylers

                                                                                                                                                                                                                                                            stylers: MapTypeStyler[];

                                                                                                                                                                                                                                                              interface MouseEvent

                                                                                                                                                                                                                                                              interface MouseEvent {}
                                                                                                                                                                                                                                                              • MouseEvent gets emitted when the user triggers mouse events on the map.

                                                                                                                                                                                                                                                              property coords

                                                                                                                                                                                                                                                              coords: LatLngLiteral;

                                                                                                                                                                                                                                                                interface PolyMouseEvent

                                                                                                                                                                                                                                                                interface PolyMouseEvent extends MouseEvent {}
                                                                                                                                                                                                                                                                • PolyMouseEvent gets emitted when the user triggers mouse events on a polyline.

                                                                                                                                                                                                                                                                property edge

                                                                                                                                                                                                                                                                edge: number;

                                                                                                                                                                                                                                                                  property path

                                                                                                                                                                                                                                                                  path: number;

                                                                                                                                                                                                                                                                    property vertex

                                                                                                                                                                                                                                                                    vertex: number;

                                                                                                                                                                                                                                                                      Enums

                                                                                                                                                                                                                                                                      enum GoogleMapsScriptProtocol

                                                                                                                                                                                                                                                                      enum GoogleMapsScriptProtocol {
                                                                                                                                                                                                                                                                      HTTP = 1,
                                                                                                                                                                                                                                                                      HTTPS = 2,
                                                                                                                                                                                                                                                                      AUTO = 3,
                                                                                                                                                                                                                                                                      }

                                                                                                                                                                                                                                                                        member AUTO

                                                                                                                                                                                                                                                                        AUTO = 3

                                                                                                                                                                                                                                                                          member HTTP

                                                                                                                                                                                                                                                                          HTTP = 1

                                                                                                                                                                                                                                                                            member HTTPS

                                                                                                                                                                                                                                                                            HTTPS = 2

                                                                                                                                                                                                                                                                              Package Files (22)

                                                                                                                                                                                                                                                                              Dependencies (0)

                                                                                                                                                                                                                                                                              No dependencies.

                                                                                                                                                                                                                                                                              Dev Dependencies (0)

                                                                                                                                                                                                                                                                              No dev dependencies.

                                                                                                                                                                                                                                                                              Peer Dependencies (2)

                                                                                                                                                                                                                                                                              Badge

                                                                                                                                                                                                                                                                              To add a badge like this onejsDocs.io badgeto your package's README, use the codes available below.

                                                                                                                                                                                                                                                                              You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/angular2-google-maps.

                                                                                                                                                                                                                                                                              • Markdown
                                                                                                                                                                                                                                                                                [![jsDocs.io](https://img.shields.io/badge/jsDocs.io-reference-blue)](https://www.jsdocs.io/package/angular2-google-maps)
                                                                                                                                                                                                                                                                              • HTML
                                                                                                                                                                                                                                                                                <a href="https://www.jsdocs.io/package/angular2-google-maps"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>