Commit 78c0e519d1f10a58cafd62c178f5b97e7735a3a5

Authored by Artem Halushko
1 parent f12ecdb1

add polygon support

... ... @@ -27,6 +27,7 @@ import { Observable, of, BehaviorSubject, Subject } from 'rxjs';
27 27 import { filter } from 'rxjs/operators';
28 28 import { Polyline } from './polyline';
29 29 import { Polygon } from './polygon';
  30 +import { string } from 'prop-types';
30 31
31 32 export default abstract class LeafletMap {
32 33
... ... @@ -140,15 +141,10 @@ export default abstract class LeafletMap {
140 141 this.map.invalidateSize(true);
141 142 }
142 143
143   -
144 144 onResize() {
145 145
146 146 }
147 147
148   - getTooltips() {
149   - return this.tooltips;//rewrite
150   - }
151   -
152 148 getCenter() {
153 149 return this.map.getCenter();
154 150 }
... ... @@ -247,21 +243,24 @@ export default abstract class LeafletMap {
247 243
248 244 updatePolygons(polyData: Array<Array<any>>) {
249 245 polyData.forEach((data: any) => {
250   - if (data.data.length) {
251   - let dataSource = polyData.map(arr => arr[0]);
  246 + if (data.data.length && data.dataKey.name === this.options.polygonKeyName) {
  247 + if (typeof (data?.data[0][1]) === 'string') {
  248 + data.data = JSON.parse(data.data[0][1]);
  249 + }
252 250 if (this.polygon) {
253   - this.updatePolygon(data, dataSource, this.options);
  251 + this.updatePolygon(data.data, polyData, this.options);
254 252 }
255 253 else {
256   - this.createPolygon(data, dataSource, this.options);
  254 + this.createPolygon(data.data, polyData, this.options);
257 255 }
258 256 }
259   - })
  257 + });
260 258 }
261 259
262 260 createPolygon(data, dataSources, settings) {
263 261 this.ready$.subscribe(() => {
264   - this.polygon = new Polygon(this.map, data.map(data => this.convertPosition(data)), data, dataSources, settings);
  262 + //public map, coordinates, dataSources, settings, onClickListener?
  263 + this.polygon = new Polygon(this.map, data, dataSources, settings);
265 264 const bounds = this.bounds.extend(this.polygon.leafletPoly.getBounds());
266 265 if (bounds.isValid()) {
267 266 this.map.fitBounds(bounds);
... ... @@ -272,7 +271,7 @@ export default abstract class LeafletMap {
272 271
273 272 updatePolygon(data, dataSources, settings) {
274 273 this.ready$.subscribe(() => {
275   - this.poly.updatePolyline(settings, data, dataSources);
  274 + // this.polygon.updatePolygon(settings, data, dataSources);
276 275 });
277 276 }
278 277 }
\ No newline at end of file
... ...
... ... @@ -17,6 +17,7 @@
17 17 import { LatLngExpression, LatLngTuple } from 'leaflet';
18 18
19 19 export interface MapOptions {
  20 + polygonKeyName: any;
20 21 draggebleMarker: any;
21 22 initCallback?: Function,
22 23 defaultZoomLevel?: number,
... ...
... ... @@ -67,15 +67,7 @@ export class MapWidgetController implements MapWidgetInterface {
67 67 }
68 68
69 69 setMarkerLocation = (e) => {
70   - console.log("MapWidgetController -> setMarkerLocation -> e", e)
71   - console.log(this.data);
72   -
73 70 let attributeService = this.ctx.$scope.$injector.get(this.ctx.servicesMap.get('attributeService'));
74   -
75   -
76   - let attributesLocation = [];
77   - let timeseriesLocation = [];
78   - let promises = [];
79 71 forkJoin(
80 72 this.data.filter(data => !!e[data.dataKey.name])
81 73 .map(data => {
... ... @@ -93,7 +85,6 @@ export class MapWidgetController implements MapWidgetInterface {
93 85 );
94 86 })).subscribe(res => {
95 87 console.log("MapWidgetController -> setMarkerLocation -> res", res)
96   -
97 88 });
98 89 }
99 90
... ... @@ -125,11 +116,7 @@ export class MapWidgetController implements MapWidgetInterface {
125 116 if (this.drawRoutes)
126 117 this.map.updatePolylines(parseArray(this.data));
127 118 if (this.settings.showPolygon) {
128   - //console.log(this.data, this.ctx);
129   -
130   - // let dummy = [[37.771121,-22.510761],[37.774581,-22.454885],[37.766575,-22.453683],[37.764268,-22.509945]];
131   - //this.data[0].data = dummy
132   - //this.map.updatePolygons(this.data);
  119 + this.map.updatePolygons(this.data);
133 120 }
134 121 this.map.updateMarkers(parseData(this.data));
135 122 }
... ...
... ... @@ -20,10 +20,9 @@ import { createTooltip } from './maps-utils';
20 20 export class Polygon {
21 21
22 22 leafletPoly: L.Polygon;
23   -
24 23 tooltip;
25 24
26   - constructor(public map, coordinates, dataSources, settings, onClickListener?) {
  25 + constructor(public map, coordinates, dataSources, settings, onClickListener?) {
27 26 this.leafletPoly = L.polygon(coordinates, {
28 27 fill: true,
29 28 fillColor: settings.polygonColor,
... ...