Commit ac0a3fdf5cd7c56e4fafc38649867991c64adbb2

Authored by Kalutka Zhenya
1 parent 93155fb1

update logics

... ... @@ -30,6 +30,7 @@ import { Datasource, DatasourceData } from '@shared/models/widget.models';
30 30 import _ from 'lodash';
31 31 import { mapProviderSchema, providerSets } from '@home/components/widget/lib/maps/schemes';
32 32 import { addCondition, mergeSchemes } from '@core/schema-utils';
  33 +import L, {Projection} from "leaflet";
33 34
34 35 export function getProviderSchema(mapProvider: MapProviders, ignoreImageMap = false) {
35 36 const providerSchema = _.cloneDeep(mapProviderSchema);
... ... @@ -443,3 +444,21 @@ export function createLoadingDiv(loadingText: string): JQuery<HTMLElement> {
443 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 46 createTooltip,
47 47 } from '@home/components/widget/lib/maps/maps-utils';
48 48 import {
  49 + checkLngLat,
49 50 createLoadingDiv,
50 51 parseArray,
51 52 parseData,
... ... @@ -79,6 +80,8 @@ export default abstract class LeafletMap {
79 80 updatePending = false;
80 81 addMarkers: L.Marker[] = [];
81 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 86 protected constructor(public ctx: WidgetContext,
84 87 public $container: HTMLElement,
... ... @@ -423,26 +426,8 @@ export default abstract class LeafletMap {
423 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 432 return {
448 433 [this.options.latKeyName]: position.lat,
... ... @@ -754,7 +739,7 @@ export default abstract class LeafletMap {
754 739 }
755 740 if(this.options.provider !== MapProviders.image) {
756 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 745 this.savePolygonLocation({ ...data, ...this.convertPolygonToCustomFormat(e.layer._latlngs) }).subscribe();
... ...
... ... @@ -16,10 +16,15 @@
16 16
17 17 import L, { LatLngBounds, LatLngLiteral, LatLngTuple } from 'leaflet';
18 18 import LeafletMap from '../leaflet-map';
19   -import {MapImage, MapProviders, PosFuncton, UnitedMapSettings} from '../map-models';
  19 +import { MapImage, PosFuncton, UnitedMapSettings } from '../map-models';
20 20 import { Observable, ReplaySubject } from 'rxjs';
21 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 28 import { WidgetContext } from '@home/models/widget-component.models';
24 29 import { DataSet, DatasourceType, widgetType } from '@shared/models/widget.models';
25 30 import { DataKeyType } from '@shared/models/telemetry/telemetry.models';
... ... @@ -132,9 +137,9 @@ export class ImageMap extends LeafletMap {
132 137 updateBounds(updateImage?: boolean, lastCenterPos?) {
133 138 const w = this.width;
134 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 144 if (updateImage && this.imageOverlay) {
140 145 this.imageOverlay.remove();
... ... @@ -147,8 +152,8 @@ export class ImageMap extends LeafletMap {
147 152 this.imageOverlay = L.imageOverlay(this.imageUrl, bounds).addTo(this.map);
148 153 }
149 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 157 const maxBounds = new L.LatLngBounds(southWest, northEast);
153 158 this.map.setMaxBounds(maxBounds);
154 159 if (lastCenterPos) {
... ... @@ -257,9 +262,7 @@ export class ImageMap extends LeafletMap {
257 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 266 const point = this.latLngToPoint(position);
264 267 const customX = calculateNewPointCoordinate(point.x, width);
265 268 const customY = calculateNewPointCoordinate(point.y, height);
... ... @@ -275,15 +278,7 @@ export class ImageMap extends LeafletMap {
275 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 283 return {
289 284 [this.options.xPosKeyName]: customX,
... ...