继续

src/graphic/Coordinate.js

@@ -133,4 +133,5 @@ export default class Coordinate {
 }
 
 const coordinate = new Coordinate();
+window.coordinate = coordinate;
 export { coordinate };

src/graphic/Layer.js

@@ -206,6 +206,10 @@ export default class Layer {
           this.onMouseUp(e);
           this.StorePage1 = { x: e.touches[0].pageX, y: e.touches[0].pageY };
           this.StorePage2 = { x: e.touches[1].pageX, y: e.touches[1].pageY };
+          this.StoreMidePage = {
+            x: (this.StorePage1.x + this.StorePage2.x) / 2,
+            y: (this.StorePage1.y + this.StorePage2.y) / 2,
+          };
           return;
         }
         const point1 = {
@@ -217,15 +221,12 @@ export default class Layer {
           y: e.touches[1].pageY,
         };
 
-        // let zoom =
-        //   (mathUtil.getDistance(point1, point2) /
-        //     mathUtil.getDistance(this.StorePage1, this.StorePage2)) *
-        //   coordinate.zoom;
         let dis1 = mathUtil.getDistance(point1, point2) / 100;
         let dis2 = mathUtil.getDistance(this.StorePage1, this.StorePage2) / 100;
-        let zoom = coordinate.zoom + dis1 - dis2;
-        console.log("缩放距离：" + dis1 + "," + dis2);
-        this.zoomVector(zoom);
+        let zoom = (coordinate.zoom * dis1) / dis2;
+        this.zoomVector(this.StoreMidePage, zoom);
+        mathUtil.clonePoint(this.StorePage1, point1);
+        mathUtil.clonePoint(this.StorePage2, point2);
         return;
       }
     }
@@ -275,7 +276,7 @@ export default class Layer {
         coordinate.center.x = coordinate.center.x - dx;
         coordinate.center.y = coordinate.center.y + dy;
 
-        dataService.setGridForPan(dx, dy);
+        dataService.setGridForPan();
         needAutoRedraw = true;
         break;
       case LayerEvents.AddRoad:
@@ -646,11 +647,12 @@ export default class Layer {
     if (e instanceof TouchEvent) {
       X = this.lastX;
       Y = this.lastY;
+      this.StorePage1 = null;
+      this.StorePage2 = null;
+      this.StoreMidePage = null;
       if (e.touches.length > 1) {
         return;
       }
-      this.StorePage1 == null;
-      this.StorePage2 == null;
     }
 
     let eventName = stateService.getEventName();
@@ -863,11 +865,7 @@ export default class Layer {
       return;
     }
     coordinate.updateZoom(position, zoom);
-    dataService.setGridForZoom(
-      coordinate.width,
-      coordinate.height,
-      coordinate.zoom / coordinate.defaultZoom
-    );
+    dataService.setGridForZoom();
     this.renderer.autoRedraw();
   }
 

src/graphic/Service/DataService.js

@@ -6,15 +6,7 @@ import VectorCategory from "../enum/VectorCategory.js";
 
 export class DataService {
   constructor() {
-    this.grid = {
-      startX: 0,
-      startY: 0,
-      step1: 50 * coordinate.ratio,
-      step2: 250 * coordinate.ratio,
-      defalutstep1: 50 * coordinate.ratio,
-      defalutstep2: 250 * coordinate.ratio,
-      display: true,
-    };
+    this.grid = null;
     this.vectorData = {
       currentId: 0, // 当前可用id
     };
@@ -36,6 +28,35 @@ export class DataService {
     return this.vectorData;
   }
 
+  initGrid() {
+    this.grid = {
+      defalutstep1: 50 * coordinate.ratio,
+      defalutstep2: 250 * coordinate.ratio,
+      display: true,
+    };
+    this.grid.start = JSON.parse(JSON.stringify(coordinate.center));
+    this.setGridStartPosition();
+  }
+
+  setGridStartPosition() {
+    this.grid.step1 =
+      (this.grid.defalutstep1 * coordinate.zoom) / coordinate.defaultZoom;
+    this.grid.step2 =
+      (this.grid.defalutstep2 * coordinate.zoom) / coordinate.defaultZoom;
+    let startScreenPosition = coordinate.getScreenXY(this.grid.start);
+
+    while (startScreenPosition.x > 0 || startScreenPosition.y > 0) {
+      if (startScreenPosition.x > 0) {
+        startScreenPosition.x -= this.grid.step2;
+      }
+      if (startScreenPosition.y > 0) {
+        startScreenPosition.y -= this.grid.step2;
+      }
+    }
+    this.grid.startX = startScreenPosition.x;
+    this.grid.startY = startScreenPosition.y;
+  }
+
   initVectorData() {
     this.vectorData.backgroundImg = null;
     //直路
@@ -60,6 +81,7 @@ export class DataService {
     this.vectorData.texts = {};
     this.vectorData.svgs = {};
     this.vectorData.magnifiers = {};
+    this.initGrid();
   }
 
   //网格
@@ -67,32 +89,12 @@ export class DataService {
     return this.grid;
   }
 
-  setGridForPan(dx, dy) {
-    this.grid.startX += dx * coordinate.ratio;
-    this.grid.startY += dy * coordinate.ratio;
-    this.grid.step1 =
-      (this.grid.defalutstep1 * coordinate.zoom) / coordinate.defaultZoom;
-    this.grid.step2 =
-      (this.grid.defalutstep2 * coordinate.zoom) / coordinate.defaultZoom;
-    while (this.grid.startX > 0) {
-      this.grid.startX -= this.grid.step2;
-    }
-    while (this.grid.startY > 0) {
-      this.grid.startY -= this.grid.step2;
-    }
+  setGridForPan() {
+    this.setGridStartPosition();
   }
 
-  setGridForZoom(w, h, zoom) {
-    this.grid.startX = w / 2 - (zoom * w) / 2;
-    this.grid.startY = h / 2 - (zoom * h) / 2;
-    this.grid.step1 = this.grid.defalutstep1 * zoom;
-    this.grid.step2 = this.grid.defalutstep2 * zoom;
-    while (this.grid.startX > 0) {
-      this.grid.startX -= this.grid.step2;
-    }
-    while (this.grid.startY > 0) {
-      this.grid.startY -= this.grid.step2;
-    }
+  setGridForZoom() {
+    this.setGridStartPosition();
   }
 
   setGridDisplay(value) {

src/graphic/Settings.js

@@ -22,5 +22,6 @@ const Settings = {
   locationMode: Constant.angleLocationMode,
   baseLineId: null, //基准线id，有且只有一条
   selectBasePointId: null, //选中的基准点
+  isMobile: false,
 };
 export default Settings;