。

src/graphic/Controls/MoveSVG.js

@@ -39,13 +39,32 @@ export default class MoveSVG {
   //   const side2 = mathUtil.getDistance(position, svg.center);
   //   svg.scale = (side2 / side1) * scale;
   // }
+
   moveRotateSVG(position, svgId) {
     let svg = dataService.getSVG(svgId);
-    const angle = mathUtil.Angle(svg.center, svg.controlAnglePoint, position);
+    svg.angle = mathUtil.vectorAngle(
+      svg.center,
+      svg.controlAnglePoint,
+      position
+    );
     for (let i = 0; i < svg.points.length; ++i) {
-      svg.points[i] = svg.rotatePoint(svg.points[i], svg.center, angle);
+      svg.points[i] = svg.rotatePoint(svg.points[i], svg.center, svg.angle);
     }
-    svg.setControlAnglePoint();
+
+    //svg.setControlAnglePoint();
+    // svg.controlAnglePoint = svg.rotatePoint(
+    //   svg.controlAnglePoint,
+    //   svg.center,
+    //   svg.angle
+    // );
+
+    let controlAnglePoint = svg.rotatePoint(
+      svg.controlAnglePoint,
+      svg.center,
+      svg.angle
+    );
+
+    svg.controlAnglePoint = JSON.parse(JSON.stringify(controlAnglePoint));
   }
 
   movePoint(newPos, svgId, pointIndex) {
@@ -53,11 +72,6 @@ export default class MoveSVG {
     const preIndex = svg.getPreIndex(pointIndex);
     const nextIndex = svg.getNextIndex(pointIndex);
     const nextIndex2 = svg.getNextIndex(nextIndex);
-    const angle = mathUtil.Angle(
-      svg.points[nextIndex],
-      svg.points[pointIndex],
-      newPos
-    );
 
     const line1 = mathUtil.createLine1(
       svg.points[nextIndex2],
@@ -96,6 +110,7 @@ export default class MoveSVG {
         return pointIndex;
       }
     }
+    svg.setCenter();
     svg.setControlAnglePoint();
     return pointIndex;
   }

src/graphic/Geometry/Geometry.js

@@ -164,14 +164,8 @@ export default class Geometry {
     var b = ptRotationCenter.y;
     var x0 = ptSrc.x;
     var y0 = ptSrc.y;
-    var rx =
-      a +
-      (x0 - a) * Math.cos((angle * Math.PI) / 180) -
-      (y0 - b) * Math.sin((angle * Math.PI) / 180);
-    var ry =
-      b +
-      (x0 - a) * Math.sin((angle * Math.PI) / 180) +
-      (y0 - b) * Math.cos((angle * Math.PI) / 180);
+    var rx = a + (x0 - a) * Math.cos(angle) - (y0 - b) * Math.sin(angle);
+    var ry = b + (x0 - a) * Math.sin(angle) + (y0 - b) * Math.cos(angle);
     var json = { x: rx, y: ry };
     return json;
   }

src/graphic/Geometry/SVG.js

@@ -7,7 +7,7 @@ import VectorCategory from "../enum/VectorCategory";
 import RoadStructure from "../enum/RoadStructure";
 import SVGType from "../enum/SVGType";
 
-//const sideWidth = 10;
+const controlPointDistance = 100;
 export default class SVG extends Geometry {
   constructor(center, type, vectorId) {
     super();
@@ -20,7 +20,8 @@ export default class SVG extends Geometry {
     this.scaleLength = this.getScale();
     this.scaleWidth = this.getScale();
     this.setBoundingVertexs();
-    this.controlAnglePoint = this.setControlAnglePoint();
+    this.controlAnglePoint = null;
+    this.setControlAnglePoint();
     this.setId(vectorId);
     this.checkCategory(type);
   }
@@ -114,21 +115,50 @@ export default class SVG extends Geometry {
     this.points = points;
   }
 
-  setControlAnglePoint() {
-    const len =
-      mathUtil.getDistance(this.points[0], this.points[2]) / 2 +
-      20 * coordinate.ratio;
+  setCenter() {
+    this.center.x =
+      (this.points[0].x +
+        this.points[1].x +
+        this.points[2].x +
+        this.points[3].x) /
+      4;
+    this.center.y =
+      (this.points[0].y +
+        this.points[1].y +
+        this.points[2].y +
+        this.points[3].y) /
+      4;
+  }
 
-    const v = {
-      x: Math.cos(this.angle + Math.PI / 2),
-      y: Math.sin(this.angle + Math.PI / 2),
-    };
-    console.log(this.angle);
-    const p = {
-      x: this.center.x + v.x * len,
-      y: this.center.y + v.y * len,
-    };
-    return p;
+  setControlAnglePoint() {
+    // const len =
+    //   mathUtil.getDistance(this.points[0], this.points[2]) / 2 +
+    //   20 * coordinate.ratio;
+    // const v = {
+    //   x: Math.sin(this.angle),
+    //   y: Math.cos(this.angle),
+    // };
+    // console.log("svg角度：" + this.angle);
+    // this.controlAnglePoint = {
+    //   x: this.center.x + v.x * len,
+    //   y: this.center.y + v.y * len,
+    // };
+    const distance = controlPointDistance * coordinate.ratio;
+    const line = mathUtil.createLine1(this.points[0], this.points[1]);
+    const lines = mathUtil.getParallelLineForDistance(line, distance);
+    const dis1 = mathUtil.getDisForPoinLine(this.center, lines.line1);
+    const dis2 = mathUtil.getDisForPoinLine(this.center, lines.line2);
+    if (dis1 > dis2) {
+      this.controlAnglePoint = mathUtil.getJoinLinePoint(
+        this.center,
+        lines.line1
+      );
+    } else {
+      this.controlAnglePoint = mathUtil.getJoinLinePoint(
+        this.center,
+        lines.line2
+      );
+    }
   }
 
   // setLengthScale(scale1) {

src/graphic/Util/MathUtil.js

@@ -417,6 +417,7 @@ export default class MathUtil {
       return ((2 * Math.PI - fi) * 180) / Math.PI;
     }
   }
+
   Angle1(o, s, e) {
     let cosfi = 0,
       fi = 0,
@@ -438,6 +439,28 @@ export default class MathUtil {
     return (fi * 180) / Math.PI;
   }
 
+  vectorAngle(p, p1, p2) {
+    let a = [];
+    let b = [];
+    a[0] = p1.x - p.x;
+    a[1] = p1.y - p.y;
+    b[0] = p2.x - p.x;
+    b[1] = p2.y - p.y;
+    const dot = a[0] * b[0] + a[1] * b[1]; // 点积
+    const det = a[0] * b[1] - a[1] * b[0]; // 叉积（用于符号判断）
+    const magA = Math.hypot(a[0], a[1]); // 向量a的模
+    const magB = Math.hypot(b[0], b[1]); // 向量b的模
+
+    if (magA === 0 || magB === 0) {
+      debugger;
+      return null; // 防止除以0
+    }
+
+    // 计算夹角（带方向）
+    const angle = Math.atan2(det, dot);
+    return -1 * angle;
+  }
+
   getArrow(start, end, ange = 30, L = 14) {
     let a = Math.atan2(end.y - start.y, end.x - start.x);
     let xC = end.x - L * Math.cos(a + (ange * Math.PI) / 180); // θ=30