继续搭建绘图系统

src/graphic/Constant.js

@@ -24,6 +24,11 @@ const Constant = {
   // miniMap_Width: 1200,
   // miniMap_Height: 1200,
   minAdsorbPix: 20, //最小吸附像素
+  minRealDis: 20,
   defaultRoad: 20, //默认公路宽度
+  defaultRoadWidth: 20,
+  ratio: 1,
+  minAngle: 10,
+  maxAngle: 170,
 };
 export default Constant;

src/graphic/Controls/MoveRoad.js

@@ -156,324 +156,6 @@ export default class MoveRoad {
     return true;
   }
 
-  // // 拖拽墙面
-  // moveRoadPlane(roadId, dx, dy) {
-  //   // 1表示可以继续移动，2表示不能移动(启动距离还不够)，3表示wallId被删除了,4表示重新开始移动（需要达到一定距离才能启动）,5表示不能移动（不合适）
-  //   let MoveState = 1;
-  //   let road = dataService.getRoad(roadId);
-  //   let startPointId = road.startId;
-  //   let endPointId = road.endId;
-  //   let startPoint = dataService.getPoint(road.startId);
-  //   let endPoint = dataService.getPoint(road.endId);
-  //   // 不考虑约束的情况，得到移动后的坐标
-  //   const newpts = this.getNewPointsForMoveRoad(roadId, dx, dy);
-  //   let newLine = mathUtil.createLine1(newpts.point1, newpts.point2);
-  //   // 获取约束信息，包括：是否新建墙，受约束的侧墙
-  //   const limit = this.getTwoLimitInfos(roadId, newLine);
-  //   this.needUpdateRoom = false;
-  //   // 不考虑吸附的情况下，经过约束条件后，得到的新的移动后的坐标
-  //   let virtualStartPoint = mathUtil.getIntersectionPoint(
-  //     newLine,
-  //     limit.startLimitLine
-  //   );
-  //   let virtualEndPoint = mathUtil.getIntersectionPoint(
-  //     newLine,
-  //     limit.endLimitLine
-  //   );
-  //   // 刚刚开始移动的时候，或者吸附后再移动的时候，都需要积累一点移动距离才能真正开始移动
-  //   if (
-  //     !this.startMoving &&
-  //     (mathUtil.getDistance(startPoint, virtualStartPoint) <
-  //       Constant.minRealDis ||
-  //       mathUtil.getDistance(endPoint, virtualEndPoint) < Constant.minRealDis)
-  //   ) {
-  //     this.moveFlag = false;
-  //     MoveState = 2;
-  //     return MoveState;
-  //   }
-  //   this.setStartMoving(true);
-  //   // 判断是否会吸附到邻居墙的另一头端点，同时确保新的坐标在邻居墙内
-  //   let startInfo = this.updateVirtualPosition(
-  //     road.startId,
-  //     virtualStartPoint,
-  //     limit.startWallId,
-  //     limit.newStartWallId
-  //   );
-  //   let endInfo = this.updateVirtualPosition(
-  //     road.endId,
-  //     virtualEndPoint,
-  //     limit.endWallId,
-  //     limit.newEndWallId
-  //   );
-  //   if (startInfo == null || endInfo == null) {
-  //     this.moveFlag = false;
-  //     MoveState = 2;
-  //     this.setStartMoving(false);
-  //     return MoveState;
-  //   }
-
-  //   // 判断wallId的 1端/2端 吸附后，是否和别的墙重合
-  //   let coincideFlag = false;
-  //   // wallId的长度，可能会很短，要删除
-  //   let distance = null;
-  //   // 如果一头被吸附，另一头的坐标还要再次调整
-  //   if (startInfo.adsorb && !endInfo.adsorb) {
-  //     // 先更新newLine
-  //     newLine = mathUtil.createLine3(newLine, startInfo.virtualPosition);
-  //     // 需要判断夹角，如果接近0，则不能移动
-  //     const flag = this.isOKForTwoSegmentsAngle(
-  //       startInfo.adsorbPointId,
-  //       road.startId,
-  //       road.endId
-  //     );
-  //     if (!flag) {
-  //       this.moveFlag = false;
-  //       MoveState = 5;
-  //       return MoveState;
-  //     }
-  //     // 更新virtualEndPoint
-  //     virtualEndPoint = mathUtil.getIntersectionPoint(
-  //       newLine,
-  //       limit.endLimitLine
-  //     );
-  //     // 再次判断是否吸附
-  //     endInfo = this.updateVirtualPosition(
-  //       road.endId,
-  //       virtualEndPoint,
-  //       limit.endWallId,
-  //       limit.newEndWallId
-  //     );
-  //     if (endInfo == null) {
-  //       endInfo = {
-  //         adsorb: false,
-  //         adsorbPointId: null,
-  //         virtualPosition: virtualEndPoint,
-  //       };
-  //     }
-  //     // 一头吸附后，wallId可能和别的墙重合
-  //     coincideFlag = this.isCoincideForAdsorbOne(
-  //       road.startId,
-  //       startInfo.adsorbPointId,
-  //       roadId
-  //     );
-  //     distance = mathUtil.getDistance(
-  //       startInfo.virtualPosition,
-  //       virtualEndPoint
-  //     );
-
-  //     MoveState = 4;
-  //     this.needUpdateRoom = true;
-  //     this.setStartMoving(false);
-  //   } else if (!startInfo.adsorb && endInfo.adsorb) {
-  //     newLine = mathUtil.createLine3(newLine, endInfo.virtualPosition);
-  //     // 需要判断夹角，如果接近0，则不能移动
-  //     const flag = this.isOKForTwoSegmentsAngle(
-  //       endInfo.adsorbPointId,
-  //       road.endId,
-  //       road.startId
-  //     );
-  //     if (!flag) {
-  //       this.moveFlag = false;
-  //       MoveState = 5;
-  //       return MoveState;
-  //     }
-
-  //     virtualStartPoint = mathUtil.getIntersectionPoint(
-  //       newLine,
-  //       limit.startLimitLine
-  //     );
-  //     startInfo = this.updateVirtualPosition(
-  //       road.startId,
-  //       virtualStartPoint,
-  //       limit.startWallId,
-  //       limit.newStartWallId
-  //     );
-  //     if (startInfo == null) {
-  //       startInfo = {
-  //         adsorb: false,
-  //         adsorbPointId: null,
-  //         virtualPosition: virtualStartPoint,
-  //       };
-  //     }
-  //     coincideFlag = this.isCoincideForAdsorbOne(
-  //       road.endId,
-  //       endInfo.adsorbPointId,
-  //       roadId
-  //     );
-  //     distance = mathUtil.getDistance(
-  //       endInfo.virtualPosition,
-  //       virtualStartPoint
-  //     );
-
-  //     MoveState = 4;
-  //     this.needUpdateRoom = true;
-  //     this.setStartMoving(false);
-  //   }
-
-  //   // 两头同时吸附呢，wallId可能和别的墙重合
-  //   if (startInfo && endInfo && startInfo.adsorb && endInfo.adsorb) {
-  //     coincideFlag = this.isCoincideForAdsorbOne2(
-  //       roadId,
-  //       startInfo.adsorbPointId,
-  //       endInfo.adsorbPointId
-  //     );
-  //     distance = mathUtil.getDistance(
-  //       startInfo.virtualPosition,
-  //       endInfo.virtualPosition
-  //     );
-  //     this.setStartMoving(false);
-  //     if (coincideFlag) {
-  //       this.moveFlag = false;
-  //       MoveState = 5;
-  //       return MoveState;
-  //     }
-  //     MoveState = 4;
-  //     this.needUpdateRoom = true;
-  //   } else {
-  //     distance = mathUtil.getDistance(virtualStartPoint, virtualEndPoint);
-  //     if (distance < Constant.minRealDis) {
-  //       // 执行deleteWallForLinked后start和end会变，所以提前保存
-  //       this.deleteWallForLinked(roadId);
-  //       startPoint = dataService.getPoint(startPointId);
-  //       endPoint = dataService.getPoint(endPointId);
-  //       if (!startPoint || !endPoint) {
-  //         this.moveFlag = false;
-  //         MoveState = 3;
-  //         this.needUpdateRoom = true;
-  //         return MoveState;
-  //       }
-  //       if (
-  //         (Object.keys(startPoint.parent).length > 1 &&
-  //           Object.keys(endPoint.parent).length == 1) ||
-  //         (Object.keys(startPoint.parent).length == 1 &&
-  //           Object.keys(endPoint.parent).length == 1)
-  //       ) {
-  //         roadService.moveTo(endPointId, startPointId);
-  //       } else if (
-  //         Object.keys(startPoint.parent).length == 1 &&
-  //         Object.keys(endPoint.parent).length > 1
-  //       ) {
-  //         roadService.moveTo(startPointId, endPointId);
-  //       }
-  //       this.moveFlag = false;
-  //       MoveState = 3;
-  //       this.needUpdateRoom = true;
-  //       return MoveState;
-  //     }
-  //   }
-
-  //   startPointId = road.startId;
-  //   endPointId = road.endId;
-
-  //   // 是否交叉
-  //   const crossFlag = this.isOKForCrossForMoveRoad(
-  //     virtualStartPoint,
-  //     virtualEndPoint,
-  //     roadId,
-  //     startPointId,
-  //     endPointId,
-  //     startInfo.adsorbPointId,
-  //     endInfo.adsorbPointId
-  //   );
-  //   // ok
-  //   if (!crossFlag) {
-  //     MoveState = 2;
-  //     this.moveFlag = false;
-  //     this.setStartMoving(false);
-  //     return MoveState;
-  //   }
-
-  //   // 要删除墙了
-  //   if (coincideFlag || (distance != null && distance < Constant.minRealDis)) {
-  //     this.deleteWallForLinked(roadId);
-  //     MoveState = 3;
-  //     // 删除完墙，邻居墙可能会合并
-  //     roadService.mergeWallForPoint(startPointId);
-  //     roadService.mergeWallForPoint(endPointId);
-  //     this.moveFlag = false;
-  //     this.needUpdateRoom = true;
-  //     return MoveState;
-  //   } else {
-  //     // 要删除墙了
-  //     const join = mathUtil.getIntersectionPoint3(
-  //       startPoint,
-  //       virtualStartPoint,
-  //       endPoint,
-  //       virtualEndPoint
-  //     );
-  //     if (join != null) {
-  //       startPoint.setPosition(join);
-  //       endPoint.setPosition(join);
-  //       roadService.moveTo(startPointId, endPointId);
-  //       MoveState = 3;
-  //       this.moveFlag = false;
-  //       this.needUpdateRoom = true;
-  //       return MoveState;
-  //     }
-  //   }
-
-  //   let overlapFlag = false;
-  //   if (!limit.newStartWallId && startInfo.adsorbPointId) {
-  //     overlapFlag = roadService.isOverlapForMergePoint(
-  //       startPointId,
-  //       startInfo.adsorbPointId
-  //     );
-  //   } else if (!limit.newEndWallId && endInfo.adsorbPointId) {
-  //     overlapFlag = roadService.isOverlapForMergePoint(
-  //       endPointId,
-  //       endInfo.adsorbPointId
-  //     );
-  //   }
-  //   if (overlapFlag) {
-  //     this.moveFlag = false;
-  //     MoveState = 5;
-  //     return MoveState;
-  //   }
-
-  //   // 到了这一步，端点的新坐标已经确定了，这里开始更新端点坐标
-  //   // 这里需要升级优化，因为  updatePointForMoveWall方法里也更新了edge,这个其实不需要的。
-  //   this.updatePointForMoveRoad(
-  //     roadId,
-  //     startPointId,
-  //     startInfo,
-  //     limit.startWallId,
-  //     limit.newStartWallId
-  //   );
-  //   this.updatePointForMoveRoad(
-  //     roadId,
-  //     endPointId,
-  //     endInfo,
-  //     limit.endWallId,
-  //     limit.newEndWallId
-  //   );
-  //   road = dataService.getRoad(roadId);
-  //   if (road == null) {
-  //     MoveState = 3;
-  //     this.moveFlag = false;
-  //     this.needUpdateRoom = true;
-  //     // console.log(271)
-  //     return MoveState;
-  //   }
-  //   // 更新symbols
-  //   symbolService.updateSymbolsPositionsForWall(roadId);
-  //   // 更新邻居墙的symbols
-  //   startPoint = dataService.getPoint(road.startId);
-  //   endPoint = dataService.getPoint(road.endId);
-  //   for (const key in startPoint.parent) {
-  //     symbolService.updateSymbolsPositionsForNeighWall(key);
-  //   }
-  //   for (const key in endPoint.parent) {
-  //     symbolService.updateSymbolsPositionsForNeighWall(key);
-  //   }
-
-  //   if (MoveState == 1) {
-  //     this.moveFlag = true;
-  //   } else {
-  //     this.moveFlag = false;
-  //   }
-  //   return MoveState;
-  // }
-
   //拖拽墙角/墙面，被其他墙角吸附
   updateForAbsorbRoadPoints() {
     if (Object.keys(this.adsorbPointRoads).length == 0) {
@@ -840,7 +522,7 @@ export default class MoveRoad {
 
   // 用于邻居点
   // pointId是顶点
-  // position是wallId相对于pointId另一头的点的坐标，一般发生改变的时候使用这个函数
+  // position是roadId相对于pointId另一头的点的坐标，一般发生改变的时候使用这个函数
   getNeighMinAngle(otherPointId, roadId, position) {
     const point1 = dataService.getPoint(otherPointId);
     const point2 = {
@@ -873,8 +555,8 @@ export default class MoveRoad {
     return result;
   }
 
-  // linkedPointId,linkedWallId表示吸附
-  // wallIds是pointId的parent
+  // linkedPointId,linkedRoadId表示吸附
+  // roadIds是pointId的parent
   isOKForCross(pointId, position, roadIds, linkedPointId, linkedRoadId) {
     const roads = dataService.getRoads();
     for (const key in roads) {
@@ -1189,7 +871,7 @@ export default class MoveRoad {
   }
 
   // 一头吸附后，是否会重合
-  // pointId属于wallId，当pointId吸附到adsorbPointId时
+  // pointId属于roadId，当pointId吸附到adsorbPointId时
   isCoincideForAdsorbOne(pointId, adsorbPointId, roadId) {
     if (pointId && adsorbPointId) {
       const road = dataService.getRoad(roadId);
@@ -1232,9 +914,9 @@ export default class MoveRoad {
     return false;
   }
 
-  // position1和position2表示wall的两个端点坐标（下一步的）
-  // position3和position4表示wall的start一边的线段（startPoint——virtualStartPoint）
-  // position5和position6表示wall的end一边的线段（endPoint——virtualEndPoint）
+  // position1和position2表示road的两个端点坐标（下一步的）
+  // position3和position4表示road的start一边的线段（startPoint——virtualStartPoint）
+  // position5和position6表示road的end一边的线段（endPoint——virtualEndPoint）
   // adsorbPointId1对应start那一头的吸附点
   // adsorbPointId2对应end那一头的吸附点
   isOKForCrossForMoveRoad(

src/graphic/Geometry/ControlPoint.js

@@ -0,0 +1,45 @@
+import VectorType from "../enum/VectorType.js";
+import Geometry from "./Geometry";
+
+// 二次贝塞尔曲线
+// var ctx=c.getContext("2d");
+// ctx.beginPath();
+// ctx.moveTo(200,20);
+// ctx.quadraticCurveTo(20,100,20,20);
+// ctx.stroke();
+
+export default class ControlPoint extends Geometry {
+  constructor(position, vectorId) {
+    super();
+    //控制点坐标
+    this.x = null;
+    this.y = null;
+
+    this.edgeInfo1 = {
+      id: null,
+      dir: null,
+    };
+
+    this.edgeInfo2 = {
+      id: null,
+      dir: null,
+    };
+
+    this.geoType = VectorType.ControlPoint;
+    this.setId(vectorId);
+
+    this.setPosition(position);
+  }
+
+  setPosition(position) {
+    this.x = position.x;
+    this.y = position.y;
+  }
+
+  setEdgeInfo(edgeId1, dir1, edgeId2, dir2) {
+    this.edgeInfo1.id = edgeId1;
+    this.edgeInfo1.dir = dir1;
+    this.edgeInfo2.id = edgeId2;
+    this.edgeInfo2.dir = dir2;
+  }
+}

src/graphic/Geometry/Edge.js

@@ -24,6 +24,14 @@ export default class Edge extends Geometry {
     this.end.y = point2.y;
   }
 
+  setPosition(position, dir) {
+    if (dir == "start") {
+      mathUtil.clonePoint(start, position);
+    } else if (dir == "end") {
+      mathUtil.clonePoint(end, position);
+    }
+  }
+
   getLine() {
     let line = mathUtil.createLine1(this.start, this.end);
     return line;

src/graphic/Geometry/Point.js

@@ -6,7 +6,6 @@ export default class Point extends Geometry {
     super();
     this.x = null;
     this.y = null;
-    this.name = null;
     this.parent = {};
     this.geoType = VectorType.Point;
     this.setId(vectorId);

src/graphic/Geometry/Tag.js

@@ -36,22 +36,22 @@ export default class Tag extends Geometry {
     this.points2d = [];
     const minX =
       this.center.x -
-      ((this.sideWidth / coordinate.res) * Constant.defaultZoom) /
+      ((this.sideWidth / coordinate.res) * coordinate.defaultZoom) /
         coordinate.zoom /
         2;
     const minY =
       this.center.y -
-      ((this.sideThickness / coordinate.res) * Constant.defaultZoom) /
+      ((this.sideThickness / coordinate.res) * coordinate.defaultZoom) /
         coordinate.zoom /
         2;
     const maxX =
       this.center.x +
-      ((this.sideWidth / coordinate.res) * Constant.defaultZoom) /
+      ((this.sideWidth / coordinate.res) * coordinate.defaultZoom) /
         coordinate.zoom /
         2;
     const maxY =
       this.center.y +
-      ((this.sideThickness / coordinate.res) * Constant.defaultZoom) /
+      ((this.sideThickness / coordinate.res) * coordinate.defaultZoom) /
         coordinate.zoom /
         2;
 

src/graphic/Layer.js

@@ -235,7 +235,7 @@ export default class Layer {
       case LayerEvents.MoveRoad:
         dx = (dx * coordinate.defaultZoom) / coordinate.zoom;
         dy = (dy * coordinate.defaultZoom) / coordinate.zoom;
-        // 1表示可以继续移动，2表示不能移动(启动距离还不够)，3表示wallId被删除了,4表示重新开始移动（需要达到一定距离才能启动）,5表示不能移动（不合适）
+        // 1表示可以继续移动，2表示不能移动(启动距离还不够)，3表示roadId被删除了,4表示重新开始移动（需要达到一定距离才能启动）,5表示不能移动（不合适）
         let moveFlag = moveRoad.moveRoadPlane(draggingItem.vectorId, dx, dy);
         // 启动的时候需要点距离，所以真正移动了才更新lastX和lastY
         if (moveFlag == 1) {

src/graphic/Renderer/Draw.js

@@ -73,7 +73,7 @@ export default class Draw {
       this.context.globalAlpha = 0.3;
       point1 = coordinate.getScreenXY(vector.start);
       point2 = coordinate.getScreenXY(vector.end);
-      this.context.lineWidth = Constant.defaultRoad;
+      this.context.lineWidth = Constant.defaultRoadWidth;
     } else {
       let start = dataService.getPoint(vector.startId);
       let end = dataService.getPoint(vector.endId);

src/graphic/Service/ControlPointService.js

@@ -0,0 +1,44 @@
+import ControlPoint from "../Geometry/ControlPoint.js";
+import { dataService } from "./DataService.js";
+import { mathUtil } from "../Util/MathUtil";
+import { edgeService } from "./EdgeService.js";
+
+export default class ControlPointService {
+  constructor() {}
+
+  create(position, vectorId) {
+    let controlPoint = new ControlPoint(position, vectorId);
+    dataService.addControlPoint(controlPoint);
+    return controlPoint;
+  }
+
+  update(point, edgePosition, edge1, edge2, dir1, dir2) {
+    let controlPoint = dataService.getControlPoint(
+      edge1.vectorId,
+      edge2.vectorId
+    );
+    const line1 = edgeService.getLine(edge1);
+    const line2 = edgeService.getLine(edge2);
+    const position = mathUtil.getPositionForExtendedLine(point, edgePosition);
+    //更新edge的坐标
+    const position1 = mathUtil.getJoinLinePoint(position, line1);
+    const position2 = mathUtil.getJoinLinePoint(position, line2);
+    if (controlPoint == null) {
+      //新建控制点
+      controlPoint = this.create(position);
+      //设置控制点的信息
+      controlPoint.setEdgeInfo(edge1.vectorId, dir1, edge2.vectorId, dir2);
+      //添加到数据集里
+      dataService.addControlPoint(controlPoint);
+    }
+    //更新控制点坐标
+    else {
+      controlPoint.setPosition(position);
+    }
+    edge1.setPosition(position1, dir1);
+    edge2.setPosition(position2, dir2);
+  }
+}
+
+const controlPointService = new ControlPointService();
+export { controlPointService };

src/graphic/Service/DataService.js

@@ -98,6 +98,37 @@ export class DataService {
   }
 
   /**
+   * 对控制点的操作
+   */
+  getControlPoints() {
+    return this.vectorData.controlPoints;
+  }
+
+  // getControlPoint(controlPointId) {
+  //   if (controlPointId) {
+  //     return this.vectorData.controlPoints[controlPointId];
+  //   } else {
+  //     return null;
+  //   }
+  // }
+
+  getControlPoint(edgeId1, edgeId2) {
+    if (this.vectorData.controlPoints[edgeId1 + "-" + edgeId2]) {
+      return this.vectorData.controlPoints[edgeId1 + "-" + edgeId2];
+    } else if (this.vectorData.controlPoints[edgeId2 + "-" + edgeId1]) {
+      return this.vectorData.controlPoints[edgeId2 + "-" + edgeId1];
+    } else {
+      return null;
+    }
+  }
+
+  addControlPoint(controlPoint) {
+    this.vectorData.controlPoints[
+      controlPoint.edgeInfo1.id + "-" + controlPoint.edgeInfo2.id
+    ] = controlPoint;
+  }
+
+  /**
    * 对公路边缘的操作
    */
   getEdge(edgeId) {

src/graphic/Service/EdgeService.js

@@ -1,6 +1,8 @@
 import Edge from "../Geometry/Edge.js";
+import Constant from "../Constant.js";
 import { dataService } from "./DataService.js";
 import { roadService } from "./RoadService.js";
+import { controlPointService } from "./ControlPointService.js";
 import { mathUtil } from "../Util/MathUtil.js";
 
 export default class EdgeService {
@@ -12,7 +14,7 @@ export default class EdgeService {
     return edge;
   }
 
-  getMidLine(edge) {
+  getLine(edge) {
     let line = mathUtil.createLine1(edge.start, edge.end);
     return line;
   }
@@ -67,6 +69,7 @@ export default class EdgeService {
     }
   }
 
+  //单独的墙的一端
   updateDefaultEdge(roadId, dir) {
     //console.log('计算'+roadId+' '+dir+'方向的默认Edge端点');
     console.log("开始执行updateDefaultEdge");
@@ -103,115 +106,6 @@ export default class EdgeService {
     }
   }
 
-  computerEdgeForTwoRoad(roadId1, roadId2) {
-    //console.log('计算'+roadId1+'和'+roadId2+'相交的edge交点');
-    console.log("开始执行computerEdgeForTwoRoad");
-    let road1 = dataService.getRoad(roadId1);
-    let startPoint1 = dataService.getPoint(road1.startId);
-    let endPoint1 = dataService.getPoint(road1.endId);
-    this.computerDefaultEdge(roadId1);
-    let leftEdge1 = dataService.getEdge(road1.leftEdgeId);
-    let rightEdge1 = dataService.getEdge(road1.rightEdgeId);
-    let lineLeft1 = this.getMidLine(leftEdge1);
-    let lineRight1 = this.getMidLine(rightEdge1);
-
-    let road2 = dataService.getRoad(roadId2);
-    this.computerDefaultEdge(roadId2);
-    // let startPoint2 = dataService.getPoint(road2.startId);
-    // let endPoint2 = dataService.getPoint(road2.endId);
-    let leftEdge2 = dataService.getEdge(road2.leftEdgeId);
-    let rightEdge2 = dataService.getEdge(road2.rightEdgeId);
-    let lineLeft2 = this.getMidLine(leftEdge2);
-    let lineRight2 = this.getMidLine(rightEdge2);
-
-    let angleInfo = roadService.AngleForRoad2(roadId1, roadId2);
-    let angle = null;
-    if (angleInfo == null) {
-      return false;
-    } else {
-      angle = angleInfo.angle;
-    }
-    let newEdgePoint1, newEdgePoint2;
-
-    //start-start
-    //left-right，right-left
-    if (road1.startId == road2.startId) {
-      //如果墙的角度过大，不能计算edge对应的line的交点
-      if (angle > Setting.Size.MaxAngle) {
-        newEdgePoint1 = mathUtil.getJoinLinePoint(startPoint1, lineLeft1);
-        newEdgePoint2 = mathUtil.getJoinLinePoint(startPoint1, lineRight1);
-      } else {
-        newEdgePoint1 = mathUtil.getIntersectionPoint(lineLeft1, lineRight2);
-        newEdgePoint2 = mathUtil.getIntersectionPoint(lineLeft2, lineRight1);
-      }
-      mathUtil.clonePoint(leftEdge1.start, newEdgePoint1);
-      mathUtil.clonePoint(rightEdge1.start, newEdgePoint2);
-
-      mathUtil.clonePoint(rightEdge2.start, newEdgePoint1);
-      mathUtil.clonePoint(leftEdge2.start, newEdgePoint2);
-      return true;
-    }
-    //start-end
-    //left-left，right-right
-    else if (road1.startId == road2.endId) {
-      if (angle > Setting.Size.MaxAngle) {
-        newEdgePoint1 = mathUtil.getJoinLinePoint(startPoint1, lineLeft1);
-        newEdgePoint2 = mathUtil.getJoinLinePoint(startPoint1, lineRight1);
-      } else {
-        newEdgePoint1 = mathUtil.getIntersectionPoint(lineLeft1, lineLeft2);
-        newEdgePoint2 = mathUtil.getIntersectionPoint(lineRight1, lineRight2);
-      }
-
-      mathUtil.clonePoint(leftEdge1.start, newEdgePoint1);
-      mathUtil.clonePoint(rightEdge1.start, newEdgePoint2);
-
-      mathUtil.clonePoint(leftEdge2.end, newEdgePoint1);
-      mathUtil.clonePoint(rightEdge2.end, newEdgePoint2);
-      return true;
-    }
-    //end-start
-    //left-left，right-right
-    else if (road1.endId == road2.startId) {
-      if (angle > Setting.Size.MaxAngle) {
-        newEdgePoint1 = mathUtil.getJoinLinePoint(endPoint1, lineLeft1);
-        newEdgePoint2 = mathUtil.getJoinLinePoint(endPoint1, lineRight1);
-      } else {
-        newEdgePoint1 = mathUtil.getIntersectionPoint(lineLeft1, lineLeft2);
-        newEdgePoint2 = mathUtil.getIntersectionPoint(lineRight1, lineRight2);
-      }
-
-      mathUtil.clonePoint(leftEdge1.end, newEdgePoint1);
-      mathUtil.clonePoint(rightEdge1.end, newEdgePoint2);
-
-      mathUtil.clonePoint(leftEdge2.start, newEdgePoint1);
-      mathUtil.clonePoint(rightEdge2.start, newEdgePoint2);
-      return true;
-    }
-    //end-end
-    //left-right，right-left
-    else if (road1.endId == road2.endId) {
-      if (angle > Setting.Size.MaxAngle) {
-        newEdgePoint1 = mathUtil.getJoinLinePoint(endPoint1, lineLeft1);
-        newEdgePoint2 = mathUtil.getJoinLinePoint(endPoint1, lineRight1);
-      } else {
-        newEdgePoint1 = mathUtil.getIntersectionPoint(lineLeft1, lineRight2);
-        newEdgePoint2 = mathUtil.getIntersectionPoint(lineLeft2, lineRight1);
-      }
-
-      mathUtil.clonePoint(leftEdge1.end, newEdgePoint1);
-      mathUtil.clonePoint(rightEdge1.end, newEdgePoint2);
-
-      mathUtil.clonePoint(rightEdge2.end, newEdgePoint1);
-      mathUtil.clonePoint(leftEdge2.end, newEdgePoint2);
-      return true;
-    } else {
-      console.error(
-        "computerEdgeForTwoRoad**********************************************************"
-      );
-      return false;
-    }
-  }
-
   //roadId1,roadId2已经相交，这里只是为了算出两堵墙edge的start和end
   //不纠正edge与墙的中心线平行
   updateEdgeForTwoRoad(roadId1, roadId2) {
@@ -224,8 +118,8 @@ export default class EdgeService {
     this.computerDefaultEdge(roadId1);
     let leftEdge1 = dataService.getEdge(road1.leftEdgeId);
     let rightEdge1 = dataService.getEdge(road1.rightEdgeId);
-    let lineLeft1 = this.getMidLine(leftEdge1);
-    let lineRight1 = this.getMidLine(rightEdge1);
+    let lineLeft1 = this.getLine(leftEdge1);
+    let lineRight1 = this.getLine(rightEdge1);
 
     let road2 = dataService.getRoad(roadId2);
     this.computerDefaultEdge(roadId2);
@@ -233,8 +127,8 @@ export default class EdgeService {
     // let endPoint2 = dataService.getPoint(road2.endId);
     let leftEdge2 = dataService.getEdge(road2.leftEdgeId);
     let rightEdge2 = dataService.getEdge(road2.rightEdgeId);
-    let lineLeft2 = this.getMidLine(leftEdge2);
-    let lineRight2 = this.getMidLine(rightEdge2);
+    let lineLeft2 = this.getLine(leftEdge2);
+    let lineRight2 = this.getLine(rightEdge2);
 
     let angleInfo = roadService.AngleForRoad2(roadId1, roadId2);
     let angle = null;
@@ -244,18 +138,44 @@ export default class EdgeService {
       angle = angleInfo.angle;
     }
     let newEdgePoint1, newEdgePoint2;
+    let points = [];
 
     //start-start
     //left-right，right-left
     if (road1.startId == road2.startId) {
       //如果墙的角度过大，不能计算edge对应的line的交点
-      if (angle > Setting.Size.MaxAngle) {
+      if (angle > Constant.maxAngle) {
         newEdgePoint1 = mathUtil.getJoinLinePoint(startPoint1, lineLeft1);
         newEdgePoint2 = mathUtil.getJoinLinePoint(startPoint1, lineRight1);
       } else {
         newEdgePoint1 = mathUtil.getIntersectionPoint(lineLeft1, lineRight2);
         newEdgePoint2 = mathUtil.getIntersectionPoint(lineLeft2, lineRight1);
+        points.push(startPoint1);
+        points.push(endPoint1);
+        points.push(newEdgePoint1);
+        if (mathUtil.isClockwise(points)) {
+          //需要考虑控制点ControlPointService
+          controlPointService.update(
+            startPoint1,
+            newEdgePoint1,
+            leftEdge1,
+            rightEdge2,
+            "start",
+            "start"
+          );
+        } else {
+          //需要考虑控制点ControlPointService
+          controlPointService.update(
+            startPoint1,
+            newEdgePoint1,
+            rightEdge1,
+            leftEdge2,
+            "start",
+            "start"
+          );
+        }
       }
+
       mathUtil.clonePoint(leftEdge1.start, newEdgePoint1);
       mathUtil.clonePoint(rightEdge1.start, newEdgePoint2);
 
@@ -266,12 +186,36 @@ export default class EdgeService {
     //start-end
     //left-left，right-right
     else if (road1.startId == road2.endId) {
-      if (angle > Setting.Size.MaxAngle) {
+      if (angle > Constant.maxAngle) {
         newEdgePoint1 = mathUtil.getJoinLinePoint(startPoint1, lineLeft1);
         newEdgePoint2 = mathUtil.getJoinLinePoint(startPoint1, lineRight1);
       } else {
         newEdgePoint1 = mathUtil.getIntersectionPoint(lineLeft1, lineLeft2);
         newEdgePoint2 = mathUtil.getIntersectionPoint(lineRight1, lineRight2);
+        points.push(startPoint1);
+        points.push(endPoint1);
+        points.push(newEdgePoint1);
+        if (mathUtil.isClockwise(points)) {
+          //需要考虑控制点ControlPointService
+          controlPointService.update(
+            startPoint1,
+            newEdgePoint1,
+            leftEdge1,
+            leftEdge2,
+            "start",
+            "end"
+          );
+        } else {
+          //需要考虑控制点ControlPointService
+          controlPointService.update(
+            startPoint1,
+            newEdgePoint1,
+            rightEdge1,
+            rightEdge2,
+            "start",
+            "end"
+          );
+        }
       }
 
       mathUtil.clonePoint(leftEdge1.start, newEdgePoint1);
@@ -284,7 +228,7 @@ export default class EdgeService {
     //end-start
     //left-left，right-right
     else if (road1.endId == road2.startId) {
-      if (angle > Setting.Size.MaxAngle) {
+      if (angle > Constant.maxAngle) {
         newEdgePoint1 = mathUtil.getJoinLinePoint(endPoint1, lineLeft1);
         newEdgePoint2 = mathUtil.getJoinLinePoint(endPoint1, lineRight1);
       } else {
@@ -302,7 +246,7 @@ export default class EdgeService {
     //end-end
     //left-right，right-left
     else if (road1.endId == road2.endId) {
-      if (angle > Setting.Size.MaxAngle) {
+      if (angle > Constant.maxAngle) {
         newEdgePoint1 = mathUtil.getJoinLinePoint(endPoint1, lineLeft1);
         newEdgePoint2 = mathUtil.getJoinLinePoint(endPoint1, lineRight1);
       } else {
@@ -328,6 +272,7 @@ export default class EdgeService {
   //只是计算roadId1,roadId2之间的一个edge
   //roadId1和roadId2相交的交点是join。以join为中心，roadId1逆时针旋转到roadId2，他们之间的那个edge
   //方法是：join，roadId1另一头的点p1，计算后的edge交点p2。这三个点是逆时针即可
+  //主要用于多个road相交，计算相邻的road之间的edge
   updateSingleEdgeForTwoRoad(roadId1, roadId2) {
     //console.log('更新'+roadId1+'和'+roadId2+'一侧相交的edge交点');
     console.log("开始执行updateSingleEdgeForTwoRoad");
@@ -337,8 +282,8 @@ export default class EdgeService {
     this.computerDefaultEdge(roadId1);
     let leftEdge1 = dataService.getEdge(road1.leftEdgeId);
     let rightEdge1 = dataService.getEdge(road1.rightEdgeId);
-    let lineLeft1 = this.getMidLine(leftEdge1);
-    let lineRight1 = this.getMidLine(rightEdge1);
+    let lineLeft1 = this.getLine(leftEdge1);
+    let lineRight1 = this.getLine(rightEdge1);
 
     let road2 = dataService.getRoad(roadId2);
     this.computerDefaultEdge(roadId2);
@@ -346,8 +291,8 @@ export default class EdgeService {
     // let endPoint2 = dataService.getPoint(road2.endId);
     let leftEdge2 = dataService.getEdge(road2.leftEdgeId);
     let rightEdge2 = dataService.getEdge(road2.rightEdgeId);
-    let lineLeft2 = this.getMidLine(leftEdge2);
-    let lineRight2 = this.getMidLine(rightEdge2);
+    let lineLeft2 = this.getLine(leftEdge2);
+    let lineRight2 = this.getLine(rightEdge2);
 
     let angleInfo = roadService.AngleForRoad2(roadId1, roadId2);
     let angle = null;
@@ -366,7 +311,7 @@ export default class EdgeService {
       points.push(startPoint1);
       points.push(endPoint1);
       //如果墙的角度过大，不能计算edge对应的line的交点
-      if (angle > Setting.Size.MaxAngle) {
+      if (angle > Constant.maxAngle) {
         newEdgePoint1 = mathUtil.getJoinLinePoint(startPoint1, lineLeft1);
         newEdgePoint2 = mathUtil.getJoinLinePoint(startPoint1, lineRight1);
       } else {
@@ -389,7 +334,7 @@ export default class EdgeService {
     else if (road1.startId == road2.endId) {
       points.push(startPoint1);
       points.push(endPoint1);
-      if (angle > Setting.Size.MaxAngle) {
+      if (angle > Constant.maxAngle) {
         newEdgePoint1 = mathUtil.getJoinLinePoint(startPoint1, lineLeft1);
         newEdgePoint2 = mathUtil.getJoinLinePoint(startPoint1, lineRight1);
       } else {
@@ -411,7 +356,7 @@ export default class EdgeService {
     else if (road1.endId == road2.startId) {
       points.push(endPoint1);
       points.push(startPoint1);
-      if (angle > Setting.Size.MaxAngle) {
+      if (angle > Constant.maxAngle) {
         newEdgePoint1 = mathUtil.getJoinLinePoint(endPoint1, lineLeft1);
         newEdgePoint2 = mathUtil.getJoinLinePoint(endPoint1, lineRight1);
       } else {
@@ -433,7 +378,7 @@ export default class EdgeService {
     else if (road1.endID == road2.endId) {
       points.push(endPoint1);
       points.push(startPoint1);
-      if (angle > Setting.Size.MaxAngle) {
+      if (angle > Constant.maxAngle) {
         newEdgePoint1 = mathUtil.getJoinLinePoint(endPoint1, lineLeft1);
         newEdgePoint2 = mathUtil.getJoinLinePoint(endPoint1, lineRight1);
       } else {
@@ -545,33 +490,28 @@ export default class EdgeService {
     }
   }
 
-  // //pointId1和pointId2是roadId的两个端点，pointId1移动到和pointId2重合的位置
-  // //这个函数解决：pointId1和pointId2的坐标重合了edge坐标
-  // updateEdgeForSamePosition(pointId1, pointId2, roadId) {
-  //   let road = dataService.getRoad(roadId);
-  //   let point1 = dataService.getPoint(pointId1);
-  //   let point2 = dataService.getPoint(pointId2);
-  //   if (!mathUtil.equalForPoint(point1, point2)) {
-  //     return;
-  //   }
-
-  //   dataService.getEdge
-
-  //   let vLeft = globalObjects.managerVectors.getVector(this.leftEdgeId);
-  //   let vRight = globalObjects.managerVectors.getVector(this.rightEdgeId);
-
-  //   if (pointId1 == road.geometry.start && pointId2 == road.geometry.end) {
-  //     mathUtil.clonePoint(vLeft.geometry.start, vLeft.geometry.end);
-  //     mathUtil.clonePoint(vRight.geometry.start, vRight.geometry.end);
-  //   } else if (
-  //     pointId1 == road.geometry.end &&
-  //     pointId2 == road.geometry.start
-  //   ) {
-  //     mathUtil.clonePoint(vLeft.geometry.end, vLeft.geometry.start);
-  //     mathUtil.clonePoint(vRight.geometry.end, vRight.geometry.start);
-  //   }
-  //   return;
-  // }
+  //pointId1和pointId2是roadId的两个端点，pointId1移动到和pointId2重合的位置
+  //这个函数解决：pointId1和pointId2的坐标重合了edge坐标
+  updateEdgeForSamePosition(pointId1, pointId2, roadId) {
+    let road = dataService.getRoad(roadId);
+    let point1 = dataService.getPoint(pointId1);
+    let point2 = dataService.getPoint(pointId2);
+    if (!mathUtil.equalPoint(point1, point2)) {
+      return;
+    }
+
+    let vLeft = dataService.getEdge(this.leftEdgeId);
+    let vRight = dataService.getEdge(this.rightEdgeId);
+
+    if (pointId1 == road.startId && pointId2 == road.endId) {
+      mathUtil.clonePoint(vLeft.start, vLeft.end);
+      mathUtil.clonePoint(vRight.start, vRight.end);
+    } else if (pointId1 == road.endId && pointId2 == road.startId) {
+      mathUtil.clonePoint(vLeft.end, vLeft.start);
+      mathUtil.clonePoint(vRight.end, vRight.start);
+    }
+    return;
+  }
 }
 
 const edgeService = new EdgeService();

src/graphic/Util/EdgeUtil.js

@@ -1,15 +0,0 @@
-import { mathUtil } from "./MathUtil";
-import GeoUtil from "./GeoUtil.js";
-import { dataService } from "../Service/DataService.js";
-import { roadService } from "../Service/RoadService.js";
-
-import Vector from "../Vector/Vector.js";
-import Point from "../Geometry/Point.js";
-import Road from "../Geometry/Road.js";
-import Edge from "../Geometry/Edge.js";
-
-//update开头的，edge默认和墙的中心线是平行的
-//compute开头的，edge需要考虑和墙的中心线平行
-var EdgeUtil = {};
-
-export default EdgeUtil;

src/graphic/Util/MathUtil.js

@@ -981,6 +981,17 @@ export default class MathUtil {
       leftEdgeEnd: leftEdgeEnd,
     };
   }
+
+  //start到end的射线中取一点point，start-end和end-point的距离相同
+  getPositionForExtendedLine(start, end) {
+    const dx = end.x - start.x;
+    const dy = end.y - start.y;
+    const point = {
+      x: end.x + dx,
+      y: end.y + dy,
+    };
+    return point;
+  }
 }
 
 const mathUtil = new MathUtil();

src/graphic/enum/VectorType.js

@@ -1,5 +1,6 @@
 const VectorType = {
   Point: "Point",
+  ControlPoint: "ControlPoint",
   Circle: "Circle",
   Img: "Img",
   Line: "Line",