Commit ac0a3fdf5cd7c56e4fafc38649867991c64adbb2

Authored by Kalutka Zhenya
1 parent 93155fb1

update logics

@@ -30,6 +30,7 @@ import { Datasource, DatasourceData } from '@shared/models/widget.models'; @@ -30,6 +30,7 @@ import { Datasource, DatasourceData } from '@shared/models/widget.models';
30 import _ from 'lodash'; 30 import _ from 'lodash';
31 import { mapProviderSchema, providerSets } from '@home/components/widget/lib/maps/schemes'; 31 import { mapProviderSchema, providerSets } from '@home/components/widget/lib/maps/schemes';
32 import { addCondition, mergeSchemes } from '@core/schema-utils'; 32 import { addCondition, mergeSchemes } from '@core/schema-utils';
  33 +import L, {Projection} from "leaflet";
33 34
34 export function getProviderSchema(mapProvider: MapProviders, ignoreImageMap = false) { 35 export function getProviderSchema(mapProvider: MapProviders, ignoreImageMap = false) {
35 const providerSchema = _.cloneDeep(mapProviderSchema); 36 const providerSchema = _.cloneDeep(mapProviderSchema);
@@ -443,3 +444,21 @@ export function createLoadingDiv(loadingText: string): JQuery<HTMLElement> { @@ -443,3 +444,21 @@ export function createLoadingDiv(loadingText: string): JQuery<HTMLElement> {
443 </div> 444 </div>
444 `); 445 `);
445 } 446 }
  447 +
  448 +export function checkLngLat(point: L.LatLng, southWest: L.LatLng, northEast: L.LatLng, offset = 0): L.LatLng {
  449 + const maxLngMap = northEast.lng - offset;
  450 + const minLngMap = southWest.lng + offset;
  451 + const maxLatMap = northEast.lat - offset;
  452 + const minLatMap = southWest.lat + offset;
  453 + if (point.lng > maxLngMap) {
  454 + point.lng = maxLngMap;
  455 + } else if (point.lng < minLngMap) {
  456 + point.lng = minLngMap;
  457 + }
  458 + if (point.lat > maxLatMap) {
  459 + point.lat = maxLatMap;
  460 + } else if (point.lat < minLatMap) {
  461 + point.lat = minLatMap;
  462 + }
  463 + return point;
  464 +}
@@ -46,6 +46,7 @@ import { @@ -46,6 +46,7 @@ import {
46 createTooltip, 46 createTooltip,
47 } from '@home/components/widget/lib/maps/maps-utils'; 47 } from '@home/components/widget/lib/maps/maps-utils';
48 import { 48 import {
  49 + checkLngLat,
49 createLoadingDiv, 50 createLoadingDiv,
50 parseArray, 51 parseArray,
51 parseData, 52 parseData,
@@ -79,6 +80,8 @@ export default abstract class LeafletMap { @@ -79,6 +80,8 @@ export default abstract class LeafletMap {
79 updatePending = false; 80 updatePending = false;
80 addMarkers: L.Marker[] = []; 81 addMarkers: L.Marker[] = [];
81 addPolygons: L.Polygon[] = []; 82 addPolygons: L.Polygon[] = [];
  83 + southWest = new L.LatLng(-Projection.SphericalMercator['MAX_LATITUDE'], -180);
  84 + northEast = new L.LatLng(Projection.SphericalMercator['MAX_LATITUDE'], 180);
82 85
83 protected constructor(public ctx: WidgetContext, 86 protected constructor(public ctx: WidgetContext,
84 public $container: HTMLElement, 87 public $container: HTMLElement,
@@ -423,26 +426,8 @@ export default abstract class LeafletMap { @@ -423,26 +426,8 @@ export default abstract class LeafletMap {
423 }).filter(el => !!el); 426 }).filter(el => !!el);
424 } 427 }
425 428
426 -  
427 - checkLngLat(position: L.LatLng, polygonOffset: number = 0){  
428 - const maxLatitude = Projection.SphericalMercator['MAX_LATITUDE'];  
429 - const minLatitude = -maxLatitude;  
430 - if (position.lng > 180 - polygonOffset) {  
431 - position.lng = 180 - polygonOffset;  
432 - } else if (position.lng < -180) {  
433 - position.lng= -180;  
434 - }  
435 -  
436 - if(position.lat > maxLatitude){  
437 - position.lat = maxLatitude;  
438 - }else if(position.lat < minLatitude + polygonOffset){  
439 - position.lat = minLatitude + polygonOffset;  
440 - }  
441 - return position;  
442 - }  
443 -  
444 - convertToCustomFormat(position: L.LatLng, polygonOffset: number = 0): object {  
445 - position = this.checkLngLat(position,polygonOffset) 429 + convertToCustomFormat(position: L.LatLng, offset = 0): object {
  430 + position = checkLngLat(position, this.southWest, this.northEast, offset);
446 431
447 return { 432 return {
448 [this.options.latKeyName]: position.lat, 433 [this.options.latKeyName]: position.lat,
@@ -754,7 +739,7 @@ export default abstract class LeafletMap { @@ -754,7 +739,7 @@ export default abstract class LeafletMap {
754 } 739 }
755 if(this.options.provider !== MapProviders.image) { 740 if(this.options.provider !== MapProviders.image) {
756 for (let key in e.layer._latlngs[0]) { 741 for (let key in e.layer._latlngs[0]) {
757 - e.layer._latlngs[0][key] = this.checkLngLat(e.layer._latlngs[0][key]); 742 + e.layer._latlngs[0][key] = checkLngLat(e.layer._latlngs[0][key], this.southWest, this.northEast);
758 } 743 }
759 } 744 }
760 this.savePolygonLocation({ ...data, ...this.convertPolygonToCustomFormat(e.layer._latlngs) }).subscribe(); 745 this.savePolygonLocation({ ...data, ...this.convertPolygonToCustomFormat(e.layer._latlngs) }).subscribe();
@@ -16,10 +16,15 @@ @@ -16,10 +16,15 @@
16 16
17 import L, { LatLngBounds, LatLngLiteral, LatLngTuple } from 'leaflet'; 17 import L, { LatLngBounds, LatLngLiteral, LatLngTuple } from 'leaflet';
18 import LeafletMap from '../leaflet-map'; 18 import LeafletMap from '../leaflet-map';
19 -import {MapImage, MapProviders, PosFuncton, UnitedMapSettings} from '../map-models'; 19 +import { MapImage, PosFuncton, UnitedMapSettings } from '../map-models';
20 import { Observable, ReplaySubject } from 'rxjs'; 20 import { Observable, ReplaySubject } from 'rxjs';
21 import { filter, map, mergeMap } from 'rxjs/operators'; 21 import { filter, map, mergeMap } from 'rxjs/operators';
22 -import { aspectCache, calculateNewPointCoordinate, parseFunction } from '@home/components/widget/lib/maps/common-maps-utils'; 22 +import {
  23 + aspectCache,
  24 + calculateNewPointCoordinate,
  25 + checkLngLat,
  26 + parseFunction
  27 +} from '@home/components/widget/lib/maps/common-maps-utils';
23 import { WidgetContext } from '@home/models/widget-component.models'; 28 import { WidgetContext } from '@home/models/widget-component.models';
24 import { DataSet, DatasourceType, widgetType } from '@shared/models/widget.models'; 29 import { DataSet, DatasourceType, widgetType } from '@shared/models/widget.models';
25 import { DataKeyType } from '@shared/models/telemetry/telemetry.models'; 30 import { DataKeyType } from '@shared/models/telemetry/telemetry.models';
@@ -132,9 +137,9 @@ export class ImageMap extends LeafletMap { @@ -132,9 +137,9 @@ export class ImageMap extends LeafletMap {
132 updateBounds(updateImage?: boolean, lastCenterPos?) { 137 updateBounds(updateImage?: boolean, lastCenterPos?) {
133 const w = this.width; 138 const w = this.width;
134 const h = this.height; 139 const h = this.height;
135 - let southWest = this.pointToLatLng(0, h);  
136 - let northEast = this.pointToLatLng(w, 0);  
137 - const bounds = new L.LatLngBounds(southWest, northEast); 140 + this.southWest = this.pointToLatLng(0, h);
  141 + this.northEast = this.pointToLatLng(w, 0);
  142 + const bounds = new L.LatLngBounds(this.southWest, this.northEast);
138 143
139 if (updateImage && this.imageOverlay) { 144 if (updateImage && this.imageOverlay) {
140 this.imageOverlay.remove(); 145 this.imageOverlay.remove();
@@ -147,8 +152,8 @@ export class ImageMap extends LeafletMap { @@ -147,8 +152,8 @@ export class ImageMap extends LeafletMap {
147 this.imageOverlay = L.imageOverlay(this.imageUrl, bounds).addTo(this.map); 152 this.imageOverlay = L.imageOverlay(this.imageUrl, bounds).addTo(this.map);
148 } 153 }
149 const padding = 200 * maxZoom; 154 const padding = 200 * maxZoom;
150 - southWest = this.pointToLatLng(-padding, h + padding);  
151 - northEast = this.pointToLatLng(w + padding, -padding); 155 + const southWest = this.pointToLatLng(-padding, h + padding);
  156 + const northEast = this.pointToLatLng(w + padding, -padding);
152 const maxBounds = new L.LatLngBounds(southWest, northEast); 157 const maxBounds = new L.LatLngBounds(southWest, northEast);
153 this.map.setMaxBounds(maxBounds); 158 this.map.setMaxBounds(maxBounds);
154 if (lastCenterPos) { 159 if (lastCenterPos) {
@@ -257,9 +262,7 @@ export class ImageMap extends LeafletMap { @@ -257,9 +262,7 @@ export class ImageMap extends LeafletMap {
257 return L.CRS.Simple.latLngToPoint(latLng, maxZoom - 1); 262 return L.CRS.Simple.latLngToPoint(latLng, maxZoom - 1);
258 } 263 }
259 264
260 - convertToCustomFormat(position: L.LatLng, polygonOffset: number = 0, width = this.width, height = this.height): object {  
261 - position.lng += polygonOffset;  
262 - position.lat -= polygonOffset; 265 + convertToCustomFormat(position: L.LatLng, offset = 0, width = this.width, height = this.height): object {
263 const point = this.latLngToPoint(position); 266 const point = this.latLngToPoint(position);
264 const customX = calculateNewPointCoordinate(point.x, width); 267 const customX = calculateNewPointCoordinate(point.x, width);
265 const customY = calculateNewPointCoordinate(point.y, height); 268 const customY = calculateNewPointCoordinate(point.y, height);
@@ -275,15 +278,7 @@ export class ImageMap extends LeafletMap { @@ -275,15 +278,7 @@ export class ImageMap extends LeafletMap {
275 point.y = height; 278 point.y = height;
276 } 279 }
277 280
278 - const customLatLng = this.pointToLatLng(point.x, point.y);  
279 -  
280 - if (customX !== 0) {  
281 - customLatLng.lng -= polygonOffset;  
282 - }  
283 - if (customY !== 0) {  
284 - customLatLng.lat += polygonOffset;  
285 - }  
286 - 281 + const customLatLng = checkLngLat(this.pointToLatLng(point.x, point.y), this.southWest, this.northEast, offset);
287 282
288 return { 283 return {
289 [this.options.xPosKeyName]: customX, 284 [this.options.xPosKeyName]: customX,