继续

src/graphic/Controls/MoveCircle.js

@@ -1,5 +1,6 @@
 import { dataService } from "../Service/DataService";
 import { mathUtil } from "../Util/MathUtil";
+import Constant from "../Constant.js";
 
 export default class MoveCircle {
   constructor() {}
@@ -10,12 +11,45 @@ export default class MoveCircle {
     let circle = dataService.getCircle(circleId);
     circle.center.x += dx;
     circle.center.y += dy;
+    circle.createPoints();
   }
 
-  moveRing(position, circleId) {
+  movePoint(position, circleId, pointIndex) {
     let circle = dataService.getCircle(circleId);
-    circle.setRadius(mathUtil.getDistance(circle.center, position));
+    let flag = this.check(position, circle.center, pointIndex);
+    let radius = mathUtil.getDistance(circle.center, position);
+    //没有超出界
+    if (flag && radius > Constant.minAdsorbPix) {
+      circle.setRadius(radius);
+      circle.createPoints();
+    }
   }
+
+  check(position, center, pointIndex) {
+    if (pointIndex == 0) {
+      if (position.x < center.x && position.y > center.y) {
+        return true;
+      }
+    } else if (pointIndex == 1) {
+      if (position.x > center.x && position.y > center.y) {
+        return true;
+      }
+    } else if (pointIndex == 2) {
+      if (position.x > center.x && position.y < center.y) {
+        return true;
+      }
+    } else if (pointIndex == 3) {
+      if (position.x < center.x && position.y < center.y) {
+        return true;
+      }
+    }
+    return false;
+  }
+
+  // moveRing(position, circleId) {
+  //   let circle = dataService.getCircle(circleId);
+  //   circle.setRadius(mathUtil.getDistance(circle.center, position));
+  // }
 }
 
 const moveCircle = new MoveCircle();

src/graphic/Geometry/Circle.js

@@ -10,11 +10,13 @@ export default class Circle extends Geometry {
     this.radius = 5;
     this.center = null;
     this.color = "blue";
+    this.points = []; //包含圆的4个顶点，按照顺时针的方式存入数组中，第一个元素是左上角顶点
     this.geoType = VectorType.Circle;
     this.setId(vectorId);
 
     this.setRadius(radius);
     this.setCenter(center);
+    this.createPoints();
   }
 
   setRadius(radius) {
@@ -29,6 +31,25 @@ export default class Circle extends Geometry {
     }
   }
 
+  createPoints() {
+    this.points[0] = {
+      x: this.center.x - this.radius,
+      y: this.center.y + this.radius,
+    };
+    this.points[1] = {
+      x: this.center.x + this.radius,
+      y: this.center.y + this.radius,
+    };
+    this.points[2] = {
+      x: this.center.x + this.radius,
+      y: this.center.y - this.radius,
+    };
+    this.points[3] = {
+      x: this.center.x - this.radius,
+      y: this.center.y - this.radius,
+    };
+  }
+
   setColor(value) {
     this.color = value;
   }

src/graphic/History/HistoryUtil.js

@@ -103,6 +103,7 @@ export default class HistoryUtil {
     circleInfo.vectorId = circle1.vectorId;
     circleInfo.center = circle2.center;
     circleInfo.radius = circle2.radius;
+    circleInfo.points = circle2.points;
     this.setCircleInfo(circleInfo);
   }
 
@@ -148,6 +149,7 @@ export default class HistoryUtil {
     data.center = {};
     mathUtil.clonePoint(data.center, circle.center);
     data.radius = circle.radius;
+    data.points = circle.points;
     data.type = circle.geoType;
     return data;
   }
@@ -199,6 +201,7 @@ export default class HistoryUtil {
     let circle = dataService.getCircle(circleInfo.vectorId);
     circle.center = circleInfo.center;
     circle.radius = circleInfo.radius;
+    circle.points = circleInfo.points;
     return circle;
   }
 

src/graphic/Layer.js

@@ -532,7 +532,7 @@ export default class Layer {
         break;
       case LayerEvents.MoveCircle:
         if (draggingItem != null) {
-          if (draggingItem.state == SelectState.Select) {
+          if (draggingItem.state == -1) {
             moveCircle.moveFull(
               draggingItem.vectorId,
               (dx * coordinate.defaultZoom) / coordinate.zoom,
@@ -540,8 +540,19 @@ export default class Layer {
             );
             this.lastX = X;
             this.lastY = Y;
+          } else if (
+            draggingItem.state == 0 ||
+            draggingItem.state == 1 ||
+            draggingItem.state == 2 ||
+            draggingItem.state == 3
+          ) {
+            moveCircle.movePoint(
+              position,
+              draggingItem.vectorId,
+              draggingItem.state
+            );
           } else {
-            moveCircle.moveRing(position, draggingItem.vectorId);
+            debugger;
           }
           needAutoRedraw = true;
         }

src/graphic/ListenLayer.js

@@ -200,55 +200,36 @@ export default class ListenLayer {
       distance: null,
     };
     const circles = dataService.getCircles();
+    let distance;
     for (const circleId in circles) {
       if (circleId == exceptCircleId) {
         continue;
       }
       const circle = dataService.getCircle(circleId);
-      const distance = mathUtil.getDistance(position, circle.center);
-      if (distance < circle.radius - Constant.minAdsorbPix) {
-        if (circleInfo.circleId == null || distance < circleInfo.distance) {
+      for (let i = 0; i < circle.points.length; ++i) {
+        distance = mathUtil.getDistance(position, circle.points[i]);
+        if (distance < Constant.minAdsorbPix) {
           circleInfo = {
             circleId: circleId,
             type: VectorType.Circle,
             distance: distance,
-            select: SelectState.Select,
-            x: circle.center.x,
-            y: circle.center.y,
+            x: circle.points[i].x,
+            y: circle.points[i].y,
+            index: i,
           };
+          return circleInfo;
         }
-      } else if (
-        distance > circle.radius - Constant.minAdsorbPix &&
-        distance < circle.radius + Constant.minAdsorbPix
-      ) {
+      }
+      distance = mathUtil.getDistance(position, circle.center);
+      if (distance < circle.radius) {
         if (circleInfo.circleId == null || distance < circleInfo.distance) {
-          const joins = mathUtil.getInsertPointBetweenCircleAndLine(
-            circle.center.x,
-            circle.center.y,
-            position.x,
-            position.y,
-            circle.center.x,
-            circle.center.y,
-            circle.radius
-          );
-          let join = {};
-          if (
-            mathUtil.getDistance(joins[0], position) <
-            mathUtil.getDistance(joins[1], position)
-          ) {
-            join.x = joins[0].x;
-            join.y = joins[0].y;
-          } else {
-            join.x = joins[1].x;
-            join.y = joins[1].y;
-          }
           circleInfo = {
             circleId: circleId,
             type: VectorType.Circle,
-            distance: Math.abs(distance - circle.radius),
-            select: SelectState.CircleRing, //选中环
-            x: join.x,
-            y: join.y,
+            distance: distance,
+            x: circle.center.x,
+            y: circle.center.y,
+            index: -1,
           };
         }
       }
@@ -959,7 +940,7 @@ export default class ListenLayer {
     } else if (info && info.circleInfo.circleId) {
       this.modifyPoint = {};
       this.modifyPoint.linkedCircleId = info.circleInfo.circleId;
-      this.modifyPoint.select = info.circleInfo.select;
+      this.modifyPoint.index = info.circleInfo.index;
       this.modifyPoint.x = info.circleInfo.x;
       this.modifyPoint.y = info.circleInfo.y;
     } else if (info && info.roadPointInfo.linkedRoadPointIdX) {
@@ -1092,7 +1073,7 @@ export default class ListenLayer {
       stateService.setSelectItem(
         this.modifyPoint.linkedCircleId,
         VectorType.Circle,
-        this.modifyPoint.select
+        this.modifyPoint.index
       );
     }
 

src/graphic/Service/ControlPointService.js

@@ -71,6 +71,7 @@ export default class ControlPointService {
     } else if (controlPoint.edgeInfo2.id == oldEdgeId) {
       controlPoint.edgeInfo2.id = newEdgeId;
     }
+    controlPoint.setExtremePoint();
     dataService.addControlPoint(controlPoint);
   }
 

src/graphic/Service/ElementService.js

@@ -1,6 +1,7 @@
 import Point from "../Geometry/Point.js";
 import Line from "../Geometry/Line.js";
 import Road from "../Geometry/Road.js";
+import RoadPoint from "../Geometry/RoadPoint.js";
 import RoadEdge from "../Geometry/RoadEdge.js";
 import ElementEvents from "../enum/ElementEvents.js";
 import VectorCategory from "../enum/VectorCategory.js";
@@ -105,8 +106,8 @@ export class ElementService {
 
   //临时的
   createTempRoad() {
-    let p1 = new Point({ x: 0, y: 0 });
-    let p2 = new Point({ x: 1, y: 1 });
+    let p1 = new RoadPoint({ x: 0, y: 0 });
+    let p2 = new RoadPoint({ x: 0, y: 300 });
     this.newRoad = new Road(p1.vectorId, p2.vectorId);
     this.newRoad.start = p1;
     this.newRoad.end = p2;
@@ -173,19 +174,32 @@ export class ElementService {
     this.newRoad.end.setPosition(point2);
     //需要更新Edge坐标
     if (!mathUtil.equalPoint(point1, point2)) {
-      let edgePoints = mathUtil.RectangleVertex(
-        point1,
-        point2,
-        Constant.defaultRoadWidth
-      );
-      this.newRoad.leftEdge.setPositions(
-        edgePoints.leftEdgeStart,
-        edgePoints.leftEdgeEnd
-      );
-      this.newRoad.rightEdge.setPositions(
-        edgePoints.rightEdgeStart,
-        edgePoints.rightEdgeEnd
-      );
+      let edgePoints = null;
+      if (this.newRoad.way == Constant.oneWay) {
+        edgePoints = mathUtil.RectangleVertex(
+          point1,
+          point2,
+          this.newRoad.leftWidth + this.newRoad.rightWidth
+        );
+      } else if (this.newRoad.way == Constant.twoWay) {
+        edgePoints = mathUtil.RectangleVertex(
+          point1,
+          point2,
+          this.newRoad.leftWidth +
+            this.newRoad.rightWidth +
+            this.newRoad.midDivide.midDivideWidth
+        );
+      }
+      if (edgePoints != null) {
+        this.newRoad.leftEdge.setPositions(
+          edgePoints.leftEdgeStart,
+          edgePoints.leftEdgeEnd
+        );
+        this.newRoad.rightEdge.setPositions(
+          edgePoints.rightEdgeStart,
+          edgePoints.rightEdgeEnd
+        );
+      }
     }
   }
 

src/graphic/Service/RoadService.js

@@ -145,7 +145,6 @@ export default class RoadService {
         mathUtil.clonePoint(leftEdge.start, oldLeftEdgeStartPoint);
         mathUtil.clonePoint(rightEdge.start, oldRightEdgeStartPoint);
       }
-      cpt.setExtremePoint();
     } else if (dir == "end") {
       let cpt = dataService.getControlPointForEdgeId(road.leftEdgeId, "start");
       controlPointService.replaceEdgeId(
@@ -171,7 +170,6 @@ export default class RoadService {
         mathUtil.clonePoint(leftEdge.end, oldLeftEdgeEndPoint);
         mathUtil.clonePoint(rightEdge.end, oldRightEdgeEndPoint);
       }
-      cpt.setExtremePoint();
     }
 
     return newRoad.vectorId;

src/graphic/enum/SelectState.js

@@ -1,5 +1,5 @@
 const SelectState = {
   Select: "select",
-  CircleRing: "circleRing",
+  index: null,
 };
 export default SelectState;