1 | /// <reference types="googlemaps" />
|
2 | import { AfterContentInit, EventEmitter, OnChanges, OnDestroy, QueryList, SimpleChanges } from '@angular/core';
|
3 | import { PolylineManager } from '../services/managers/polyline-manager';
|
4 | import { MVCEvent } from '../utils/mvcarray-utils';
|
5 | import { AgmPolylineIcon } from './polyline-icon';
|
6 | import { AgmPolylinePoint } from './polyline-point';
|
7 | /**
|
8 | * AgmPolyline renders a polyline on a {@link AgmMap}
|
9 | *
|
10 | * ### Example
|
11 | * ```typescript
|
12 | * import { Component } from '@angular/core';
|
13 | *
|
14 | * @Component({
|
15 | * selector: 'my-map-cmp',
|
16 | * styles: [`
|
17 | * .agm-map-container {
|
18 | * height: 300px;
|
19 | * }
|
20 | * `],
|
21 | * template: `
|
22 | * <agm-map [latitude]="lat" [longitude]="lng" [zoom]="zoom">
|
23 | * <agm-polyline>
|
24 | * <agm-polyline-point [latitude]="latA" [longitude]="lngA">
|
25 | * </agm-polyline-point>
|
26 | * <agm-polyline-point [latitude]="latB" [longitude]="lngB">
|
27 | * </agm-polyline-point>
|
28 | * </agm-polyline>
|
29 | * </agm-map>
|
30 | * `
|
31 | * })
|
32 | * ```
|
33 | */
|
34 | export declare class AgmPolyline implements OnDestroy, OnChanges, AfterContentInit {
|
35 | private _polylineManager;
|
36 | /**
|
37 | * Indicates whether this Polyline handles mouse events. Defaults to true.
|
38 | */
|
39 | clickable: boolean;
|
40 | /**
|
41 | * If set to true, the user can drag this shape over the map. The geodesic property defines the
|
42 | * mode of dragging. Defaults to false.
|
43 | */
|
44 | draggable: boolean;
|
45 | /**
|
46 | * If set to true, the user can edit this shape by dragging the control points shown at the
|
47 | * vertices and on each segment. Defaults to false.
|
48 | */
|
49 | editable: boolean;
|
50 | /**
|
51 | * When true, edges of the polygon are interpreted as geodesic and will follow the curvature of
|
52 | * the Earth. When false, edges of the polygon are rendered as straight lines in screen space.
|
53 | * Note that the shape of a geodesic polygon may appear to change when dragged, as the dimensions
|
54 | * are maintained relative to the surface of the earth. Defaults to false.
|
55 | */
|
56 | geodesic: boolean;
|
57 | /**
|
58 | * The stroke color. All CSS3 colors are supported except for extended named colors.
|
59 | */
|
60 | strokeColor: string;
|
61 | /**
|
62 | * The stroke opacity between 0.0 and 1.0.
|
63 | */
|
64 | strokeOpacity: number;
|
65 | /**
|
66 | * The stroke width in pixels.
|
67 | */
|
68 | strokeWeight: number;
|
69 | /**
|
70 | * Whether this polyline is visible on the map. Defaults to true.
|
71 | */
|
72 | visible: boolean;
|
73 | /**
|
74 | * The zIndex compared to other polys.
|
75 | */
|
76 | zIndex: number;
|
77 | /**
|
78 | * This event is fired when the DOM click event is fired on the Polyline.
|
79 | */
|
80 | lineClick: EventEmitter<google.maps.PolyMouseEvent>;
|
81 | /**
|
82 | * This event is fired when the DOM dblclick event is fired on the Polyline.
|
83 | */
|
84 | lineDblClick: EventEmitter<google.maps.PolyMouseEvent>;
|
85 | /**
|
86 | * This event is repeatedly fired while the user drags the polyline.
|
87 | */
|
88 | lineDrag: EventEmitter<google.maps.MouseEvent>;
|
89 | /**
|
90 | * This event is fired when the user stops dragging the polyline.
|
91 | */
|
92 | lineDragEnd: EventEmitter<google.maps.MouseEvent>;
|
93 | /**
|
94 | * This event is fired when the user starts dragging the polyline.
|
95 | */
|
96 | lineDragStart: EventEmitter<google.maps.MouseEvent>;
|
97 | /**
|
98 | * This event is fired when the DOM mousedown event is fired on the Polyline.
|
99 | */
|
100 | lineMouseDown: EventEmitter<google.maps.PolyMouseEvent>;
|
101 | /**
|
102 | * This event is fired when the DOM mousemove event is fired on the Polyline.
|
103 | */
|
104 | lineMouseMove: EventEmitter<google.maps.PolyMouseEvent>;
|
105 | /**
|
106 | * This event is fired on Polyline mouseout.
|
107 | */
|
108 | lineMouseOut: EventEmitter<google.maps.PolyMouseEvent>;
|
109 | /**
|
110 | * This event is fired on Polyline mouseover.
|
111 | */
|
112 | lineMouseOver: EventEmitter<google.maps.PolyMouseEvent>;
|
113 | /**
|
114 | * This event is fired whe the DOM mouseup event is fired on the Polyline
|
115 | */
|
116 | lineMouseUp: EventEmitter<google.maps.PolyMouseEvent>;
|
117 | /**
|
118 | * This event is fired when the Polyline is right-clicked on.
|
119 | */
|
120 | lineRightClick: EventEmitter<google.maps.PolyMouseEvent>;
|
121 | /**
|
122 | * This event is fired after Polyline's path changes.
|
123 | */
|
124 | polyPathChange: EventEmitter<MVCEvent<google.maps.LatLng>>;
|
125 | /**
|
126 | * @internal
|
127 | */
|
128 | points: QueryList<AgmPolylinePoint>;
|
129 | iconSequences: QueryList<AgmPolylineIcon>;
|
130 | private static _polylineOptionsAttributes;
|
131 | private _id;
|
132 | private _polylineAddedToManager;
|
133 | private _subscriptions;
|
134 | constructor(_polylineManager: PolylineManager);
|
135 | /** @internal */
|
136 | ngAfterContentInit(): void;
|
137 | ngOnChanges(changes: SimpleChanges): any;
|
138 | getPath(): Promise<google.maps.LatLng[]>;
|
139 | private _init;
|
140 | private _addEventListeners;
|
141 | /** @internal */
|
142 | _getPoints(): AgmPolylinePoint[];
|
143 | _getIcons(): Array<AgmPolylineIcon>;
|
144 | /** @internal */
|
145 | id(): string;
|
146 | /** @internal */
|
147 | ngOnDestroy(): void;
|
148 | }
|