SebmGoogleMapPolyline - TypeScript

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

Selectors

  • sebm-google-map-polyline

Inputs

  • clickable bound to SebmGoogleMapPolyline.clickable

    Indicates whether this Polyline handles mouse events. Defaults to true.

  • polylineDraggable bound to SebmGoogleMapPolyline.draggable

    If set to true, the user can drag this shape over the map. The geodesic property defines the

    of dragging. Defaults to false.
  • editable bound to SebmGoogleMapPolyline.editable

    If set to true, the user can edit this shape by dragging the control points shown at the

    and on each segment. Defaults to false.
  • geodesic bound to SebmGoogleMapPolyline.geodesic

    When true, edges of the polygon are interpreted as geodesic and will follow the curvature of

    Earth. When false, edges of the polygon are rendered as straight lines in screen space.that the shape of a geodesic polygon may appear to change when dragged, as the dimensionsmaintained relative to the surface of the earth. Defaults to false.
  • strokeColor bound to SebmGoogleMapPolyline.strokeColor

    The stroke color. All CSS3 colors are supported except for extended named colors.

  • strokeWeight bound to SebmGoogleMapPolyline.strokeWeight

    The stroke width in pixels.

  • strokeOpacity bound to SebmGoogleMapPolyline.strokeOpacity

    The stroke opacity between 0.0 and 1.0.

  • visible bound to SebmGoogleMapPolyline.visible

    Whether this polyline is visible on the map. Defaults to true.

  • zIndex bound to SebmGoogleMapPolyline.zIndex

    The zIndex compared to other polys.

Outputs

  • lineClick bound to SebmGoogleMapPolyline.lineClick

    This event is fired when the DOM click event is fired on the Polyline.

  • lineDblClick bound to SebmGoogleMapPolyline.lineDblClick

    This event is fired when the DOM dblclick event is fired on the Polyline.

  • lineDrag bound to SebmGoogleMapPolyline.lineDrag

    This event is repeatedly fired while the user drags the polyline.

  • lineDragEnd bound to SebmGoogleMapPolyline.lineDragEnd

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

  • lineMouseDown bound to SebmGoogleMapPolyline.lineMouseDown

    This event is fired when the DOM mousedown event is fired on the Polyline.

  • lineMouseMove bound to SebmGoogleMapPolyline.lineMouseMove

    This event is fired when the DOM mousemove event is fired on the Polyline.

  • lineMouseOut bound to SebmGoogleMapPolyline.lineMouseOut

    This event is fired on Polyline mouseout.

  • lineMouseOver bound to SebmGoogleMapPolyline.lineMouseOver

    This event is fired on Polyline mouseover.

  • lineMouseUp bound to SebmGoogleMapPolyline.lineMouseUp

    This event is fired whe the DOM mouseup event is fired on the Polyline

  • lineRightClick bound to SebmGoogleMapPolyline.lineRightClick

    This even is fired when the Polyline is right-clicked on.

Constructor

  • constructor(_polylineManager: PolylineManager)

    Not Yet Documented

Members

  • clickable : boolean
    

    Indicates whether this Polyline handles mouse events. Defaults to true.

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

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

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

  • strokeColor : string
    

    The stroke color. All CSS3 colors are supported except for extended named colors.

  • strokeOpacity : number
    

    The stroke opacity between 0.0 and 1.0.

  • strokeWeight : number
    

    The stroke width in pixels.

  • visible : boolean
    

    Whether this polyline is visible on the map. Defaults to true.

  • zIndex : number
    

    The zIndex compared to other polys.

  • lineClick : EventEmitter<PolyMouseEvent>
    

    This event is fired when the DOM click event is fired on the Polyline.

  • lineDblClick : EventEmitter<PolyMouseEvent>
    

    This event is fired when the DOM dblclick event is fired on the Polyline.

  • lineDrag : EventEmitter<MouseEvent>
    

    This event is repeatedly fired while the user drags the polyline.

  • lineDragEnd : EventEmitter<MouseEvent>
    

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

  • lineDragStart : EventEmitter<MouseEvent>
    

    This event is fired when the user starts dragging the polyline.

  • lineMouseDown : EventEmitter<PolyMouseEvent>
    

    This event is fired when the DOM mousedown event is fired on the Polyline.

  • lineMouseMove : EventEmitter<PolyMouseEvent>
    

    This event is fired when the DOM mousemove event is fired on the Polyline.

  • lineMouseOut : EventEmitter<PolyMouseEvent>
    

    This event is fired on Polyline mouseout.

  • lineMouseOver : EventEmitter<PolyMouseEvent>
    

    This event is fired on Polyline mouseover.

  • lineMouseUp : EventEmitter<PolyMouseEvent>
    

    This event is fired whe the DOM mouseup event is fired on the Polyline

  • lineRightClick : EventEmitter<PolyMouseEvent>
    

    This even is fired when the Polyline is right-clicked on.

  • ngOnChanges(changes: SimpleChanges) : any
    

    Not Yet Documented


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