|
|
@ -17,28 +17,28 @@ |
|
|
import { MapProviders, UnitedMapSettings } from './map-models'; |
|
|
import { MapProviders, UnitedMapSettings } from './map-models'; |
|
|
import LeafletMap from './leaflet-map'; |
|
|
import LeafletMap from './leaflet-map'; |
|
|
import { |
|
|
import { |
|
|
commonMapSettingsSchema, |
|
|
openstreetMapSettingsSchema, |
|
|
googleMapSettingsSchema, |
|
|
googleMapSettingsSchema, |
|
|
hereMapSettingsSchema, |
|
|
imageMapSettingsSchema, |
|
|
imageMapSettingsSchema, |
|
|
tencentMapSettingsSchema, |
|
|
mapPolygonSchema, |
|
|
commonMapSettingsSchema, |
|
|
mapProviderSchema, |
|
|
routeMapSettingsSchema, |
|
|
markerClusteringSettingsSchema, |
|
|
markerClusteringSettingsSchema, |
|
|
markerClusteringSettingsSchemaLeaflet, |
|
|
markerClusteringSettingsSchemaLeaflet, |
|
|
openstreetMapSettingsSchema, |
|
|
hereMapSettingsSchema, |
|
|
routeMapSettingsSchema, |
|
|
mapProviderSchema, |
|
|
tencentMapSettingsSchema |
|
|
mapPolygonSchema |
|
|
} from './schemes'; |
|
|
} from './schemes'; |
|
|
import { MapWidgetInterface, MapWidgetStaticInterface } from './map-widget.interface'; |
|
|
import { MapWidgetStaticInterface, MapWidgetInterface } from './map-widget.interface'; |
|
|
import { GoogleMap, HEREMap, ImageMap, OpenStreetMap, TencentMap } from './providers'; |
|
|
import { OpenStreetMap, TencentMap, GoogleMap, HEREMap, ImageMap } from './providers'; |
|
|
import { parseArray, parseData, parseFunction, parseWithTranslation } from '@core/utils'; |
|
|
import { parseFunction, parseArray, parseData, parseWithTranslation } from '@core/utils'; |
|
|
import { addCondition, addGroupInfo, addToSchema, initSchema, mergeSchemes } from '@core/schema-utils'; |
|
|
import { initSchema, addToSchema, mergeSchemes, addCondition, addGroupInfo } from '@core/schema-utils'; |
|
|
import { forkJoin } from 'rxjs'; |
|
|
import { of, Subject } from 'rxjs'; |
|
|
import { WidgetContext } from '@app/modules/home/models/widget-component.models'; |
|
|
import { WidgetContext } from '@app/modules/home/models/widget-component.models'; |
|
|
import { getDefCenterPosition } from './maps-utils'; |
|
|
import { getDefCenterPosition } from './maps-utils'; |
|
|
import { JsonSettingsSchema, WidgetActionDescriptor } from '@shared/models/widget.models'; |
|
|
import { JsonSettingsSchema, WidgetActionDescriptor, DatasourceType, widgetType } from '@shared/models/widget.models'; |
|
|
import { EntityId } from '@shared/models/id/entity-id'; |
|
|
import { EntityId } from '@shared/models/id/entity-id'; |
|
|
import { AttributeScope } from '@shared/models/telemetry/telemetry.models'; |
|
|
import { AttributeScope, DataKeyType, LatestTelemetry } from '@shared/models/telemetry/telemetry.models'; |
|
|
import { AttributeService } from '@core/http/attribute.service'; |
|
|
import { AttributeService } from '@core/http/attribute.service'; |
|
|
import { Type } from '@angular/core'; |
|
|
import { Type } from '@angular/core'; |
|
|
import { TranslateService } from '@ngx-translate/core'; |
|
|
import { TranslateService } from '@ngx-translate/core'; |
|
|
@ -47,7 +47,7 @@ import { UtilsService } from '@core/services/utils.service'; |
|
|
// @dynamic
|
|
|
// @dynamic
|
|
|
export class MapWidgetController implements MapWidgetInterface { |
|
|
export class MapWidgetController implements MapWidgetInterface { |
|
|
|
|
|
|
|
|
constructor(public mapProvider: MapProviders, private drawRoutes: boolean, public ctx: WidgetContext, $element: HTMLElement) { |
|
|
constructor(public mapProvider: MapProviders, private drawRoutes: boolean, public ctx: WidgetContext, $element: HTMLElement, isEdit?) { |
|
|
if (this.map) { |
|
|
if (this.map) { |
|
|
this.map.map.remove(); |
|
|
this.map.map.remove(); |
|
|
delete this.map; |
|
|
delete this.map; |
|
|
@ -58,6 +58,9 @@ export class MapWidgetController implements MapWidgetInterface { |
|
|
$element = ctx.$container[0]; |
|
|
$element = ctx.$container[0]; |
|
|
} |
|
|
} |
|
|
this.settings = this.initSettings(ctx.settings); |
|
|
this.settings = this.initSettings(ctx.settings); |
|
|
|
|
|
if (isEdit) { |
|
|
|
|
|
this.settings.draggableMarker = true; |
|
|
|
|
|
} |
|
|
this.settings.tooltipAction = this.getDescriptors('tooltipAction'); |
|
|
this.settings.tooltipAction = this.getDescriptors('tooltipAction'); |
|
|
this.settings.markerClick = this.getDescriptors('markerClick'); |
|
|
this.settings.markerClick = this.getDescriptors('markerClick'); |
|
|
this.settings.polygonClick = this.getDescriptors('polygonClick'); |
|
|
this.settings.polygonClick = this.getDescriptors('polygonClick'); |
|
|
@ -69,6 +72,7 @@ export class MapWidgetController implements MapWidgetInterface { |
|
|
} |
|
|
} |
|
|
parseWithTranslation.setTranslate(this.translate); |
|
|
parseWithTranslation.setTranslate(this.translate); |
|
|
this.map = new MapClass($element, this.settings); |
|
|
this.map = new MapClass($element, this.settings); |
|
|
|
|
|
this.map.setImageAlias(this.subscribeForImageAttribute()); |
|
|
this.map.saveMarkerLocation = this.setMarkerLocation; |
|
|
this.map.saveMarkerLocation = this.setMarkerLocation; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
@ -85,26 +89,28 @@ export class MapWidgetController implements MapWidgetInterface { |
|
|
public static getProvidersSchema(mapProvider: MapProviders) { |
|
|
public static getProvidersSchema(mapProvider: MapProviders) { |
|
|
mapProviderSchema.schema.properties.provider.default = mapProvider; |
|
|
mapProviderSchema.schema.properties.provider.default = mapProvider; |
|
|
return mergeSchemes([mapProviderSchema, |
|
|
return mergeSchemes([mapProviderSchema, |
|
|
...Object.values(providerSets)?.map( |
|
|
...Object.keys(providerSets)?.map( |
|
|
(setting: IProvider) => addCondition(setting?.schema, `model.provider === '${setting.name}'`))]); |
|
|
(key: string) => { const setting = providerSets[key]; return addCondition(setting?.schema, `model.provider === '${setting.name}'`) })]); |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
public static settingsSchema(mapProvider: MapProviders, drawRoutes: boolean): JsonSettingsSchema { |
|
|
public static settingsSchema(mapProvider: MapProviders, drawRoutes: boolean): JsonSettingsSchema { |
|
|
const schema = initSchema(); |
|
|
const schema = initSchema(); |
|
|
addToSchema(schema, this.getProvidersSchema(mapProvider)); |
|
|
addToSchema(schema, this.getProvidersSchema(mapProvider)); |
|
|
if(mapProvider!=='image-map'){ |
|
|
addGroupInfo(schema, 'Map Provider Settings'); |
|
|
addGroupInfo(schema, 'Map Provider Settings'); |
|
|
addToSchema(schema, addCondition(commonMapSettingsSchema, 'model.provider !== "image-map"')); |
|
|
addToSchema(schema, mergeSchemes([commonMapSettingsSchema, addCondition(mapPolygonSchema, 'model.showPolygon === true')])); |
|
|
|
|
|
addGroupInfo(schema, 'Common Map Settings'); |
|
|
addGroupInfo(schema, 'Common Map Settings'); |
|
|
|
|
|
addToSchema(schema, addCondition(mapPolygonSchema, 'model.showPolygon === true', ['showPolygon'])); |
|
|
|
|
|
addGroupInfo(schema, 'Polygon Settings'); |
|
|
if (drawRoutes) { |
|
|
if (drawRoutes) { |
|
|
addToSchema(schema, routeMapSettingsSchema); |
|
|
addToSchema(schema, routeMapSettingsSchema); |
|
|
addGroupInfo(schema, 'Route Map Settings'); |
|
|
addGroupInfo(schema, 'Route Map Settings'); |
|
|
} else if (mapProvider !== 'image-map') { |
|
|
} else { |
|
|
const clusteringSchema = mergeSchemes([markerClusteringSettingsSchema, |
|
|
const clusteringSchema = mergeSchemes([markerClusteringSettingsSchema, |
|
|
addCondition(markerClusteringSettingsSchemaLeaflet, `model.useClusterMarkers === true`)]) |
|
|
addCondition(markerClusteringSettingsSchemaLeaflet, |
|
|
|
|
|
`model.useClusterMarkers === true && model.provider !== "image-map"`)]) |
|
|
addToSchema(schema, clusteringSchema); |
|
|
addToSchema(schema, clusteringSchema); |
|
|
addGroupInfo(schema, 'Markers Clustering Settings'); |
|
|
addGroupInfo(schema, 'Markers Clustering Settings'); |
|
|
}} |
|
|
} |
|
|
return schema; |
|
|
return schema; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
@ -125,9 +131,11 @@ export class MapWidgetController implements MapWidgetInterface { |
|
|
}; |
|
|
}; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
translate = (key: string, defaultTranslation?: string):string => { |
|
|
translate = (key: string, defaultTranslation?: string): string => { |
|
|
return (this.ctx.$injector.get(UtilsService).customTranslation(key, defaultTranslation || key) |
|
|
if (key) |
|
|
|| this.ctx.$injector.get(TranslateService).instant(key)); |
|
|
return (this.ctx.$injector.get(UtilsService).customTranslation(key, defaultTranslation || key) |
|
|
|
|
|
|| this.ctx.$injector.get(TranslateService).instant(key)); |
|
|
|
|
|
else return ''; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
getDescriptors(name: string): { [name: string]: ($event: Event) => void } { |
|
|
getDescriptors(name: string): { [name: string]: ($event: Event) => void } { |
|
|
@ -143,7 +151,7 @@ export class MapWidgetController implements MapWidgetInterface { |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
private onCustomAction(descriptor: WidgetActionDescriptor, $event: any) { |
|
|
private onCustomAction(descriptor: WidgetActionDescriptor, $event: any) { |
|
|
if ($event & $event.stopPropagation) { |
|
|
if ($event && $event.stopPropagation) { |
|
|
$event?.stopPropagation(); |
|
|
$event?.stopPropagation(); |
|
|
} |
|
|
} |
|
|
// safeExecute(parseFunction(descriptor.customFunction, ['$event', 'widgetContext']), [$event, this.ctx])
|
|
|
// safeExecute(parseFunction(descriptor.customFunction, ['$event', 'widgetContext']), [$event, this.ctx])
|
|
|
@ -156,29 +164,48 @@ export class MapWidgetController implements MapWidgetInterface { |
|
|
|
|
|
|
|
|
setMarkerLocation = (e) => { |
|
|
setMarkerLocation = (e) => { |
|
|
const attributeService = this.ctx.$injector.get(AttributeService); |
|
|
const attributeService = this.ctx.$injector.get(AttributeService); |
|
|
forkJoin( |
|
|
|
|
|
this.data.filter(data => !!e[data.dataKey.name]) |
|
|
const entityId: EntityId = { |
|
|
.map(data => { |
|
|
entityType: e.$datasource.entityType, |
|
|
const entityId: EntityId = { |
|
|
id: e.$datasource.entityId |
|
|
entityType: data.datasource.entityType, |
|
|
}; |
|
|
id: data.datasource.entityId |
|
|
const attributes = []; |
|
|
}; |
|
|
const timeseries = []; |
|
|
return attributeService.saveEntityAttributes( |
|
|
const latLngProperties = [this.settings.latKeyName, this.settings.lngKeyName, this.settings.xPosKeyName, this.settings.yPosKeyName]; |
|
|
entityId, |
|
|
e.$datasource.dataKeys.forEach(key => { |
|
|
AttributeScope.SHARED_SCOPE, |
|
|
if (latLngProperties.includes(key.name)) { |
|
|
[{ |
|
|
const value = { |
|
|
key: data.dataKey.name, |
|
|
key: key.name, |
|
|
value: e[data.dataKey.name] |
|
|
value: e[key.name] |
|
|
}] |
|
|
}; |
|
|
); |
|
|
if (key.type === DataKeyType.attribute) { |
|
|
})).subscribe(res => { |
|
|
attributes.push(value) |
|
|
}); |
|
|
} |
|
|
|
|
|
if (key.type === DataKeyType.timeseries) { |
|
|
|
|
|
timeseries.push(value) |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
}); |
|
|
|
|
|
if (timeseries.length) { |
|
|
|
|
|
attributeService.saveEntityTimeseries( |
|
|
|
|
|
entityId, |
|
|
|
|
|
LatestTelemetry.LATEST_TELEMETRY, |
|
|
|
|
|
timeseries |
|
|
|
|
|
).subscribe(() => { }); |
|
|
|
|
|
} |
|
|
|
|
|
if (attributes.length) { |
|
|
|
|
|
attributeService.saveEntityAttributes( |
|
|
|
|
|
entityId, |
|
|
|
|
|
AttributeScope.SERVER_SCOPE, |
|
|
|
|
|
attributes |
|
|
|
|
|
).subscribe(() => { }); |
|
|
|
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
initSettings(settings: UnitedMapSettings): UnitedMapSettings { |
|
|
initSettings(settings: UnitedMapSettings): UnitedMapSettings { |
|
|
const functionParams = ['data', 'dsData', 'dsIndex']; |
|
|
const functionParams = ['data', 'dsData', 'dsIndex']; |
|
|
this.provider = settings.provider || this.mapProvider; |
|
|
this.provider = settings.provider || this.mapProvider; |
|
|
if (!settings.mapProviderHere) { |
|
|
if (this.provider === MapProviders.here && !settings.mapProviderHere) { |
|
|
if (settings.mapProvider && hereProviders.includes(settings.mapProvider)) |
|
|
if (settings.mapProvider && hereProviders.includes(settings.mapProvider)) |
|
|
settings.mapProviderHere = settings.mapProvider |
|
|
settings.mapProviderHere = settings.mapProvider |
|
|
else settings.mapProviderHere = hereProviders[0]; |
|
|
else settings.mapProviderHere = hereProviders[0]; |
|
|
@ -213,8 +240,7 @@ export class MapWidgetController implements MapWidgetInterface { |
|
|
if (this.settings.draggableMarker) { |
|
|
if (this.settings.draggableMarker) { |
|
|
this.map.setDataSources(parseData(this.data)); |
|
|
this.map.setDataSources(parseData(this.data)); |
|
|
} |
|
|
} |
|
|
else |
|
|
this.map.updateMarkers(parseData(this.data)); |
|
|
this.map.updateMarkers(parseData(this.data)); |
|
|
|
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
resize() { |
|
|
resize() { |
|
|
@ -222,6 +248,48 @@ export class MapWidgetController implements MapWidgetInterface { |
|
|
this.map.onResize(); |
|
|
this.map.onResize(); |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
subscribeForImageAttribute() { |
|
|
|
|
|
const imageEntityAlias = this.settings.imageEntityAlias; |
|
|
|
|
|
const imageUrlAttribute = this.settings.imageUrlAttribute; |
|
|
|
|
|
if (!imageEntityAlias || !imageUrlAttribute) { |
|
|
|
|
|
return of(false); |
|
|
|
|
|
} |
|
|
|
|
|
const entityAliasId = this.ctx.aliasController.getEntityAliasId(imageEntityAlias); |
|
|
|
|
|
if (!entityAliasId) { |
|
|
|
|
|
return of(false); |
|
|
|
|
|
} |
|
|
|
|
|
const datasources = [ |
|
|
|
|
|
{ |
|
|
|
|
|
type: DatasourceType.entity, |
|
|
|
|
|
name: imageEntityAlias, |
|
|
|
|
|
aliasName: imageEntityAlias, |
|
|
|
|
|
entityAliasId, |
|
|
|
|
|
dataKeys: [ |
|
|
|
|
|
{ |
|
|
|
|
|
type: DataKeyType.attribute, |
|
|
|
|
|
name: imageUrlAttribute, |
|
|
|
|
|
label: imageUrlAttribute, |
|
|
|
|
|
settings: {}, |
|
|
|
|
|
_hash: Math.random() |
|
|
|
|
|
} |
|
|
|
|
|
] |
|
|
|
|
|
} |
|
|
|
|
|
]; |
|
|
|
|
|
const result = new Subject(); |
|
|
|
|
|
const imageUrlSubscriptionOptions = { |
|
|
|
|
|
datasources, |
|
|
|
|
|
useDashboardTimewindow: false, |
|
|
|
|
|
type: widgetType.latest, |
|
|
|
|
|
callbacks: { |
|
|
|
|
|
onDataUpdated: (subscription) => { |
|
|
|
|
|
result.next(subscription?.data[0]?.data[0]); |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
}; |
|
|
|
|
|
this.ctx.subscriptionApi.createSubscription(imageUrlSubscriptionOptions, true).subscribe(() => { }); |
|
|
|
|
|
return result; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
onDestroy() { |
|
|
onDestroy() { |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
Igor Kulikov
6 years ago