Commit 2bd1a796e00c491d18e238bfdd9872a5e458e071

Authored by Artem Halushko
1 parent 0ce514b5

image map alias image support

@@ -257,8 +257,6 @@ export default abstract class LeafletMap { @@ -257,8 +257,6 @@ export default abstract class LeafletMap {
257 private createMarker(key: string, data: FormattedData, dataSources: FormattedData[], settings: MarkerSettings) { 257 private createMarker(key: string, data: FormattedData, dataSources: FormattedData[], settings: MarkerSettings) {
258 this.ready$.subscribe(() => { 258 this.ready$.subscribe(() => {
259 const newMarker = new Marker(this.convertPosition(data), settings, data, dataSources, this.dragMarker); 259 const newMarker = new Marker(this.convertPosition(data), settings, data, dataSources, this.dragMarker);
260 - console.log(this.bounds);  
261 -  
262 this.fitBounds(this.bounds.extend(newMarker.leafletMarker.getLatLng()), settings.draggableMarker && this.markers.size < 2); 260 this.fitBounds(this.bounds.extend(newMarker.leafletMarker.getLatLng()), settings.draggableMarker && this.markers.size < 2);
263 this.markers.set(key, newMarker); 261 this.markers.set(key, newMarker);
264 if (this.options.useClusterMarkers) { 262 if (this.options.useClusterMarkers) {
@@ -294,7 +292,7 @@ export default abstract class LeafletMap { @@ -294,7 +292,7 @@ export default abstract class LeafletMap {
294 } 292 }
295 } 293 }
296 294
297 - setImageAlias(alias:Observable<any>){ 295 + setImageAlias(alias:Observable<any>){
298 } 296 }
299 297
300 // Polyline 298 // Polyline
@@ -31,9 +31,9 @@ import { @@ -31,9 +31,9 @@ import {
31 } from './schemes'; 31 } from './schemes';
32 import { MapWidgetStaticInterface, MapWidgetInterface } from './map-widget.interface'; 32 import { MapWidgetStaticInterface, MapWidgetInterface } from './map-widget.interface';
33 import { OpenStreetMap, TencentMap, GoogleMap, HEREMap, ImageMap } from './providers'; 33 import { OpenStreetMap, TencentMap, GoogleMap, HEREMap, ImageMap } from './providers';
34 -import { parseFunction, parseArray, parseData, safeExecute, parseWithTranslation } from '@core/utils'; 34 +import { parseFunction, parseArray, parseData, parseWithTranslation } from '@core/utils';
35 import { initSchema, addToSchema, mergeSchemes, addCondition, addGroupInfo } from '@core/schema-utils'; 35 import { initSchema, addToSchema, mergeSchemes, addCondition, addGroupInfo } from '@core/schema-utils';
36 -import { forkJoin, of, Observable } from 'rxjs'; 36 +import { of, Subject } from 'rxjs';
37 import { WidgetContext } from '@app/modules/home/models/widget-component.models'; 37 import { WidgetContext } from '@app/modules/home/models/widget-component.models';
38 import { getDefCenterPosition } from './maps-utils'; 38 import { getDefCenterPosition } from './maps-utils';
39 import { JsonSettingsSchema, WidgetActionDescriptor, DatasourceType, widgetType } from '@shared/models/widget.models'; 39 import { JsonSettingsSchema, WidgetActionDescriptor, DatasourceType, widgetType } from '@shared/models/widget.models';
@@ -48,7 +48,6 @@ import { UtilsService } from '@core/services/utils.service'; @@ -48,7 +48,6 @@ import { UtilsService } from '@core/services/utils.service';
48 export class MapWidgetController implements MapWidgetInterface { 48 export class MapWidgetController implements MapWidgetInterface {
49 49
50 constructor(public mapProvider: MapProviders, private drawRoutes: boolean, public ctx: WidgetContext, $element: HTMLElement) { 50 constructor(public mapProvider: MapProviders, private drawRoutes: boolean, public ctx: WidgetContext, $element: HTMLElement) {
51 - console.log('MapWidgetController -> constructor -> ctx', ctx)  
52 if (this.map) { 51 if (this.map) {
53 this.map.map.remove(); 52 this.map.map.remove();
54 delete this.map; 53 delete this.map;
@@ -85,7 +84,6 @@ export class MapWidgetController implements MapWidgetInterface { @@ -85,7 +84,6 @@ export class MapWidgetController implements MapWidgetInterface {
85 } 84 }
86 85
87 public static getProvidersSchema(mapProvider: MapProviders) { 86 public static getProvidersSchema(mapProvider: MapProviders) {
88 - console.log('MapWidgetController -> getProvidersSchema -> mapProvider', mapProvider)  
89 mapProviderSchema.schema.properties.provider.default = mapProvider; 87 mapProviderSchema.schema.properties.provider.default = mapProvider;
90 return mergeSchemes([mapProviderSchema, 88 return mergeSchemes([mapProviderSchema,
91 ...Object.keys(providerSets)?.map( 89 ...Object.keys(providerSets)?.map(
@@ -178,7 +176,7 @@ export class MapWidgetController implements MapWidgetInterface { @@ -178,7 +176,7 @@ export class MapWidgetController implements MapWidgetInterface {
178 entityId, 176 entityId,
179 AttributeScope.SHARED_SCOPE, 177 AttributeScope.SHARED_SCOPE,
180 keys 178 keys
181 - ).subscribe(res => { 179 + ).subscribe(() => {
182 }); 180 });
183 } 181 }
184 182
@@ -255,15 +253,19 @@ export class MapWidgetController implements MapWidgetInterface { @@ -255,15 +253,19 @@ export class MapWidgetController implements MapWidgetInterface {
255 ] 253 ]
256 } 254 }
257 ]; 255 ];
  256 + const result = new Subject();
258 const imageUrlSubscriptionOptions = { 257 const imageUrlSubscriptionOptions = {
259 datasources, 258 datasources,
260 useDashboardTimewindow: false, 259 useDashboardTimewindow: false,
261 type: widgetType.latest, 260 type: widgetType.latest,
262 callbacks: { 261 callbacks: {
263 - onDataUpdated: (subscription, apply) => { } 262 + onDataUpdated: (subscription) => {
  263 + result.next(subscription.data[0].data[0]);
  264 + }
264 } 265 }
265 }; 266 };
266 - return this.ctx.subscriptionApi.createSubscription(imageUrlSubscriptionOptions, true); 267 + this.ctx.subscriptionApi.createSubscription(imageUrlSubscriptionOptions, true).subscribe(() => { });
  268 + return result;
267 } 269 }
268 270
269 onDestroy() { 271 onDestroy() {
@@ -16,10 +16,10 @@ @@ -16,10 +16,10 @@
16 16
17 import L, { LatLngLiteral } from 'leaflet'; 17 import L, { LatLngLiteral } from 'leaflet';
18 import LeafletMap from '../leaflet-map'; 18 import LeafletMap from '../leaflet-map';
19 -import { MapSettings, UnitedMapSettings } from '../map-models'; 19 +import { UnitedMapSettings } from '../map-models';
20 import { aspectCache, parseFunction } from '@app/core/utils'; 20 import { aspectCache, parseFunction } from '@app/core/utils';
21 import { Observable } from 'rxjs'; 21 import { Observable } from 'rxjs';
22 -import { skipLast, map, filter, switchMap } from 'rxjs/operators'; 22 +import { map, filter } from 'rxjs/operators';
23 23
24 const maxZoom = 4;// ? 24 const maxZoom = 4;// ?
25 25
@@ -29,11 +29,13 @@ export class ImageMap extends LeafletMap { @@ -29,11 +29,13 @@ export class ImageMap extends LeafletMap {
29 aspect = 0; 29 aspect = 0;
30 width = 0; 30 width = 0;
31 height = 0; 31 height = 0;
  32 + imageUrl;
32 33
33 constructor($container: HTMLElement, options: UnitedMapSettings) { 34 constructor($container: HTMLElement, options: UnitedMapSettings) {
34 super($container, options); 35 super($container, options);
35 options.posFunction = parseFunction(options.posFunction, ['origXPos', 'origYPos']) as ((rigXPos, origYPos) => { x, y }); 36 options.posFunction = parseFunction(options.posFunction, ['origXPos', 'origYPos']) as ((rigXPos, origYPos) => { x, y });
36 - aspectCache(options.mapUrl).subscribe(aspect => { 37 + this.imageUrl = options.mapUrl;
  38 + aspectCache(this.imageUrl).subscribe(aspect => {
37 this.aspect = aspect; 39 this.aspect = aspect;
38 this.onResize(); 40 this.onResize();
39 super.setMap(this.map); 41 super.setMap(this.map);
@@ -43,9 +45,12 @@ export class ImageMap extends LeafletMap { @@ -43,9 +45,12 @@ export class ImageMap extends LeafletMap {
43 45
44 setImageAlias(alias: Observable<any>) { 46 setImageAlias(alias: Observable<any>) {
45 alias.pipe(filter(result => result), 47 alias.pipe(filter(result => result),
46 - map(subscription => subscription.data[1])).subscribe(res => {  
47 - console.log("ImageMap -> setImageAlias -> res", res)  
48 - 48 + filter(result => result), map(el => el[1])).subscribe(res => {
  49 + this.imageUrl = res;
  50 + aspectCache(res).subscribe(aspect => {
  51 + this.aspect = aspect;
  52 + this.onResize(true);
  53 + })
49 }) 54 })
50 } 55 }
51 56
@@ -64,8 +69,7 @@ export class ImageMap extends LeafletMap { @@ -64,8 +69,7 @@ export class ImageMap extends LeafletMap {
64 if (this.imageOverlay) { 69 if (this.imageOverlay) {
65 this.imageOverlay.setBounds(bounds); 70 this.imageOverlay.setBounds(bounds);
66 } else { 71 } else {
67 - this.imageOverlay = L.imageOverlay(this.options.mapUrl, bounds).addTo(this.map);  
68 - 72 + this.imageOverlay = L.imageOverlay(this.imageUrl, bounds).addTo(this.map);
69 } 73 }
70 const padding = 200 * maxZoom; 74 const padding = 200 * maxZoom;
71 southWest = this.pointToLatLng(-padding, h + padding); 75 southWest = this.pointToLatLng(-padding, h + padding);
@@ -127,7 +131,6 @@ export class ImageMap extends LeafletMap { @@ -127,7 +131,6 @@ export class ImageMap extends LeafletMap {
127 } 131 }
128 132
129 convertPosition(expression): L.LatLng { 133 convertPosition(expression): L.LatLng {
130 - console.log("ImageMap -> expression", expression)  
131 return this.pointToLatLng( 134 return this.pointToLatLng(
132 expression[this.options.xPosKeyName] * this.width, 135 expression[this.options.xPosKeyName] * this.width,
133 expression[this.options.yPosKeyName] * this.height); 136 expression[this.options.yPosKeyName] * this.height);
@@ -335,7 +335,7 @@ export const commonMapSettingsSchema = @@ -335,7 +335,7 @@ export const commonMapSettingsSchema =
335 colorFunction: { 335 colorFunction: {
336 title: 'Color function: f(data, dsData, dsIndex)', 336 title: 'Color function: f(data, dsData, dsIndex)',
337 type: 'string' 337 type: 'string'
338 - }, 338 + },
339 markerImage: { 339 markerImage: {
340 title: 'Custom marker image', 340 title: 'Custom marker image',
341 type: 'string' 341 type: 'string'
@@ -434,7 +434,7 @@ export const commonMapSettingsSchema = @@ -434,7 +434,7 @@ export const commonMapSettingsSchema =
434 type: 'image' 434 type: 'image'
435 } 435 }
436 ] 436 ]
437 - } 437 + }
438 ] 438 ]
439 }; 439 };
440 440
@@ -12,10 +12,6 @@ @@ -12,10 +12,6 @@
12 "element", 12 "element",
13 "tb", 13 "tb",
14 "kebab-case" 14 "kebab-case"
15 - ],  
16 - "import-blacklist": [  
17 - true,  
18 - ["^.*/public-api$"]  
19 - ] 15 + ]
20 } 16 }
21 } 17 }
@@ -11,7 +11,8 @@ @@ -11,7 +11,8 @@
11 }, 11 },
12 "import-blacklist": [ 12 "import-blacklist": [
13 true, 13 true,
14 - "rxjs/Rx" 14 + "rxjs/Rx",
  15 + "^.*/public-api$"
15 ], 16 ],
16 "interface-name": false, 17 "interface-name": false,
17 "max-classes-per-file": false, 18 "max-classes-per-file": false,