dendi-wang/thingsboard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update logics

Browse Source
This commit is contained in:
Kalutka Zhenya 2021-01-14 19:21:56 +02:00
parent 93155fb19d
commit ac0a3fdf5c
3 changed files with 39 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
ui-ngx/src/app/modules/home/components/widget/lib/maps/common-maps-utils.ts
View File

@ -30,6 +30,7 @@ import { Datasource, DatasourceData } from '@shared/models/widget.models';
import _ from 'lodash';
import { mapProviderSchema, providerSets } from '@home/components/widget/lib/maps/schemes';
import { addCondition, mergeSchemes } from '@core/schema-utils';
import L, {Projection} from "leaflet";
export function getProviderSchema(mapProvider: MapProviders, ignoreImageMap = false) {
const providerSchema = _.cloneDeep(mapProviderSchema);
@ -443,3 +444,21 @@ export function createLoadingDiv(loadingText: string): JQuery<HTMLElement> {
</div>
`);
}
export function checkLngLat(point: L.LatLng, southWest: L.LatLng, northEast: L.LatLng, offset = 0): L.LatLng {
const maxLngMap = northEast.lng - offset;
const minLngMap = southWest.lng + offset;
const maxLatMap = northEast.lat - offset;
const minLatMap = southWest.lat + offset;
if (point.lng > maxLngMap) {
point.lng = maxLngMap;
} else if (point.lng < minLngMap) {
point.lng = minLngMap;
}
if (point.lat > maxLatMap) {
point.lat = maxLatMap;
} else if (point.lat < minLatMap) {
point.lat = minLatMap;
}
return point;
}

27
ui-ngx/src/app/modules/home/components/widget/lib/maps/leaflet-map.ts
View File

@ -46,6 +46,7 @@ import {
createTooltip,
} from '@home/components/widget/lib/maps/maps-utils';
import {
checkLngLat,
createLoadingDiv,
parseArray,
parseData,
@ -79,6 +80,8 @@ export default abstract class LeafletMap {
updatePending = false;
addMarkers: L.Marker[] = [];
addPolygons: L.Polygon[] = [];
southWest = new L.LatLng(-Projection.SphericalMercator['MAX_LATITUDE'], -180);
northEast = new L.LatLng(Projection.SphericalMercator['MAX_LATITUDE'], 180);
protected constructor(public ctx: WidgetContext,
public $container: HTMLElement,
@ -423,26 +426,8 @@ export default abstract class LeafletMap {
}).filter(el => !!el);
}
checkLngLat(position: L.LatLng, polygonOffset: number = 0){
const maxLatitude = Projection.SphericalMercator['MAX_LATITUDE'];
const minLatitude = -maxLatitude;
if (position.lng > 180 - polygonOffset) {
position.lng = 180 - polygonOffset;
} else if (position.lng < -180) {
position.lng= -180;
}
if(position.lat > maxLatitude){
position.lat = maxLatitude;
}else if(position.lat < minLatitude + polygonOffset){
position.lat = minLatitude + polygonOffset;
}
return position;
}
convertToCustomFormat(position: L.LatLng, polygonOffset: number = 0): object {
position = this.checkLngLat(position,polygonOffset)
convertToCustomFormat(position: L.LatLng, offset = 0): object {
position = checkLngLat(position, this.southWest, this.northEast, offset);
return {
[this.options.latKeyName]: position.lat,
@ -754,7 +739,7 @@ export default abstract class LeafletMap {
}
if(this.options.provider !== MapProviders.image) {
for (let key in e.layer._latlngs[0]) {
e.layer._latlngs[0][key] = this.checkLngLat(e.layer._latlngs[0][key]);
e.layer._latlngs[0][key] = checkLngLat(e.layer._latlngs[0][key], this.southWest, this.northEast);
}
}
this.savePolygonLocation({ ...data, ...this.convertPolygonToCustomFormat(e.layer._latlngs) }).subscribe();

33
ui-ngx/src/app/modules/home/components/widget/lib/maps/providers/image-map.ts
View File

@ -16,10 +16,15 @@
import L, { LatLngBounds, LatLngLiteral, LatLngTuple } from 'leaflet';
import LeafletMap from '../leaflet-map';
import {MapImage, MapProviders, PosFuncton, UnitedMapSettings} from '../map-models';
import { MapImage, PosFuncton, UnitedMapSettings } from '../map-models';
import { Observable, ReplaySubject } from 'rxjs';
import { filter, map, mergeMap } from 'rxjs/operators';
import { aspectCache, calculateNewPointCoordinate, parseFunction } from '@home/components/widget/lib/maps/common-maps-utils';
import {
aspectCache,
calculateNewPointCoordinate,
checkLngLat,
parseFunction
} from '@home/components/widget/lib/maps/common-maps-utils';
import { WidgetContext } from '@home/models/widget-component.models';
import { DataSet, DatasourceType, widgetType } from '@shared/models/widget.models';
import { DataKeyType } from '@shared/models/telemetry/telemetry.models';
@ -132,9 +137,9 @@ export class ImageMap extends LeafletMap {
updateBounds(updateImage?: boolean, lastCenterPos?) {
const w = this.width;
const h = this.height;
let southWest = this.pointToLatLng(0, h);
let northEast = this.pointToLatLng(w, 0);
const bounds = new L.LatLngBounds(southWest, northEast);
this.southWest = this.pointToLatLng(0, h);
this.northEast = this.pointToLatLng(w, 0);
const bounds = new L.LatLngBounds(this.southWest, this.northEast);
if (updateImage && this.imageOverlay) {
this.imageOverlay.remove();
@ -147,8 +152,8 @@ export class ImageMap extends LeafletMap {
this.imageOverlay = L.imageOverlay(this.imageUrl, bounds).addTo(this.map);
}
const padding = 200 * maxZoom;
southWest = this.pointToLatLng(-padding, h + padding);
northEast = this.pointToLatLng(w + padding, -padding);
const southWest = this.pointToLatLng(-padding, h + padding);
const northEast = this.pointToLatLng(w + padding, -padding);
const maxBounds = new L.LatLngBounds(southWest, northEast);
this.map.setMaxBounds(maxBounds);
if (lastCenterPos) {
@ -257,9 +262,7 @@ export class ImageMap extends LeafletMap {
return L.CRS.Simple.latLngToPoint(latLng, maxZoom - 1);
}
convertToCustomFormat(position: L.LatLng, polygonOffset: number = 0, width = this.width, height = this.height): object {
position.lng += polygonOffset;
position.lat -= polygonOffset;
convertToCustomFormat(position: L.LatLng, offset = 0, width = this.width, height = this.height): object {
const point = this.latLngToPoint(position);
const customX = calculateNewPointCoordinate(point.x, width);
const customY = calculateNewPointCoordinate(point.y, height);
@ -275,15 +278,7 @@ export class ImageMap extends LeafletMap {
point.y = height;
}
const customLatLng = this.pointToLatLng(point.x, point.y);
if (customX !== 0) {
customLatLng.lng -= polygonOffset;
}
if (customY !== 0) {
customLatLng.lat += polygonOffset;
}
const customLatLng = checkLngLat(this.pointToLatLng(point.x, point.y), this.southWest, this.northEast, offset);
return {
[this.options.xPosKeyName]: customX,