diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/maps/maps-utils.ts b/ui-ngx/src/app/modules/home/components/widget/lib/maps/maps-utils.ts index bb939572f5..0482f4cec5 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/maps/maps-utils.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/maps/maps-utils.ts @@ -41,22 +41,6 @@ export function createTooltip(target: L.Layer, return popup; } -export function disablePopup(target: L.Layer) { - if (target.isPopupOpen()) { - target.closePopup(); - } - target.unbindPopup(); - target.off('popupopen'); -} - -export function enablePopup(target: L.Layer, popup: L.Popup, - settings: MarkerSettings | PolylineSettings | PolygonSettings, datasource: Datasource) { - target.bindPopup(popup); - target.on('popupopen', () => { - bindPopupActions(popup, settings, datasource); - }); -} - export function bindPopupActions(popup: L.Popup, settings: MarkerSettings | PolylineSettings | PolygonSettings, datasource: Datasource) { const actions = popup.getElement().getElementsByClassName('tb-custom-action'); diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/maps/markers.ts b/ui-ngx/src/app/modules/home/components/widget/lib/maps/markers.ts index d9e297b1cb..1962828710 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/maps/markers.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/maps/markers.ts @@ -23,7 +23,7 @@ import { MarkerSettings, UnitedMapSettings } from './map-models'; -import { bindPopupActions, createTooltip, disablePopup, enablePopup, } from './maps-utils'; +import { bindPopupActions, createTooltip } from './maps-utils'; import { aspectCache, fillPattern, parseWithTranslation, processPattern, safeExecute } from './common-maps-utils'; import tinycolor from 'tinycolor2'; import { isDefined, isDefinedAndNotNull } from '@core/utils'; @@ -37,7 +37,6 @@ export class Marker { tooltip: L.Popup; data: FormattedData; dataSources: FormattedData[]; - isDragging = false; constructor(private map: LeafletMap, private location: L.LatLng, public settings: UnitedMapSettings, data?: FormattedData, dataSources?, onDragendListener?) { @@ -65,30 +64,24 @@ export class Marker { } if (this.settings.markerClick) { - if (!this.isDragging) { - this.leafletMarker.on('click', (event: LeafletMouseEvent) => { - for (const action in this.settings.markerClick) { - if (typeof (this.settings.markerClick[action]) === 'function') { - this.settings.markerClick[action](event.originalEvent, this.data.$datasource); - } - } - }); - } + this.leafletMarker.on('click', (event: LeafletMouseEvent) => { + for (const action in this.settings.markerClick) { + if (typeof (this.settings.markerClick[action]) === 'function') { + this.settings.markerClick[action](event.originalEvent, this.data.$datasource); + } + } + }); } if (settings.draggableMarker && onDragendListener) { + this.leafletMarker.on('pm:dragstart', (e) => { + (this.leafletMarker.dragging as any)._draggable = { _moved: true }; + (this.leafletMarker.dragging as any)._enabled = true; + }); this.leafletMarker.on('pm:dragend', (e) => { onDragendListener(e, this.data); - this.isDragging = false; - if (settings.showTooltip && settings.showTooltipAction === 'click') { - enablePopup(this.leafletMarker, this.tooltip, settings, this.data.$datasource); - } - }); - this.leafletMarker.on('pm:dragstart', (e) => { - this.isDragging = true; - if (settings.showTooltip && settings.showTooltipAction === 'click') { - disablePopup(this.leafletMarker); - } + delete (this.leafletMarker.dragging as any)._draggable; + delete (this.leafletMarker.dragging as any)._enabled; }); } } diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/maps/providers/image-map.ts b/ui-ngx/src/app/modules/home/components/widget/lib/maps/providers/image-map.ts index 9316d7b688..9b97b830a7 100644 --- a/ui-ngx/src/app/modules/home/components/widget/lib/maps/providers/image-map.ts +++ b/ui-ngx/src/app/modules/home/components/widget/lib/maps/providers/image-map.ts @@ -29,6 +29,7 @@ import { DataSet, DatasourceType, widgetType } from '@shared/models/widget.model import { DataKeyType } from '@shared/models/telemetry/telemetry.models'; import { WidgetSubscriptionOptions } from '@core/api/widget-api.models'; import { isDefinedAndNotNull, isEmptyStr } from '@core/utils'; +import { EntityDataPageLink } from '@shared/models/query/query.models'; const maxZoom = 4; // ? @@ -88,6 +89,7 @@ export class ImageMap extends LeafletMap { let isUpdate = false; const imageUrlSubscriptionOptions: WidgetSubscriptionOptions = { datasources, + hasDataPageLink: true, useDashboardTimewindow: false, type: widgetType.latest, callbacks: { @@ -97,7 +99,15 @@ export class ImageMap extends LeafletMap { } } }; - this.ctx.subscriptionApi.createSubscription(imageUrlSubscriptionOptions, true).subscribe(() => { }); + this.ctx.subscriptionApi.createSubscription(imageUrlSubscriptionOptions, true).subscribe((subscription) => { + const pageLink: EntityDataPageLink = { + page: 0, + pageSize: 1, + textSearch: null, + dynamic: true + }; + subscription.subscribeAllForPaginatedData(pageLink, null); + }); return this.imageFromAlias(result); }