SebmGoogleMapMarker - TypeScript

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>
 `
})

Selectors

  • sebm-google-map-marker

Inputs

  • latitude bound to SebmGoogleMapMarker.latitude

    The latitude position of the marker.

  • longitude bound to SebmGoogleMapMarker.longitude

    The longitude position of the marker.

  • title bound to SebmGoogleMapMarker.title

    The title of the marker.

  • label bound to SebmGoogleMapMarker.label

    The label (a single uppercase character) for the marker.

  • markerDraggable bound to SebmGoogleMapMarker.draggable

    If true, the marker can be dragged. Default value is false.

  • iconUrl bound to SebmGoogleMapMarker.iconUrl

    Icon (the URL of the image) for the foreground.

  • openInfoWindow bound to SebmGoogleMapMarker.openInfoWindow

    Whether to automatically open the child info window when the marker is clicked.

  • opacity bound to SebmGoogleMapMarker.opacity

    The marker's opacity between 0.0 and 1.0.

  • visible bound to SebmGoogleMapMarker.visible

    If true, the marker is visible

  • zIndex bound to SebmGoogleMapMarker.zIndex

    All markers are displayed on the map in order of their zIndex, with higher values displaying in

    of markers with lower values. By default, markers are displayed according to theirposition on screen, with lower markers appearing in front of markers further up the

Outputs

  • markerClick bound to SebmGoogleMapMarker.markerClick

    This event emitter gets emitted when the user clicks on the marker.

  • dragEnd bound to SebmGoogleMapMarker.dragEnd

    This event is fired when the user stops dragging the marker.

  • mouseOver bound to SebmGoogleMapMarker.mouseOver

    This event is fired when the user mouses over the marker.

  • mouseOut bound to SebmGoogleMapMarker.mouseOut

    This event is fired when the user mouses outside the marker.

Constructor

  • constructor(_markerManager: MarkerManager)

    Not Yet Documented

Members

  • latitude : number
    

    The latitude position of the marker.

  • longitude : number
    

    The longitude position of the marker.

  • title : string
    

    The title of the marker.

  • label : string
    

    The label (a single uppercase character) for the marker.

  • draggable : boolean
    

    If true, the marker can be dragged. Default value is false.

  • iconUrl : string
    

    Icon (the URL of the image) for the foreground.

  • visible : boolean
    

    If true, the marker is visible

  • openInfoWindow : boolean
    

    Whether to automatically open the child info window when the marker is clicked.

  • opacity : number
    

    The marker's opacity between 0.0 and 1.0.

  • 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.

  • markerClick : EventEmitter<void>
    

    This event emitter gets emitted when the user clicks on the marker.

  • dragEnd : EventEmitter<MouseEvent>
    

    This event is fired when the user stops dragging the marker.

  • mouseOver : EventEmitter<MouseEvent>
    

    This event is fired when the user mouses over the marker.

  • mouseOut : EventEmitter<MouseEvent>
    

    This event is fired when the user mouses outside the marker.

  • ngAfterContentInit()
    

    Not Yet Documented


exported from core/index defined in core/directives/google-map-marker.ts (line 10)