【fix】修复投影坐标系大于17级的抖动问题。传入的数据坐标和中心点坐标都由以前的绝对值改成与地图中心点的差值，减少传入位数

SuperMap · Jul 16, 2024 · 3c01fc3 · 3c01fc3
1 parent c421ea4
commit 3c01fc3
Show file tree

Hide file tree

Showing 3 changed files with 64 additions and 21 deletions.
diff --git a/packages/core/src/services/coordinate/CoordinateSystemService.ts b/packages/core/src/services/coordinate/CoordinateSystemService.ts
@@ -58,11 +58,15 @@ export default class CoordinateSystemService
    */
   private pixelsPerMeter: [number, number, number];
 
+  public offsetCenterTransform: [number, number];
+
+  public offsetCenter: [number, number];
+
   /**
    * 重新计算当前坐标系参数
    * TODO: 使用 memoize 缓存参数以及计算结果
    */
-  public refresh(offsetCenter: [number, number], lngLatExtent: Array<number>): void {
+  public refresh(offsetCenter: [number, number], lngLatExtent: number[]): void {
     // if (!this.needRefresh) {
     //   return;
     // }
@@ -75,7 +79,7 @@ export default class CoordinateSystemService
       latitude: center[1],
       zoom,
       lngLatExtent,
-      coordinateSystem: this.coordinateSystem
+      coordinateSystem: this.coordinateSystem,
     });
     this.viewportCenter = center;
     this.viewportCenterProjection = [0, 0, 0, 0];
@@ -89,7 +93,10 @@ export default class CoordinateSystemService
     ) {
       // 继续使用相机服务计算的 VP 矩阵
       this.cameraService.setViewProjectionMatrix(undefined);
-    } else if (this.coordinateSystem === CoordinateSystem.LNGLAT_OFFSET || this.coordinateSystem === CoordinateSystem.METER_OFFSET) {
+    } else if (
+      this.coordinateSystem === CoordinateSystem.LNGLAT_OFFSET ||
+      this.coordinateSystem === CoordinateSystem.METER_OFFSET
+    ) {
       this.calculateLnglatOffset(center, zoom, lngLatExtent);
     } else if (this.coordinateSystem === CoordinateSystem.P20_OFFSET) {
       this.calculateLnglatOffset(center, zoom, lngLatExtent, zoomScale, true);
@@ -108,17 +115,32 @@ export default class CoordinateSystemService
   }
 
   public getViewportCenter(map?: any): [number, number] {
-    // return transformOffset(this.viewportCenter, window.map, 512)
 
-    if (this.coordinateSystem === CoordinateSystem.METER_OFFSET) {
-      return transformOffset(
+    if (
+      this.coordinateSystem === CoordinateSystem.METER_OFFSET &&
+      this.offsetCenterTransform
+    ) {
+      const center = transformOffset(
         [
           Math.fround(this.viewportCenter[0]),
           Math.fround(this.viewportCenter[1]),
         ],
         map,
         512,
       );
+      // if(!this.offsetCenterTransform){
+      //   const { lng, lat } = map.getCenter();
+      //   const center2= transformOffset([lng, lat], map, 512);
+      //   this.offsetCenter = [lng, lat];
+      //   this.offsetCenterTransform = [
+      //     center2[0],
+      //     center2[1],
+      //   ];
+      // }
+      return [
+        center[0] - this.offsetCenterTransform[0],
+        center[1] - this.offsetCenterTransform[1],
+      ];
     } else {
       return [this.viewportCenter[0], this.viewportCenter[1]];
     }
@@ -143,7 +165,7 @@ export default class CoordinateSystemService
   private calculateLnglatOffset(
     center: [number, number],
     zoom: number,
-    lngLatExtent: Array<number>,
+    lngLatExtent: number[],
     scale?: number,
     flipY?: boolean,
   ) {
@@ -160,7 +182,7 @@ export default class CoordinateSystemService
       scale,
       flipY,
       highPrecision: true,
-      coordinateSystem: this.coordinateSystem
+      coordinateSystem: this.coordinateSystem,
     });
 
     let viewMatrix = this.cameraService.getViewMatrix();

diff --git a/packages/core/src/services/coordinate/ICoordinateSystemService.ts b/packages/core/src/services/coordinate/ICoordinateSystemService.ts
@@ -33,6 +33,8 @@ export const CoordinateUniform = {
 };
 
 export interface ICoordinateSystemService {
+  offsetCenterTransform: [number, number];
+  offsetCenter: [number, number];
   needRefresh: boolean;
   refresh(offset?: [number, number], lngLatExtent?: Array<number>): void;
   getCoordinateSystem(): CoordinateSystem;

diff --git a/packages/layers/src/plugins/DataMappingPlugin.ts b/packages/layers/src/plugins/DataMappingPlugin.ts
@@ -205,10 +205,22 @@ export default class DataMappingPlugin implements ILayerPlugin {
     this.adjustData2SimpleCoordinates(mappedData);
     if (
       this.coordinateSystemService.getCoordinateSystem() ===
-      CoordinateSystem.LNGLAT || this.coordinateSystemService.getCoordinateSystem() ===
+      CoordinateSystem.LNGLAT
+    ) {
+      this.adjustData2MapboxCoordinates(mappedData);
+    } else if (
+      this.coordinateSystemService.getCoordinateSystem() ===
       CoordinateSystem.METER_OFFSET
     ) {
-this.adjustData2MapboxCoordinates(mappedData);
+      const map = this.mapService.map as Map;
+      const { lng, lat } = map.getCenter();
+      const center = transformOffset([lng, lat], map, 512);
+      this.coordinateSystemService.offsetCenter = [lng, lat];
+      this.coordinateSystemService.offsetCenterTransform = [
+        center[0],
+        center[1],
+      ];
+      this.adjustData2MapboxCoordinates(mappedData);
     }
     return mappedData;
   }
@@ -223,13 +235,12 @@ this.adjustData2MapboxCoordinates(mappedData);
     ) {
       mappedData.map((d) => {
         d.version = Version['MAPBOX'];
-        if(!d.originCoordinates){
- // @ts-ignore
- d.originCoordinates = cloneDeep(d.coordinates);
- // @ts-ignore
- d.coordinates = this.getMapboxCoordiantes(d.coordinates);
+        if (!d.originCoordinates) {
+          // @ts-ignore
+          d.originCoordinates = cloneDeep(d.coordinates);
+          // @ts-ignore
+          d.coordinates = this.getMapboxCoordiantes(d.coordinates);
         }
-
       });
     }
   }
@@ -267,12 +278,20 @@ this.adjustData2MapboxCoordinates(mappedData);
     }
   }
   private project(coord: [number, number], map: Map, TILESIZE: number) {
-    // if (map.getZoom() <= 12 && this.getIsMultiCoor()) {
+    if (
+      this.coordinateSystemService.getCoordinateSystem() ===
+      CoordinateSystem.METER_OFFSET
+    ) {
+      const p = transformOffset(
+        coord,
+        map,
+        TILESIZE,
+        this.coordinateSystemService.offsetCenter,
+      );
+      return [Math.fround(p[0]), Math.fround(p[1])];
+    } else {
       return transformOffset(coord, map, TILESIZE);
-    // } else {
-    //   const { lng, lat } = map.getCenter();
-    //   return transformOffset(coord, map, undefined, [lng, lat]);
-    // }
+    }
   }
 
   private getIsMultiCoor() {