Merge branch 'dev' of http://192.168.0.115:3000/bill/traffic-laser into dev

src/components/fill-slide/index.vue

@@ -158,4 +158,7 @@ watch(
     margin-left: 32px;
   }
 }
+.PhotoView__Photo {
+  background: #fff;
+}
 </style>

src/components/photos/index.vue

@@ -117,6 +117,7 @@ const changeSelects = (item: Item, selected: boolean) => {
   height: 100%;
   object-fit: contain;
   border-radius: 4px;
+  background: #fff;
 }
 
 .occupying {

src/graphic/CanvasStyle/ImageLabels/SVGIcons.js

@@ -1,5 +1,7 @@
 const SVGIcons = {
- 
+  ZebraCrossing: {
+    text: "斑马线",
+  },
   "chemotuoche_p.svg": {
     text: "侧三轮平面",
     draw: function (ctx, fillStyle, strokeStyle) {
@@ -4133,13 +4135,7 @@ const SVGIcons = {
 export const structureTypeKeys = [
   {
     type: "道路结构",
-    children: [
-      "lunshituolaji_p.svg",
-      "zhengsanlun_s.svg",
-      "chemotuoche_p.svg",
-      "dianche_p.svg",
-      "keche_s.svg",
-    ],
+    children: ["lunshituolaji_p.svg", "zhengsanlun_s.svg", "chemotuoche_p.svg", "dianche_p.svg", "keche_s.svg"],
   },
 ];
 
@@ -4177,40 +4173,21 @@ export const imageTypeKeys = [
   },
   {
     type: "非机动车",
-    children: [
-      "erlunmotuoche.svg",
-      "fjdc_canjiren_p.svg",
-      "fjdc_canjiren_s.svg",
-      "fjdc_renliche.svg",
-      "fjdc_sanlunche.svg",
-      "fjdc_xuliche.svg",
-      "fjdc_zixingche.svg",
-    ],
+    children: ["erlunmotuoche.svg", "fjdc_canjiren_p.svg", "fjdc_canjiren_s.svg", "fjdc_renliche.svg", "fjdc_sanlunche.svg", "fjdc_xuliche.svg", "fjdc_zixingche.svg"],
   },
   {
     type: "人体、牲畜",
-    children: [
-      "rt_rt.svg",
-      "rt_shit.svg",
-      "rt_st.svg",
-      "sc_sc.svg",
-      "sc_shangc.svg",
-      "sc_shic.svg",
-    ],
+    children: ["rt_rt.svg", "rt_shit.svg", "rt_st.svg", "sc_sc.svg", "sc_shangc.svg", "sc_shic.svg"],
   },
   {
     type: "地面标志及交通现象",
-    children: [
-      "jtxx_fangxb.svg",
-      "jtxx_fengxb.svg",
-      "jtxx_fjdcxsfx.svg",
-      "jtxx_jcd.svg",
-      "jtxx_jdcxsfx.svg",
-      "jtxx_ryydfx.svg",
-    ],
+    children: ["jtxx_fangxb.svg", "jtxx_fengxb.svg", "jtxx_fjdcxsfx.svg", "jtxx_jcd.svg", "jtxx_jdcxsfx.svg", "jtxx_ryydfx.svg"],
   },
-
- 
+  // // 道路结构
+  // {
+  //   type: "道路结构",
+  //   children: ["ZebraCrossing"],
+  // },
 ];
 
 export default SVGIcons;

src/graphic/CanvasStyle/default.js

@@ -143,9 +143,7 @@ const MeasureLine = {
   lineWidth: 2 * coordinate.ratio,
   text: {
     fontSize: 12,
-    fillColor: "#000",
     padding: 6 * coordinate.ratio,
-    backColor: "#2F8FFF",
   },
 };
 const BaseLine = {

src/graphic/CanvasStyle/screen.js

@@ -143,9 +143,7 @@ const MeasureLine = {
   lineWidth: 2 * coordinate.ratio,
   text: {
     fontSize: 12,
-    fillColor: "#000",
     padding: 6 * coordinate.ratio,
-    backColor: "#000",
   },
 };
 const BaseLine = {

src/graphic/Constant.js

@@ -1,3 +1,4 @@
+import { drawSetting } from "@/store/drawSetting";
 const Constant = {
   /*
         最小距离
@@ -27,20 +28,20 @@ const Constant = {
   minAdsorbPix: 25, //最小吸附像素
   minRealDis: 20,
   defaultRoadWidth: 100, //默认公路宽度
-  roadSideWidth: 20, //默认路缘宽度
+  roadSideWidth: 0.2, //默认路缘宽度
   roadWidthTipsDistance: 100, //路宽提示距离
   ratio: 1,
   minAngle: 10,
   maxAngle: 170,
   minRoadSideWidth: 30,
   maxRoadSideWidth: 800,
-  oneWay: 'oneWay', //one表示单向，two表示双向
-  twoWay: 'twoWay', //one表示单向，two表示双向
-  defaultSingleLaneWidth: 3.5, //单个车道的宽度
-  defaultMidDivideWidth: 0.2, //隔离带的宽度
-  angleLocationMode: 'AngleLocationMode', //直角定位
-  allLocationMode: 'AllLocationMode', //综合定位
-  normalLocationMode: 'NormalLocationMode', //垂线定位
-  freeLocationMode: 'FreeLocationMode', //自由测量
+  oneWay: "oneWay", //one表示单向，two表示双向
+  twoWay: "twoWay", //one表示单向，two表示双向
+  defaultSingleLaneWidth: drawSetting.value?.defaultSingleLaneWidth || 3.5, //单个车道的宽度
+  defaultMidDivideWidth: drawSetting.value?.defaultMidDivideWidth || 0.2, //隔离带的宽度
+  angleLocationMode: "AngleLocationMode", //直角定位
+  allLocationMode: "AllLocationMode", //综合定位
+  normalLocationMode: "NormalLocationMode", //垂线定位
+  freeLocationMode: "FreeLocationMode", //自由测量
 };
 export default Constant;

src/graphic/Controls/MoveRoad.js

@@ -44,21 +44,13 @@ export default class MoveRoad {
     // }
     this.adsorbPointRoads = {};
     this.splitRoadId = null;
-    let flag = this.canMoveForPoint(
-      pointId,
-      position,
-      linkedRoadPointId,
-      linkedRoadId
-    );
+    let flag = this.canMoveForPoint(pointId, position, linkedRoadPointId, linkedRoadId);
 
     if (!flag) {
       return false;
     }
 
-    if (
-      this.splitRoadId == null &&
-      Object.keys(this.adsorbPointRoads).length > 0
-    ) {
+    if (this.splitRoadId == null && Object.keys(this.adsorbPointRoads).length > 0) {
       //要吸附一下
       const adsorbPointId = Object.keys(this.adsorbPointRoads)[0];
       const road = dataService.getRoad(this.adsorbPointRoads[adsorbPointId]);
@@ -74,14 +66,8 @@ export default class MoveRoad {
       point.setPosition(position);
     }
     // 与别的墙角重合
-    else if (
-      modifyPoint.hasOwnProperty("linkedRoadPointId") &&
-      modifyPoint.linkedRoadPointId != null
-    ) {
-      const roadId = roadService.getRoadId(
-        pointId,
-        modifyPoint.linkedRoadPointId
-      );
+    else if (modifyPoint.hasOwnProperty("linkedRoadPointId") && modifyPoint.linkedRoadPointId != null) {
+      const roadId = roadService.getRoadId(pointId, modifyPoint.linkedRoadPointId);
       // pointId与linkedPointId属于同一堵墙，不允许，所以不移动
       if (roadId != null) {
         return false;
@@ -97,24 +83,15 @@ export default class MoveRoad {
       const endPoint = dataService.getRoadPoint(road.endId);
 
       // 与其余墙角的距离过短，不允许拖动
-      if (
-        mathUtil.getDistance(startPoint, position) < Constant.minRealDis ||
-        mathUtil.getDistance(endPoint, position) < Constant.minRealDis
-      ) {
+      if (mathUtil.getDistance(startPoint, position) < Constant.minRealDis || mathUtil.getDistance(endPoint, position) < Constant.minRealDis) {
         return false;
       }
       point.setPosition(modifyPoint);
     } else if (modifyPoint.hasOwnProperty("linkedCurveRoadPointId")) {
       point.setPosition(position);
-    } else if (
-      modifyPoint.hasOwnProperty("linkedRoadPointIdX") &&
-      modifyPoint.linkedRoadPointIdX
-    ) {
+    } else if (modifyPoint.hasOwnProperty("linkedRoadPointIdX") && modifyPoint.linkedRoadPointIdX) {
       point.setPosition(position);
-    } else if (
-      modifyPoint.hasOwnProperty("linkedRoadPointIdY") &&
-      modifyPoint.linkedRoadPointIdY
-    ) {
+    } else if (modifyPoint.hasOwnProperty("linkedRoadPointIdY") && modifyPoint.linkedRoadPointIdY) {
       point.setPosition(position);
     } else {
       return false;
@@ -174,26 +151,12 @@ export default class MoveRoad {
   }
 
   finishByMoveRoadPoint(point) {
-    if (
-      listenLayer.modifyPoint &&
-      listenLayer.modifyPoint.hasOwnProperty("linkedRoadPointId")
-    ) {
+    if (listenLayer.modifyPoint && listenLayer.modifyPoint.hasOwnProperty("linkedRoadPointId")) {
       this.moveTo(point.vectorId, listenLayer.modifyPoint.linkedRoadPointId);
-    } else if (
-      listenLayer.modifyPoint &&
-      (listenLayer.modifyPoint.linkedRoadPointIdX ||
-        listenLayer.modifyPoint.linkedRoadPointIdY)
-    ) {
+    } else if (listenLayer.modifyPoint && (listenLayer.modifyPoint.linkedRoadPointIdX || listenLayer.modifyPoint.linkedRoadPointIdY)) {
       mathUtil.clonePoint(point, listenLayer.modifyPoint);
-    } else if (
-      listenLayer.modifyPoint &&
-      listenLayer.modifyPoint.hasOwnProperty("linkedRoadId")
-    ) {
-      roadService.splitRoad(
-        listenLayer.modifyPoint.linkedRoadId,
-        point.vectorId,
-        "start"
-      );
+    } else if (listenLayer.modifyPoint && listenLayer.modifyPoint.hasOwnProperty("linkedRoadId")) {
+      roadService.splitRoad(listenLayer.modifyPoint.linkedRoadId, point.vectorId, "start");
       edgeService.updateEdgeForMovePoint(point.vectorId);
       if (listenLayer.modifyPoint.linkedRoadId == this.splitRoadId) {
         this.splitRoadId = null;
@@ -221,6 +184,28 @@ export default class MoveRoad {
     if (splitPointId) {
       edgeService.updateEdgeForMovePoint(splitPointId);
     }
+
+    //拖拽道路融合后在初始化
+    let roadEdges = dataService.getRoadEdges();
+    for (let key in roadEdges) {
+      for (let roadKey in parent) {
+        let road = dataService.getRoad(roadKey);
+        if (road.vectorId == roadEdges[key].parent) {
+          if (roadEdges[key] && roadEdges[key].roadSide) {
+            roadEdges[key].initRoadSide();
+          }
+        }
+      }
+    }
+    //拖拽道路融合后在初始化
+    let roads = dataService.getRoads();
+    for (let key in roads) {
+      for (let roadKey in parent) {
+        if (roads[key].vectorId == roadKey) {
+          roadService.initRoadWidthTipsPos(roads[key]);
+        }
+      }
+    }
   }
 
   //拖拽墙角/墙面，被其他墙角吸附
@@ -246,10 +231,7 @@ export default class MoveRoad {
     const startPoint = dataService.getRoadPoint(road.startId);
 
     function sortNumber(a, b) {
-      return (
-        mathUtil.getDistance(startPoint, a.join) -
-        mathUtil.getDistance(startPoint, b.join)
-      );
+      return mathUtil.getDistance(startPoint, a.join) - mathUtil.getDistance(startPoint, b.join);
     }
 
     joins = joins.sort(sortNumber.bind(this));
@@ -267,10 +249,7 @@ export default class MoveRoad {
       let splitRoad = dataService.getRoad(this.splitRoadId);
       let splitRoadStartPoint = dataService.getRoadPoint(splitRoad.startId);
       let splitRoadEndPoint = dataService.getRoadPoint(splitRoad.endId);
-      let splitLine = mathUtil.createLine1(
-        splitRoadStartPoint,
-        splitRoadEndPoint
-      );
+      let splitLine = mathUtil.createLine1(splitRoadStartPoint, splitRoadEndPoint);
       let parent = point.getParent();
       for (let key in parent) {
         let road = dataService.getRoad(key);
@@ -278,22 +257,16 @@ export default class MoveRoad {
         let endPoint = dataService.getRoadPoint(road.endId);
         let line = mathUtil.createLine1(startPoint, endPoint);
         let join = mathUtil.getIntersectionPoint(splitLine, line);
-        if (
-          mathUtil.isContainForSegment(join, startPoint, endPoint) &&
-          mathUtil.getDistance(join, splitRoadStartPoint) <
-            Constant.minAdsorbPix
-        ) {
+        if (mathUtil.isContainForSegment(join, startPoint, endPoint) && mathUtil.getDistance(join, splitRoadStartPoint) < Constant.minAdsorbPix) {
           roadService.splitRoad(key, splitRoadStartPoint.vectorId, "start");
           return splitRoadStartPoint.vectorId;
-        } else if (
-          mathUtil.isContainForSegment(join, startPoint, endPoint) &&
-          mathUtil.getDistance(join, splitRoadEndPoint) < Constant.minAdsorbPix
-        ) {
+        } else if (mathUtil.isContainForSegment(join, startPoint, endPoint) && mathUtil.getDistance(join, splitRoadEndPoint) < Constant.minAdsorbPix) {
           roadService.splitRoad(key, splitRoadEndPoint.vectorId, "end");
           return splitRoadEndPoint.vectorId;
         }
       }
     }
+
     return null;
   }
 
@@ -357,16 +330,8 @@ export default class MoveRoad {
       const startPoint2 = dataService.getRoadPoint(road2.startId);
       const endPoint2 = dataService.getRoadPoint(road2.endId);
 
-      const join1 = mathUtil.getIntersectionPoint4(
-        startPoint1,
-        endPoint1,
-        newLine
-      );
-      const join2 = mathUtil.getIntersectionPoint4(
-        startPoint2,
-        endPoint2,
-        newLine
-      );
+      const join1 = mathUtil.getIntersectionPoint4(startPoint1, endPoint1, newLine);
+      const join2 = mathUtil.getIntersectionPoint4(startPoint2, endPoint2, newLine);
 
       // 取角度大的
       if (join1 == null && join2 == null) {
@@ -405,10 +370,7 @@ export default class MoveRoad {
       let join = mathUtil.getIntersectionPoint(startLimitLine, newLine);
       const tempStartPoint = dataService.getRoadPoint(tempRoad.startId);
       const tempEndPoint = dataService.getRoadPoint(tempRoad.endId);
-      if (
-        angle > Constant.maxAngle ||
-        !mathUtil.isPointOnSegment(join, tempStartPoint, tempEndPoint)
-      ) {
+      if (angle > Constant.maxAngle || !mathUtil.isPointOnSegment(join, tempStartPoint, tempEndPoint)) {
         startLimitLine = mathUtil.getVerticalLine(roadLine, startPoint);
         limitInfos.startRoadId = null;
         limitInfos.newStartRoadId = true;
@@ -444,16 +406,8 @@ export default class MoveRoad {
       const startPoint2 = dataService.getRoadPoint(road2.startId);
       const endPoint2 = dataService.getRoadPoint(road2.endId);
 
-      const join1 = mathUtil.getIntersectionPoint4(
-        startPoint1,
-        endPoint1,
-        newLine
-      );
-      const join2 = mathUtil.getIntersectionPoint4(
-        startPoint2,
-        endPoint2,
-        newLine
-      );
+      const join1 = mathUtil.getIntersectionPoint4(startPoint1, endPoint1, newLine);
+      const join2 = mathUtil.getIntersectionPoint4(startPoint2, endPoint2, newLine);
 
       // 取角度大的
       if (join1 == null && join2 == null) {
@@ -492,10 +446,7 @@ export default class MoveRoad {
       const tempStartPoint = dataService.getRoadPoint(tempRoad.start);
       const tempEndPoint = dataService.getRoadPoint(tempRoad.end);
 
-      if (
-        angle > Constant.maxAngle ||
-        !mathUtil.isPointOnSegment(join, tempStartPoint, tempEndPoint)
-      ) {
+      if (angle > Constant.maxAngle || !mathUtil.isPointOnSegment(join, tempStartPoint, tempEndPoint)) {
         endLimitLine = mathUtil.getVerticalLine(roadLine, endPoint);
         limitInfos.endRoadId = null;
         limitInfos.newEndRoadId = true;
@@ -515,13 +466,7 @@ export default class MoveRoad {
     // 开始考虑第一点
     if (flag) {
       // 不仅仅角度，还有相交
-      flag = this.isOKForCross(
-        pointId,
-        position,
-        point.parent,
-        linkedRoadPointId,
-        linkedRoadId
-      );
+      flag = this.isOKForCross(pointId, position, point.parent, linkedRoadPointId, linkedRoadId);
     }
     return flag;
   }
@@ -677,14 +622,7 @@ export default class MoveRoad {
         const otherPointId = _road.getOtherPointId(pointId);
         const otherPoint = dataService.getRoadPoint(otherPointId);
 
-        const flag = this.isOKForCrossTwoRoad(
-          position,
-          otherPoint,
-          key,
-          linkedRoadPointId,
-          linkedRoadId,
-          _road.vectorId
-        );
+        const flag = this.isOKForCrossTwoRoad(position, otherPoint, key, linkedRoadPointId, linkedRoadId, _road.vectorId);
         // 交叉
         if (!flag) {
           this.adsorbPointRoads = {};
@@ -705,28 +643,12 @@ export default class MoveRoad {
   // position1表示拖拽的点的坐标（修复过了的）
   // position2对应墙的另一头坐标
   // roadId表示其余的墙（与position1无关的墙）
-  isOKForCrossTwoRoad(
-    position1,
-    position2,
-    roadId,
-    linkedRoadPointId,
-    linkedRoadId,
-    dragRoadId
-  ) {
+  isOKForCrossTwoRoad(position1, position2, roadId, linkedRoadPointId, linkedRoadId, dragRoadId) {
     const road = dataService.getRoad(roadId);
     const startPoint = dataService.getRoadPoint(road.startId);
     const endPoint = dataService.getRoadPoint(road.endId);
-    const join = mathUtil.getIntersectionPoint3(
-      position1,
-      position2,
-      startPoint,
-      endPoint
-    );
-    if (
-      join &&
-      road.startId != linkedRoadPointId &&
-      road.endId != linkedRoadPointId
-    ) {
+    const join = mathUtil.getIntersectionPoint3(position1, position2, startPoint, endPoint);
+    if (join && road.startId != linkedRoadPointId && road.endId != linkedRoadPointId) {
       // 交叉了
       this.splitRoadId = roadId;
       return true;
@@ -738,20 +660,14 @@ export default class MoveRoad {
       let join1 = mathUtil.getJoinLinePoint(startPoint, line);
       let join2 = mathUtil.getJoinLinePoint(endPoint, line);
 
-      if (
-        mathUtil.getDistance(join1, startPoint) < Constant.minRealDis &&
-        mathUtil.PointInSegment(join1, position1, position2)
-      ) {
+      if (mathUtil.getDistance(join1, startPoint) < Constant.minRealDis && mathUtil.PointInSegment(join1, position1, position2)) {
         if (road.startId != linkedRoadPointId) {
           // 交叉了
           this.adsorbPointRoads[startPoint.vectorId] = dragRoadId;
           //为了找到全部的吸附点，暂时返回true,在外面一层再做判断
           return true;
         }
-      } else if (
-        mathUtil.getDistance(join2, endPoint) < Constant.minRealDis &&
-        mathUtil.PointInSegment(join2, position1, position2)
-      ) {
+      } else if (mathUtil.getDistance(join2, endPoint) < Constant.minRealDis && mathUtil.PointInSegment(join2, position1, position2)) {
         if (road.endId != linkedRoadPointId) {
           // 交叉了
           this.adsorbPointRoads[endPoint.vectorId] = dragRoadId;
@@ -763,28 +679,14 @@ export default class MoveRoad {
       line = mathUtil.createLine1(startPoint, endPoint);
       join1 = mathUtil.getJoinLinePoint(position1, line);
       join2 = mathUtil.getJoinLinePoint(position2, line);
-      if (
-        mathUtil.getDistance(join1, position1) < Constant.minRealDis &&
-        mathUtil.PointInSegment(join1, startPoint, endPoint)
-      ) {
-        if (
-          road.startId != linkedRoadPointId &&
-          road.endId != linkedRoadPointId &&
-          roadId != linkedRoadId
-        ) {
+      if (mathUtil.getDistance(join1, position1) < Constant.minRealDis && mathUtil.PointInSegment(join1, startPoint, endPoint)) {
+        if (road.startId != linkedRoadPointId && road.endId != linkedRoadPointId && roadId != linkedRoadId) {
           // 交叉了
           //return false
           return true;
         }
-      } else if (
-        mathUtil.getDistance(join2, position2) < Constant.minRealDis &&
-        mathUtil.PointInSegment(join2, startPoint, endPoint)
-      ) {
-        if (
-          road.startId != linkedRoadPointId &&
-          road.endId != linkedRoadPointId &&
-          roadId != linkedRoadId
-        ) {
+      } else if (mathUtil.getDistance(join2, position2) < Constant.minRealDis && mathUtil.PointInSegment(join2, startPoint, endPoint)) {
+        if (road.startId != linkedRoadPointId && road.endId != linkedRoadPointId && roadId != linkedRoadId) {
           // 交叉了
           //return false
           return true;
@@ -799,13 +701,7 @@ export default class MoveRoad {
     const road = dataService.getRoad(roadId);
     const startPoint = dataService.getRoadPoint(road.startId);
     const endPoint = dataService.getRoadPoint(road.endId);
-    let flag = mathUtil.crossTwoLines(
-      position1,
-      position2,
-      startPoint,
-      endPoint,
-      0.01
-    );
+    let flag = mathUtil.crossTwoLines(position1, position2, startPoint, endPoint, 0.01);
     if (flag) {
       // 交叉了
       return false;
@@ -826,13 +722,7 @@ export default class MoveRoad {
     const road = dataService.getRoad(roadId);
     const startPoint = dataService.getRoadPoint(road.startId);
     const endPoint = dataService.getRoadPoint(road.endId);
-    const flag = mathUtil.crossTwoLines(
-      position1,
-      position2,
-      startPoint,
-      endPoint,
-      0.01
-    );
+    const flag = mathUtil.crossTwoLines(position1, position2, startPoint, endPoint, 0.01);
     if (flag) {
       // 交叉了
       return false;
@@ -844,26 +734,17 @@ export default class MoveRoad {
       let join1 = mathUtil.getJoinLinePoint(startPoint, line);
       const join2 = mathUtil.getJoinLinePoint(endPoint, line);
 
-      if (
-        mathUtil.getDistance(join1, startPoint) < Constant.minRealDis &&
-        mathUtil.isPointOnSegment(join1, position1, position2)
-      ) {
+      if (mathUtil.getDistance(join1, startPoint) < Constant.minRealDis && mathUtil.isPointOnSegment(join1, position1, position2)) {
         // 交叉了
         return false;
-      } else if (
-        mathUtil.getDistance(join2, endPoint) < Constant.minRealDis &&
-        mathUtil.isPointOnSegment(join2, position1, position2)
-      ) {
+      } else if (mathUtil.getDistance(join2, endPoint) < Constant.minRealDis && mathUtil.isPointOnSegment(join2, position1, position2)) {
         // 交叉了
         return false;
       }
 
       line = mathUtil.createLine1(startPoint, endPoint);
       join1 = mathUtil.getJoinLinePoint(position1, line);
-      if (
-        mathUtil.getDistance(join1, position1) < Constant.minRealDis &&
-        roadService.isContain(road, join1)
-      ) {
+      if (mathUtil.getDistance(join1, position1) < Constant.minRealDis && roadService.isContain(road, join1)) {
         // 交叉了
         return false;
       }
@@ -879,16 +760,10 @@ export default class MoveRoad {
     let line = mathUtil.createLine1(position1, position2);
     let join1 = mathUtil.getJoinLinePoint(startPoint, line);
     let join2 = mathUtil.getJoinLinePoint(endPoint, line);
-    if (
-      mathUtil.getDistance(join1, startPoint) < Constant.minRealDis &&
-      mathUtil.PointInSegment(join1, position1, position2)
-    ) {
+    if (mathUtil.getDistance(join1, startPoint) < Constant.minRealDis && mathUtil.PointInSegment(join1, position1, position2)) {
       // 交叉了
       return false;
-    } else if (
-      mathUtil.getDistance(join2, endPoint) < Constant.minRealDis &&
-      mathUtil.PointInSegment(join2, position1, position2)
-    ) {
+    } else if (mathUtil.getDistance(join2, endPoint) < Constant.minRealDis && mathUtil.PointInSegment(join2, position1, position2)) {
       // 交叉了
       return false;
     }
@@ -897,16 +772,10 @@ export default class MoveRoad {
     join1 = mathUtil.getJoinLinePoint(position1, line);
     join2 = mathUtil.getJoinLinePoint(position2, line);
 
-    if (
-      mathUtil.getDistance(join1, position1) < Constant.minRealDis &&
-      roadService.isContain(road, join1)
-    ) {
+    if (mathUtil.getDistance(join1, position1) < Constant.minRealDis && roadService.isContain(road, join1)) {
       // 交叉了
       return false;
-    } else if (
-      mathUtil.getDistance(join2, position2) < Constant.minRealDis &&
-      roadService.isContain(road, join2)
-    ) {
+    } else if (mathUtil.getDistance(join2, position2) < Constant.minRealDis && roadService.isContain(road, join2)) {
       // 交叉了
       return false;
     }
@@ -926,11 +795,8 @@ export default class MoveRoad {
         otherPoint = dataService.getRoadPoint(otherPointId);
         // 会吸附另一头
         if (
-          mathUtil.getDistance(virtualPosition, otherPoint) <
-            Constant.minRealDis ||
-          (!roadService.isContain(limitRoad, virtualPosition) &&
-            mathUtil.getDistance(virtualPosition, otherPoint) <
-              mathUtil.getDistance(virtualPosition, point))
+          mathUtil.getDistance(virtualPosition, otherPoint) < Constant.minRealDis ||
+          (!roadService.isContain(limitRoad, virtualPosition) && mathUtil.getDistance(virtualPosition, otherPoint) < mathUtil.getDistance(virtualPosition, point))
         ) {
           mathUtil.clonePoint(virtualPosition, otherPoint);
           adsorb = true;
@@ -1025,15 +891,7 @@ export default class MoveRoad {
   // position5和position6表示road的end一边的线段（endPoint——virtualEndPoint）
   // adsorbPointId1对应start那一头的吸附点
   // adsorbPointId2对应end那一头的吸附点
-  isOKForCrossForMoveRoad(
-    position1,
-    position2,
-    roadId,
-    startPointId,
-    endPointId,
-    adsorbPointId1,
-    adsorbPointId2
-  ) {
+  isOKForCrossForMoveRoad(position1, position2, roadId, startPointId, endPointId, adsorbPointId1, adsorbPointId2) {
     const startPoint = dataService.getRoadPoint(startPointId);
     const endPoint = dataService.getRoadPoint(endPointId);
     let flag = true;
@@ -1047,16 +905,10 @@ export default class MoveRoad {
       let flag2 = true;
 
       const _road = dataService.getRoad(key);
-      if (
-        adsorbPointId1 &&
-        (adsorbPointId1 == _road.startId || adsorbPointId1 == _road.endId)
-      ) {
+      if (adsorbPointId1 && (adsorbPointId1 == _road.startId || adsorbPointId1 == _road.endId)) {
         flag1 = false;
       }
-      if (
-        adsorbPointId2 &&
-        (adsorbPointId2 == _road.startId || adsorbPointId2 == _road.endId)
-      ) {
+      if (adsorbPointId2 && (adsorbPointId2 == _road.startId || adsorbPointId2 == _road.endId)) {
         flag2 = false;
       }
 
@@ -1076,11 +928,7 @@ export default class MoveRoad {
       if (!flag) {
         return false;
       }
-      if (
-        flag1 &&
-        _road.startId != startPointId &&
-        _road.endId != startPointId
-      ) {
+      if (flag1 && _road.startId != startPointId && _road.endId != startPointId) {
         flag = this.isOKForCrossTwoRoad3(position1, startPoint, key);
       }
 
@@ -1106,10 +954,7 @@ export default class MoveRoad {
     const road = dataService.getRoad(roadId);
     const startPoint = dataService.getRoadPoint(road.startId);
     const endPoint = dataService.getRoadPoint(road.endId);
-    if (
-      Object.keys(startPoint.getParent()).length == 1 &&
-      Object.keys(endPoint.getParent()).length == 1
-    ) {
+    if (Object.keys(startPoint.getParent()).length == 1 && Object.keys(endPoint.getParent()).length == 1) {
       const p1 = { x: startPoint.x + dx, y: startPoint.y + dy };
       const p2 = { x: endPoint.x + dx, y: endPoint.y + dy };
 
@@ -1262,9 +1107,7 @@ export default class MoveRoad {
         road1.endId = pointId2;
         point2.setPointParent(roadId1, "end");
       } else {
-        console.error(
-          "roadService.moveTo****************************************************"
-        );
+        console.error("roadService.moveTo****************************************************");
       }
     }
 
@@ -1332,27 +1175,16 @@ export default class MoveRoad {
     const line2 = mathUtil.createLine1(rightEdge.start, rightEdge.end);
     let rightJoin = mathUtil.getJoinLinePoint(position, line2);
 
-    if (
-      dir == "left" &&
-      (mathUtil.isContainForSegment(position, join, rightJoin) ||
-        mathUtil.isContainForSegment(rightJoin, join, position))
-    ) {
+    if (dir == "left" && (mathUtil.isContainForSegment(position, join, rightJoin) || mathUtil.isContainForSegment(rightJoin, join, position))) {
       return;
     }
 
-    if (
-      dir == "right" &&
-      (mathUtil.isContainForSegment(position, join, leftJoin) ||
-        mathUtil.isContainForSegment(leftJoin, join, position))
-    ) {
+    if (dir == "right" && (mathUtil.isContainForSegment(position, join, leftJoin) || mathUtil.isContainForSegment(leftJoin, join, position))) {
       return;
     }
 
     const newWidth = mathUtil.getDisForPoinLine(position, line);
-    if (
-      newWidth > Constant.minRoadSideWidth &&
-      newWidth < Constant.maxRoadSideWidth
-    ) {
+    if (newWidth > Constant.minRoadSideWidth && newWidth < Constant.maxRoadSideWidth) {
       roadService.updateForWidth(parent, newWidth, dir);
     }
     // roadService.initRoadWidthTipsPos(road);
@@ -1420,70 +1252,25 @@ export default class MoveRoad {
 
     const leftCurveEdge = dataService.getCurveRoadEdge(curveRoad.leftEdgeId);
     const rightCurveEdge = dataService.getCurveRoadEdge(curveRoad.rightEdgeId);
-    let joinInfo = mathUtil.getHitInfoForCurve(
-      position,
-      curveRoad.curves[index],
-      Math.max(curveRoad.leftWidth, curveRoad.rightWidth)
-    );
-
-    let leftJoinInfo = mathUtil.getHitInfoForCurve(
-      position,
-      leftCurveEdge.curves[index],
-      curveRoad.leftWidth
-    );
-    let leftLine = mathUtil.createLine1(
-      leftJoinInfo.position,
-      joinInfo.position
-    );
+    let joinInfo = mathUtil.getHitInfoForCurve(position, curveRoad.curves[index], Math.max(curveRoad.leftWidth, curveRoad.rightWidth));
+
+    let leftJoinInfo = mathUtil.getHitInfoForCurve(position, leftCurveEdge.curves[index], curveRoad.leftWidth);
+    let leftLine = mathUtil.createLine1(leftJoinInfo.position, joinInfo.position);
     let leftJoin = mathUtil.getJoinLinePoint(position, leftLine);
 
-    let rightJoinInfo = mathUtil.getHitInfoForCurve(
-      position,
-      rightCurveEdge.curves[index],
-      curveRoad.rightWidth
-    );
-    let rightLine = mathUtil.createLine1(
-      rightJoinInfo.position,
-      joinInfo.position
-    );
+    let rightJoinInfo = mathUtil.getHitInfoForCurve(position, rightCurveEdge.curves[index], curveRoad.rightWidth);
+    let rightLine = mathUtil.createLine1(rightJoinInfo.position, joinInfo.position);
     let rightJoin = mathUtil.getJoinLinePoint(position, rightLine);
-    if (
-      dir == "left" &&
-      (mathUtil.isContainForSegment(
-        rightJoin,
-        rightJoinInfo.position,
-        joinInfo.position
-      ) ||
-        mathUtil.isContainForSegment(
-          rightJoinInfo.position,
-          rightJoin,
-          joinInfo.position
-        ))
-    ) {
+    if (dir == "left" && (mathUtil.isContainForSegment(rightJoin, rightJoinInfo.position, joinInfo.position) || mathUtil.isContainForSegment(rightJoinInfo.position, rightJoin, joinInfo.position))) {
       return;
     }
 
-    if (
-      dir == "right" &&
-      (mathUtil.isContainForSegment(
-        leftJoin,
-        leftJoinInfo.position,
-        joinInfo.position
-      ) ||
-        mathUtil.isContainForSegment(
-          leftJoinInfo.position,
-          leftJoin,
-          joinInfo.position
-        ))
-    ) {
+    if (dir == "right" && (mathUtil.isContainForSegment(leftJoin, leftJoinInfo.position, joinInfo.position) || mathUtil.isContainForSegment(leftJoinInfo.position, leftJoin, joinInfo.position))) {
       return;
     }
 
     const newWidth = mathUtil.getDistance(joinInfo.position, position);
-    if (
-      newWidth > Constant.minRoadSideWidth &&
-      newWidth < Constant.maxRoadSideWidth
-    ) {
+    if (newWidth > Constant.minRoadSideWidth && newWidth < Constant.maxRoadSideWidth) {
       curveRoadService.updateForWidth(parent, newWidth, dir);
     }
     if (curveEdge.roadSide) {

src/graphic/Controls/UIControl.js

@@ -35,6 +35,8 @@ import { roadService } from "../Service/RoadService.js";
 import { curveRoadService } from "../Service/CurveRoadService.js";
 import Msg from "../enum/Msg.js";
 import RoadStructure from "../enum/RoadStructure";
+import { drawSetting } from "@/store/drawSetting";
+
 export default class UIControl {
   constructor(layer, newsletter, graphicStateUI) {
     this._prompts = [];
@@ -339,17 +341,20 @@ export default class UIControl {
     } else if (selectUI == VectorEvents.AddBranchRoad) {
     } else if (selectUI == VectorEvents.AddNarrowRoad) {
     } else if (selectUI == VectorEvents.UnLock) {
-      let road = dataService.getRoad(focusItem.vectorId);
-      let leftEdge = dataService.getRoadEdge(road.leftEdgeId);
-      let rightEdge = dataService.getRoadEdge(road.rightEdgeId);
-      // 解锁前需要把路缘线设置为单实线
-      if (leftEdge.roadSide) {
-        leftEdge.setStyle("SingleSolidLine");
-      }
-      if (rightEdge.roadSide) {
-        rightEdge.setStyle("SingleSolidLine");
+      if (Settings.selectSVGType == RoadStructure.ZebraCrossing) {
+        uiService.setSelectSVGType(null);
       }
+      let road = dataService.getRoad(focusItem.vectorId);
       if (road) {
+        let leftEdge = dataService.getRoadEdge(road.leftEdgeId);
+        let rightEdge = dataService.getRoadEdge(road.rightEdgeId);
+        // 解锁前需要把路缘线设置为单实线
+        if (leftEdge.roadSide) {
+          leftEdge.setStyle("SingleSolidLine");
+        }
+        if (rightEdge.roadSide) {
+          rightEdge.setStyle("SingleSolidLine");
+        }
         roadService.convertToLines(focusItem.vectorId);
       } else {
         road = dataService.getCurveRoad(focusItem.vectorId);
@@ -688,6 +693,7 @@ export default class UIControl {
     Constant.defaultSingleLaneWidth = setting.singleRoadWidth;
     uiService.setLineWidth(setting.lineWidth);
     this.layer.renderer.autoRedraw();
+    this.saveSettings(setting);
   }
 
   // 获取默认设置
@@ -701,4 +707,14 @@ export default class UIControl {
       lineWidth: lineWidth,
     };
   }
+
+  saveSettings(setting) {
+    let origin = drawSetting.value;
+    let newData = {
+      defaultSingleLaneWidth: setting.singleRoadWidth,
+      defaultMidDivideWidth: setting.roadQuarantineWidth,
+      lineWidth: setting.lineWidth,
+    };
+    origin = Object.assign(origin, newData);
+  }
 }

src/graphic/Geometry/CurveRoadEdge.js

@@ -52,23 +52,49 @@ export default class CurveRoadEdge extends Geometry {
   }
 
   initCurveRoadSide() {
-    if (this.curveRoadSide.width) {
-      let curveRoad = dataService.getCurveRoad(this.parent);
-      this.curveRoadSide.points = [];
-      this.curveRoadSide.curves = [];
-      for (let i = 0; i < curveRoad.points.length; ++i) {
-        this.curveRoadSide.points[i] = mathUtil.getLineEndPointPos(
-          curveRoad.points[i],
-          this.points[i],
-          this.curveRoadSide.width
-        );
+    if (!this.curveRoadSide) {
+      this.curveRoadSide = {};
+      this.curveRoadSide["width"] = Constant.roadSideWidth;
+    }
+
+    let startPoint = this.start;
+    let curveRoad = dataService.getCurveRoad(this.parent);
+
+    let endPoint = this.end;
+
+    let curveRoadSidePoints = mathUtil.RectangleVertex(startPoint, endPoint, (this.curveRoadSide.width * 100 * window.devicePixelRatio) / 5);
+    for (let key in curveRoad) {
+      if (this.vectorId == curveRoad[key]) {
+        if (key == "rightEdgeId") {
+          this.curveRoadSide["start"] = curveRoadSidePoints.rightEdgeStart;
+          this.curveRoadSide["end"] = curveRoadSidePoints.rightEdgeEnd;
+        } else if (key == "leftEdgeId") {
+          this.curveRoadSide["start"] = curveRoadSidePoints.leftEdgeStart;
+          this.curveRoadSide["end"] = curveRoadSidePoints.leftEdgeEnd;
+        }
       }
-      this.curveRoadSide.curves = mathUtil.getCurvesByPoints(
-        this.curveRoadSide.points
-      );
     }
-  }
 
+    // if (this.curveRoadSide.width) {
+    //   let curveRoad = dataService.getCurveRoad(this.parent);
+    //   this.curveRoadSide.points = [];
+    //   this.curveRoadSide.curves = [];
+    //   for (let i = 0; i < curveRoad.points.length; ++i) {
+    //     this.curveRoadSide.points[i] = mathUtil.getLineEndPointPos(
+    //       curveRoad.points[i],
+    //       this.points[i],
+    //       this.curveRoadSide.width
+    //     );
+    //   }
+    //   this.curveRoadSide.curves = mathUtil.getCurvesByPoints(
+    //     this.curveRoadSide.points
+    //   );
+    // }
+  }
+  setRoadSideWidth(width) {
+    this.curveRoadSide.width = width;
+    this.initCurveRoadSide();
+  }
   removeCurveRoadSide() {
     this.curveRoadSide = null;
   }

src/graphic/Geometry/RoadEdge.js

@@ -6,6 +6,7 @@ import VectorStyle from "../enum/VectorStyle.js";
 import { mathUtil } from "../Util/MathUtil.js";
 import { dataService } from "../Service/DataService.js";
 import Constant from "../Constant";
+import { coordinate } from "../Coordinate";
 export default class RoadEdge extends Geometry {
   constructor(start, end, vectorId, parentId) {
     super();
@@ -65,7 +66,6 @@ export default class RoadEdge extends Geometry {
     // let lines = mathUtil.getParallelLineForDistance(line, Constant.roadSideWidth);
     // let joinPoint = lines.line1;
 
-
     // for (let key in road) {
     //   if (this.vectorId == road[key]) {
     //     if (key == 'rightEdgeId') {
@@ -84,8 +84,9 @@ export default class RoadEdge extends Geometry {
       this.roadSide = {};
       this.roadSide["width"] = Constant.roadSideWidth;
     }
-  
-    let roadSidePoints = mathUtil.RectangleVertex(startPoint, endPoint, this.roadSide.width * 2);
+
+    // let roadSidePoints = mathUtil.RectangleVertex(startPoint, endPoint, (this.roadSide.width * 100 * window.devicePixelRatio) / 5);
+    let roadSidePoints = mathUtil.RectangleVertex(startPoint, endPoint, (this.roadSide.width * 2 * coordinate.ratio) / coordinate.res);
     for (let key in road) {
       if (this.vectorId == road[key]) {
         if (key == "rightEdgeId") {
@@ -97,12 +98,13 @@ export default class RoadEdge extends Geometry {
         }
       }
     }
+    this.setStyle(VectorStyle.RoadSide);
     // this.roadSide['start'] = point1;
     // this.roadSide['end'] = point2;
   }
   setRoadSideWidth(width) {
     this.roadSide.width = width;
-    this.initRoadSide()
+    this.initRoadSide();
   }
   setRoadSide(roadSide) {
     this.roadSide = JSON.parse(JSON.stringify(roadSide));

src/graphic/Renderer/Draw.js

@@ -161,6 +161,9 @@ export const help = {
       (mathUtil.getDistance(p1, p2) * coordinate.res * 1000) / coordinate.ratio
     );
   },
+  getScreenDistance(dis) {
+    return (dis * coordinate.ratio) / (coordinate.res * 1000);
+  },
   getPerpendicularPoint(p1, p2, p3, d) {
     if (p1.x === p2.x) {
       return { x: p3.x + d, y: p3.y };
@@ -206,8 +209,8 @@ export const help = {
 
     ctx.font = `${fontSize}px Microsoft YaHei`;
     const textCenter = help.getTextCenter(ctx, text);
-    ctx.fillStyle = style.backColor;
     if (!isScreenStyle()) {
+      // ctx.fillStyle = style.backColor;
       // const padding = style.padding;
       // help.roundRect(
       //   ctx,
@@ -219,8 +222,16 @@ export const help = {
       // );
       // ctx.fill();
     }
-    ctx.fillStyle = style.fillColor;
-    ctx.fillText(text, -textCenter.x, -textCenter.y);
+    ctx.lineWidth = 8;
+    if (!style.fillStyle) {
+      ctx.strokeStyle = "#fff";
+      ctx.strokeText(text, -textCenter.x, -textCenter.y);
+      ctx.fillStyle = "#000";
+      ctx.fillText(text, -textCenter.x, -textCenter.y);
+    } else {
+      ctx.fillStyle = style.fillColor;
+      ctx.fillText(text, -textCenter.x, -textCenter.y);
+    }
     ctx.restore();
   },
   isTriangleClockwise(p1, p2, p3) {
@@ -413,6 +424,14 @@ export const help = {
         ctx.fill();
         ctx.stroke();
         ctx.restore();
+        // line.forEach((point) => {
+        //   ctx.beginPath();
+        //   ctx.fillStyle = "#000";
+        //   ctx.arc(point.x, point.y, 10, 0, 2 * Math.PI);
+        //   ctx.fill();
+        //   ctx.closePath();
+        //   console.log(point);
+        // });
 
         const width = mathUtil.getDistance(line[0], line[3]);
         const c1 = mathUtil.translate(line[0], line[3], line[0], width / 2);
@@ -601,10 +620,8 @@ export default class Draw {
       const [style] = help.setVectorStyle(this.context, vector, ["NormalLine"]);
       help.drawStyleLine(this.context, [start, end]);
       help.drawLineText(this.context, start, end, width, {
-        fillColor: isScreenStyle() ? "#000" : "#fff",
         padding: 6,
         fontSize: 12,
-        backColor: style.strokeStyle,
       });
       this.drawLineArrow([start, end], true);
     });
@@ -660,7 +677,7 @@ export default class Draw {
           );
         }
 
-        console.log(edgeVector, vector);
+        // console.log(edgeVector, vector);
         // edgeVector.style = VectorStyle.SingleSolidLine;
         help.drawStyleLine(
           ctx,
@@ -675,10 +692,16 @@ export default class Draw {
             vector.roadWidthTipsPos[0].start,
             vector.roadWidthTipsPos[0].end,
           ];
+
+          const join = mathUtil.getIntersectionPoint(
+            mathUtil.createLine1(checkLine[0], checkLine[1]),
+            mathUtil.createLine1(targetLine[0], targetLine[1])
+          );
           const isStartMax =
             mathUtil.getDisForLineCoord(checkLine, targetLine[0]) >
             mathUtil.getDisForLineCoord(checkLine, targetLine[1]);
 
+          // this.drawPoint(join);
           if (!isStartMax) {
             const temp = targetLine[0];
             targetLine[0] = targetLine[1];
@@ -688,26 +711,26 @@ export default class Draw {
           const tstart = mathUtil.translate(
             targetLine[0],
             targetLine[1],
-            targetLine[1],
-            edgeVector.roadSide.width
+            join,
+            help.getScreenDistance(edgeVector.roadSide.width * 1000)
           );
           const tend = mathUtil.translate(
             targetLine[0],
             targetLine[1],
-            targetLine[1],
-            edgeVector.roadSide.width + 24
+            join,
+            help.getScreenDistance(edgeVector.roadSide.width * 1000) + 4
           );
 
+          // this.drawPoint(tstart);
+          // this.drawPoint(tend);
           help.drawLineText(
             ctx,
             coordinate.getScreenXY(tstart),
             coordinate.getScreenXY(tend),
-            edgeVector.roadSide.width * 10,
+            Math.round(edgeVector.roadSide.width * 1000),
             {
-              fillColor: isScreenStyle() ? "#000" : "#fff",
               padding: 6,
               fontSize: 12,
-              backColor: style.strokeStyle,
             }
           );
         }
@@ -1194,6 +1217,7 @@ export default class Draw {
         return;
       }
 
+      // console.log(line);
       if (line.category !== "ZebraCrossing") {
         const [stylea, attr] = help.getVectorStyle(line, line.category);
         style = {
@@ -1215,6 +1239,10 @@ export default class Draw {
           strokeStyle: line.color,
         };
       }
+
+      if (line && ["MeasureLine", "FreeMeasureLine"].includes(line.category)) {
+        return;
+      }
     } else if (vector.category === VectorCategory.Point.FixPoint) {
       const text = dataService.getText(vector?.linkedTextId);
       if (text) {
@@ -1591,16 +1619,17 @@ export default class Draw {
       case VectorCategory.Line.FreeMeasureLine:
       case VectorCategory.Line.MeasureLine:
       case VectorCategory.Line.PositionLine:
-        console.log(vector);
         this.drawLineText(vector, style.text);
 
         if (
           [
+            VectorCategory.Line.FreeMeasureLine,
+            VectorCategory.Line.MeasureLine,
             VectorCategory.Line.LocationLineByFixPoint,
             VectorCategory.Line.LocationLineByBasePoint,
           ].includes(vector.category)
         ) {
-          this.drawLineArrow([start, end], true, 10);
+          this.drawLineArrow([start, end], true, 20);
         }
         break;
     }

src/graphic/Service/RoadService.js

@@ -26,31 +26,13 @@ export default class RoadService {
 
     let edgePoints;
     if (road.way == Constant.oneWay) {
-      edgePoints = mathUtil.RectangleVertex(
-        startPoint,
-        endPoint,
-        road.singleRoadWidth
-      );
+      edgePoints = mathUtil.RectangleVertex(startPoint, endPoint, road.singleRoadWidth);
     } else {
-      edgePoints = mathUtil.RectangleVertex(
-        startPoint,
-        endPoint,
-        road.leftWidth + road.rightWidth + road.midDivide.midDivideWidth
-      );
+      edgePoints = mathUtil.RectangleVertex(startPoint, endPoint, road.leftWidth + road.rightWidth + road.midDivide.midDivideWidth);
     }
-    let leftEdge = edgeService.create(
-      edgePoints.leftEdgeStart,
-      edgePoints.leftEdgeEnd,
-      null,
-      vectorId
-    );
-
-    let rightEdge = edgeService.create(
-      edgePoints.rightEdgeStart,
-      edgePoints.rightEdgeEnd,
-      null,
-      vectorId
-    );
+    let leftEdge = edgeService.create(edgePoints.leftEdgeStart, edgePoints.leftEdgeEnd, null, vectorId);
+
+    let rightEdge = edgeService.create(edgePoints.rightEdgeStart, edgePoints.rightEdgeEnd, null, vectorId);
 
     road.setLeftEdge(leftEdge.vectorId);
     road.setRightEdge(rightEdge.vectorId);
@@ -100,31 +82,13 @@ export default class RoadService {
 
     let edgePoints;
     if (newRoad.way == Constant.oneWay) {
-      edgePoints = mathUtil.RectangleVertex(
-        newStartPoint,
-        newEndPoint,
-        road.singleRoadWidth
-      );
+      edgePoints = mathUtil.RectangleVertex(newStartPoint, newEndPoint, road.singleRoadWidth);
     } else {
-      edgePoints = mathUtil.RectangleVertex(
-        newStartPoint,
-        newEndPoint,
-        road.leftWidth + road.rightWidth + road.midDivide.midDivideWidth
-      );
+      edgePoints = mathUtil.RectangleVertex(newStartPoint, newEndPoint, road.leftWidth + road.rightWidth + road.midDivide.midDivideWidth);
     }
-    let leftEdge = edgeService.create(
-      edgePoints.leftEdgeStart,
-      edgePoints.leftEdgeEnd,
-      null,
-      vectorId
-    );
-
-    let rightEdge = edgeService.create(
-      edgePoints.rightEdgeStart,
-      edgePoints.rightEdgeEnd,
-      null,
-      vectorId
-    );
+    let leftEdge = edgeService.create(edgePoints.leftEdgeStart, edgePoints.leftEdgeEnd, null, vectorId);
+
+    let rightEdge = edgeService.create(edgePoints.rightEdgeStart, edgePoints.rightEdgeEnd, null, vectorId);
 
     newRoad.setLeftEdge(leftEdge.vectorId);
     newRoad.setRightEdge(rightEdge.vectorId);
@@ -156,10 +120,11 @@ export default class RoadService {
     }
     if (oldRightEdge.roadSide) {
       rightEdge.initRoadSide();
-      rightEdge.setRoadSideWidth(oldLeftEdge.roadSide.width);
+      rightEdge.setRoadSideWidth(oldRightEdge.roadSide.width);
     }
     this.setLanes(newRoad.vectorId);
     this.initRoadWidthTipsPos(newRoad);
+
     return newRoad.vectorId;
   }
 
@@ -177,10 +142,7 @@ export default class RoadService {
     const startPoint = dataService.getRoadPoint(road.startId);
     const endPoint = dataService.getRoadPoint(road.endId);
     const point = dataService.getRoadPoint(pointId);
-    if (
-      mathUtil.getDistance(startPoint, point) < Constant.minAdsorbPix ||
-      mathUtil.getDistance(endPoint, point) < Constant.minAdsorbPix
-    ) {
+    if (mathUtil.getDistance(startPoint, point) < Constant.minAdsorbPix || mathUtil.getDistance(endPoint, point) < Constant.minAdsorbPix) {
     }
 
     let leftEdge = dataService.getRoadEdge(road.leftEdgeId);
@@ -241,26 +203,22 @@ export default class RoadService {
       crossPointService.replaceEdgeId(cpt, road.leftEdgeId, newRoad.leftEdgeId);
 
       cpt = dataService.getCrossPointForEdgeId(road.rightEdgeId, "end");
-      crossPointService.replaceEdgeId(
-        cpt,
-        road.rightEdgeId,
-        newRoad.rightEdgeId
-      );
+      crossPointService.replaceEdgeId(cpt, road.rightEdgeId, newRoad.rightEdgeId);
 
       let newRoadLeftEdge = dataService.getRoadEdge(newRoad.leftEdgeId);
       mathUtil.clonePoint(newRoadLeftEdge.end, oldLeftEdgeEndPoint);
       //newRoadLeftEdge.roadSide = leftEdge.roadSide;
-      if(leftEdge.roadSide){
-        newRoadLeftEdge.initRoadSide()
-        newRoadLeftEdge.setRoadSideWidth(leftEdge.roadSide.width)
+      if (leftEdge.roadSide) {
+        newRoadLeftEdge.initRoadSide();
+        newRoadLeftEdge.setRoadSideWidth(leftEdge.roadSide.width);
       }
 
       let newRoadRightEdge = dataService.getRoadEdge(newRoad.rightEdgeId);
       mathUtil.clonePoint(newRoadRightEdge.end, oldRightEdgeEndPoint);
       //newRoadRightEdge.roadSide = rightEdge.roadSide;
-      if(rightEdge.roadSide){
-        newRoadRightEdge.initRoadSide()
-        newRoadRightEdge.setRoadSideWidth(rightEdge.roadSide.width)
+      if (rightEdge.roadSide) {
+        newRoadRightEdge.initRoadSide();
+        newRoadRightEdge.setRoadSideWidth(rightEdge.roadSide.width);
       }
 
       if (Object.keys(startPoint).length > 1) {
@@ -268,40 +226,35 @@ export default class RoadService {
         mathUtil.clonePoint(rightEdge.start, oldRightEdgeStartPoint);
       }
       //修改路缘线end
-      if(leftEdge.roadSide){
-        leftEdge.initRoadSide()
-        leftEdge.setRoadSideWidth(leftEdge.roadSide.width)
+      if (leftEdge.roadSide) {
+        leftEdge.initRoadSide();
+        leftEdge.setRoadSideWidth(leftEdge.roadSide.width);
       }
-      if(rightEdge.roadSide){
-        leftEdge.initRoadSide()
-        rightEdge.setRoadSideWidth(rightEdge.roadSide.width)
+      if (rightEdge.roadSide) {
+        leftEdge.initRoadSide();
+        rightEdge.setRoadSideWidth(rightEdge.roadSide.width);
       }
-
     } else if (dir == "end") {
       let cpt = dataService.getCrossPointForEdgeId(road.leftEdgeId, "start");
       crossPointService.replaceEdgeId(cpt, road.leftEdgeId, newRoad.leftEdgeId);
 
       cpt = dataService.getCrossPointForEdgeId(road.rightEdgeId, "start");
-      crossPointService.replaceEdgeId(
-        cpt,
-        road.rightEdgeId,
-        newRoad.rightEdgeId
-      );
+      crossPointService.replaceEdgeId(cpt, road.rightEdgeId, newRoad.rightEdgeId);
 
       let newRoadLeftEdge = dataService.getRoadEdge(newRoad.leftEdgeId);
       mathUtil.clonePoint(newRoadLeftEdge.start, oldLeftEdgeStartPoint);
       //newRoadLeftEdge.roadSide = leftEdge.roadSide;
-      if(leftEdge.roadSide){
-        newRoadLeftEdge.initRoadSide()
-        newRoadLeftEdge.setRoadSideWidth(leftEdge.roadSide.width)
+      if (leftEdge.roadSide) {
+        newRoadLeftEdge.initRoadSide();
+        newRoadLeftEdge.setRoadSideWidth(leftEdge.roadSide.width);
       }
 
       let newRoadRightEdge = dataService.getRoadEdge(newRoad.rightEdgeId);
       mathUtil.clonePoint(newRoadRightEdge.start, oldRightEdgeStartPoint);
       //newRoadRightEdge.roadSide = rightEdge.roadSide;
-      if(rightEdge.roadSide){
-        newRoadRightEdge.initRoadSide()
-        newRoadRightEdge.setRoadSideWidth(rightEdge.roadSide.width)
+      if (rightEdge.roadSide) {
+        newRoadRightEdge.initRoadSide();
+        newRoadRightEdge.setRoadSideWidth(rightEdge.roadSide.width);
       }
 
       if (Object.keys(endPoint).length > 1) {
@@ -309,13 +262,13 @@ export default class RoadService {
         mathUtil.clonePoint(rightEdge.end, oldRightEdgeEndPoint);
       }
       //修改路缘线start
-      if(leftEdge.roadSide){
-        leftEdge.initRoadSide()
-        leftEdge.setRoadSideWidth(leftEdge.roadSide.width)
+      if (leftEdge.roadSide) {
+        leftEdge.initRoadSide();
+        leftEdge.setRoadSideWidth(leftEdge.roadSide.width);
       }
-      if(rightEdge.roadSide){
-        rightEdge.initRoadSide()
-        rightEdge.setRoadSideWidth(rightEdge.roadSide.width)
+      if (rightEdge.roadSide) {
+        rightEdge.initRoadSide();
+        rightEdge.setRoadSideWidth(rightEdge.roadSide.width);
       }
     }
     // let newStartPoint = dataService.getRoadPoint(newRoad.startId);
@@ -333,6 +286,10 @@ export default class RoadService {
     //   let road = dataService.getRoad(key);
     //   this.initRoadWidthTipsPos(road);
     // }
+
+  
+    // console.error(newRoad)
+
     return newRoad.vectorId;
   }
 
@@ -382,12 +339,7 @@ export default class RoadService {
     const road1 = dataService.getRoad(id1);
     const road2 = dataService.getRoad(id2);
 
-    if (
-      road1 == null ||
-      road2 == null ||
-      typeof road1 === "undefined" ||
-      typeof road2 === "undefined"
-    ) {
+    if (road1 == null || road2 == null || typeof road1 === "undefined" || typeof road2 === "undefined") {
       return null;
     }
 
@@ -438,12 +390,7 @@ export default class RoadService {
     const road1 = dataService.getRoad(id1);
     const road2 = dataService.getRoad(id2);
 
-    if (
-      road1 == null ||
-      road2 == null ||
-      typeof road1 === "undefined" ||
-      typeof road2 === "undefined"
-    ) {
+    if (road1 == null || road2 == null || typeof road1 === "undefined" || typeof road2 === "undefined") {
       return null;
     }
 
@@ -498,12 +445,7 @@ export default class RoadService {
     const road1 = dataService.getRoad(id1);
     const road2 = dataService.getRoad(id2);
 
-    if (
-      road1 == null ||
-      road2 == null ||
-      typeof road1 === "undefined" ||
-      typeof road2 === "undefined"
-    ) {
+    if (road1 == null || road2 == null || typeof road1 === "undefined" || typeof road2 === "undefined") {
       return null;
     }
 
@@ -542,9 +484,7 @@ export default class RoadService {
       _start1.y = start1.y + end2.y - end1.y;
       return mathUtil.Angle(end2, _start1, start2);
     } else {
-      console.error(
-        "RoadService.AngleForRoad3************************************1"
-      );
+      console.error("RoadService.AngleForRoad3************************************1");
       return null;
     }
   }
@@ -622,9 +562,7 @@ export default class RoadService {
 
       return result;
     } else {
-      console.error(
-        "roadIdForMinAngle*********************************************************"
-      );
+      console.error("roadIdForMinAngle*********************************************************");
       return null;
     }
   }
@@ -633,12 +571,7 @@ export default class RoadService {
     let road1 = dataService.getRoad(roadId1);
     let road2 = dataService.getRoad(roadId2);
 
-    if (
-      road1.startId == road2.startId ||
-      road1.startId == road2.endId ||
-      road1.endId == road2.startId ||
-      road1.endId == road2.endId
-    ) {
+    if (road1.startId == road2.startId || road1.startId == road2.endId || road1.endId == road2.startId || road1.endId == road2.endId) {
       return true;
     } else {
       return false;
@@ -660,9 +593,7 @@ export default class RoadService {
     } else if (road.endId == pointId) {
       return "end";
     } else {
-      console.error(
-        "RoadService.getDirction*******************************************************************************************"
-      );
+      console.error("RoadService.getDirction*******************************************************************************************");
       return null;
     }
   }
@@ -676,10 +607,7 @@ export default class RoadService {
       return;
     } else if (Object.keys(parent).length > 2) {
       const info = this.roadIdForMinAngle(pointId, roadId);
-      edgeService.updateSingleEdgeForTwoRoad(
-        info.min0.roadId,
-        info.min1.roadId
-      );
+      edgeService.updateSingleEdgeForTwoRoad(info.min0.roadId, info.min1.roadId);
     }
 
     // 第一步先断开链接
@@ -716,10 +644,7 @@ export default class RoadService {
 
   setRoadInfo(vectorInfo) {
     const road = dataService.getRoad(vectorInfo.roadId);
-    if (
-      vectorInfo.hasOwnProperty("edgeId") &&
-      vectorInfo.hasOwnProperty("dir")
-    ) {
+    if (vectorInfo.hasOwnProperty("edgeId") && vectorInfo.hasOwnProperty("dir")) {
       if (vectorInfo.dir == "left") {
         road.leftEdgeId = vectorInfo.edgeId;
       } else if (vectorInfo.dir == "right") {
@@ -727,10 +652,7 @@ export default class RoadService {
       }
     }
 
-    if (
-      vectorInfo.hasOwnProperty("pointId") &&
-      vectorInfo.hasOwnProperty("dir")
-    ) {
+    if (vectorInfo.hasOwnProperty("pointId") && vectorInfo.hasOwnProperty("dir")) {
       if (vectorInfo.dir == "start") {
         road.startId = vectorInfo.pointId;
       } else if (vectorInfo.dir == "end") {
@@ -743,12 +665,7 @@ export default class RoadService {
     let road1 = dataService.getRoad(id1);
     let road2 = dataService.getRoad(id2);
 
-    if (
-      road1 == null ||
-      road2 == null ||
-      typeof road1 == "undefined" ||
-      typeof road2 == "undefined"
-    ) {
+    if (road1 == null || road2 == null || typeof road1 == "undefined" || typeof road2 == "undefined") {
       return null;
     }
 
@@ -871,9 +788,7 @@ export default class RoadService {
 
       return result;
     } else {
-      console.error(
-        "roadIdForMinAngle*********************************************************"
-      );
+      console.error("roadIdForMinAngle*********************************************************");
       return null;
     }
   }
@@ -885,9 +800,7 @@ export default class RoadService {
     } else if (road.endId == pointId) {
       return "end";
     } else {
-      console.error(
-        "getDirction*******************************************************************************************"
-      );
+      console.error("getDirction*******************************************************************************************");
       return null;
     }
   }
@@ -965,9 +878,7 @@ export default class RoadService {
 
       return result;
     } else {
-      console.error(
-        "roadIdForMinAngle*********************************************************"
-      );
+      console.error("roadIdForMinAngle*********************************************************");
       return null;
     }
   }
@@ -1045,40 +956,25 @@ export default class RoadService {
       if (road.way == Constant.twoWay) {
         //更新车道的起点和终点，因为车道的起点和终点的位置与中间隔离栏一致
         for (let i = 0; i < road.leftLanes.length; ++i) {
-          line = mathUtil.createLine1(
-            road.leftLanes[i].start,
-            road.leftLanes[i].end
-          );
+          line = mathUtil.createLine1(road.leftLanes[i].start, road.leftLanes[i].end);
           join = mathUtil.getJoinLinePoint(laneStart, line);
           mathUtil.clonePoint(road.leftLanes[i].start, join);
         }
         for (let i = 0; i < road.rightLanes.length; ++i) {
-          line = mathUtil.createLine1(
-            road.rightLanes[i].start,
-            road.rightLanes[i].end
-          );
+          line = mathUtil.createLine1(road.rightLanes[i].start, road.rightLanes[i].end);
           join = mathUtil.getJoinLinePoint(laneStart, line);
           mathUtil.clonePoint(road.rightLanes[i].start, join);
         }
-        line = mathUtil.createLine1(
-          road.midDivide.leftMidDivide.start,
-          road.midDivide.leftMidDivide.end
-        );
+        line = mathUtil.createLine1(road.midDivide.leftMidDivide.start, road.midDivide.leftMidDivide.end);
         join = mathUtil.getJoinLinePoint(laneStart, line);
         mathUtil.clonePoint(road.midDivide.leftMidDivide.start, join);
 
-        line = mathUtil.createLine1(
-          road.midDivide.rightMidDivide.start,
-          road.midDivide.rightMidDivide.end
-        );
+        line = mathUtil.createLine1(road.midDivide.rightMidDivide.start, road.midDivide.rightMidDivide.end);
         join = mathUtil.getJoinLinePoint(laneStart, line);
         mathUtil.clonePoint(road.midDivide.rightMidDivide.start, join);
       } else if (road.way == Constant.oneWay) {
         for (let i = 0; i < road.singleLanes.length; ++i) {
-          const line = mathUtil.createLine1(
-            road.singleLanes[i].start,
-            road.singleLanes[i].end
-          );
+          const line = mathUtil.createLine1(road.singleLanes[i].start, road.singleLanes[i].end);
           const join = mathUtil.getJoinLinePoint(laneStart, line);
           mathUtil.clonePoint(road.singleLanes[i].start, join);
         }
@@ -1105,40 +1001,25 @@ export default class RoadService {
       if (road.way == Constant.twoWay) {
         //更新车道的起点和终点，因为车道的起点和终点的位置与中间隔离栏一致
         for (let i = 0; i < road.leftLanes.length; ++i) {
-          line = mathUtil.createLine1(
-            road.leftLanes[i].start,
-            road.leftLanes[i].end
-          );
+          line = mathUtil.createLine1(road.leftLanes[i].start, road.leftLanes[i].end);
           join = mathUtil.getJoinLinePoint(laneEnd, line);
           mathUtil.clonePoint(road.leftLanes[i].end, join);
         }
         for (let i = 0; i < road.rightLanes.length; ++i) {
-          line = mathUtil.createLine1(
-            road.rightLanes[i].start,
-            road.rightLanes[i].end
-          );
+          line = mathUtil.createLine1(road.rightLanes[i].start, road.rightLanes[i].end);
           join = mathUtil.getJoinLinePoint(laneEnd, line);
           mathUtil.clonePoint(road.rightLanes[i].end, join);
         }
-        line = mathUtil.createLine1(
-          road.midDivide.leftMidDivide.start,
-          road.midDivide.leftMidDivide.end
-        );
+        line = mathUtil.createLine1(road.midDivide.leftMidDivide.start, road.midDivide.leftMidDivide.end);
         join = mathUtil.getJoinLinePoint(laneEnd, line);
         mathUtil.clonePoint(road.midDivide.leftMidDivide.end, join);
 
-        line = mathUtil.createLine1(
-          road.midDivide.rightMidDivide.start,
-          road.midDivide.rightMidDivide.end
-        );
+        line = mathUtil.createLine1(road.midDivide.rightMidDivide.start, road.midDivide.rightMidDivide.end);
         join = mathUtil.getJoinLinePoint(laneEnd, line);
         mathUtil.clonePoint(road.midDivide.rightMidDivide.end, join);
       } else if (road.way == Constant.oneWay) {
         for (let i = 0; i < road.singleLanes.length; ++i) {
-          const line = mathUtil.createLine1(
-            road.singleLanes[i].start,
-            road.singleLanes[i].end
-          );
+          const line = mathUtil.createLine1(road.singleLanes[i].start, road.singleLanes[i].end);
           const join = mathUtil.getJoinLinePoint(laneEnd, line);
           mathUtil.clonePoint(road.singleLanes[i].end, join);
         }
@@ -1209,10 +1090,8 @@ export default class RoadService {
 
     const leftCount = road.leftDrivewayCount;
     const rightCount = road.rightDrivewayCount;
-    const leftRatio =
-      road.leftWidth / (road.leftWidth + road.midDivide.midDivideWidth / 2);
-    const rightRatio =
-      road.rightWidth / (road.rightWidth + road.midDivide.midDivideWidth / 2);
+    const leftRatio = road.leftWidth / (road.leftWidth + road.midDivide.midDivideWidth / 2);
+    const rightRatio = road.rightWidth / (road.rightWidth + road.midDivide.midDivideWidth / 2);
 
     let leftdx1 = ((leftEdge.start.x - startPoint.x) * leftRatio) / leftCount;
     let leftdy1 = ((leftEdge.start.y - startPoint.y) * leftRatio) / leftCount;
@@ -1220,10 +1099,8 @@ export default class RoadService {
     let leftdx2 = ((leftEdge.end.x - endPoint.x) * leftRatio) / leftCount;
     let leftdy2 = ((leftEdge.end.y - endPoint.y) * leftRatio) / leftCount;
 
-    let rightdx1 =
-      ((rightEdge.start.x - startPoint.x) * rightRatio) / rightCount;
-    let rightdy1 =
-      ((rightEdge.start.y - startPoint.y) * rightRatio) / rightCount;
+    let rightdx1 = ((rightEdge.start.x - startPoint.x) * rightRatio) / rightCount;
+    let rightdy1 = ((rightEdge.start.y - startPoint.y) * rightRatio) / rightCount;
 
     let rightdx2 = ((rightEdge.end.x - endPoint.x) * rightRatio) / rightCount;
     let rightdy2 = ((rightEdge.end.y - endPoint.y) * rightRatio) / rightCount;
@@ -1284,10 +1161,8 @@ export default class RoadService {
 
         if (dir2 == "start" || !dir2) {
           road.rightLanes[i].start = {};
-          road.rightLanes[i].start.x =
-            startPoint.x + middx1 + rightdx1 * (i + 1);
-          road.rightLanes[i].start.y =
-            startPoint.y + middy1 + rightdy1 * (i + 1);
+          road.rightLanes[i].start.x = startPoint.x + middx1 + rightdx1 * (i + 1);
+          road.rightLanes[i].start.y = startPoint.y + middy1 + rightdy1 * (i + 1);
 
           road.midDivide.rightMidDivide.start = {};
           road.midDivide.rightMidDivide.start.x = startPoint.x + middx1;
@@ -1347,19 +1222,7 @@ export default class RoadService {
   //需要考虑车道个数是0(左或者右)的情况
   //单向车道不考虑dir，即：均匀的增加或者删除车道
   updateForAddSubtractLanesCount(roadId, newCount, dir) {
-    let dx1,
-      dy1,
-      dx2,
-      dy2,
-      oldCount,
-      edgeStartPosition,
-      edgeEndPosition,
-      leftRatio,
-      rightRatio,
-      middx1,
-      middy1,
-      middx2,
-      middy2;
+    let dx1, dy1, dx2, dy2, oldCount, edgeStartPosition, edgeEndPosition, leftRatio, rightRatio, middx1, middy1, middx2, middy2;
     let road = dataService.getRoad(roadId);
 
     if (newCount < 1) {
@@ -1372,10 +1235,8 @@ export default class RoadService {
     let rightEdge = dataService.getRoadEdge(road.rightEdgeId);
 
     if (road.way == Constant.twoWay) {
-      leftRatio =
-        road.leftWidth / (road.leftWidth + road.midDivide.midDivideWidth / 2);
-      rightRatio =
-        road.rightWidth / (road.rightWidth + road.midDivide.midDivideWidth / 2);
+      leftRatio = road.leftWidth / (road.leftWidth + road.midDivide.midDivideWidth / 2);
+      rightRatio = road.rightWidth / (road.rightWidth + road.midDivide.midDivideWidth / 2);
       if (dir == "left") {
         oldCount = road.leftDrivewayCount;
         if (oldCount != 0) {
@@ -1441,18 +1302,10 @@ export default class RoadService {
       let line = this.getMidLine(road);
       if (dir == "left") {
         let join = mathUtil.getJoinLinePoint(leftEdge.start, line);
-        road.setWidth(
-          mathUtil.getDistance(leftEdge.start, join) -
-            road.midDivide.midDivideWidth / 2,
-          dir
-        );
+        road.setWidth(mathUtil.getDistance(leftEdge.start, join) - road.midDivide.midDivideWidth / 2, dir);
       } else if (dir == "right") {
         let join = mathUtil.getJoinLinePoint(rightEdge.start, line);
-        road.setWidth(
-          mathUtil.getDistance(rightEdge.start, join) -
-            road.midDivide.midDivideWidth / 2,
-          dir
-        );
+        road.setWidth(mathUtil.getDistance(rightEdge.start, join) - road.midDivide.midDivideWidth / 2, dir);
       }
     } else if (road.way == Constant.oneWay) {
       oldCount = road.singleRoadDrivewayCount;
@@ -1518,50 +1371,26 @@ export default class RoadService {
       road.setWidth(newWidth * 2);
     } else if (road.way == Constant.twoWay) {
       if (dir == "left") {
-        edgePoints = mathUtil.RectangleVertex(
-          startPoint,
-          endPoint,
-          newWidth + road.midDivide.midDivideWidth / 2
-        );
+        edgePoints = mathUtil.RectangleVertex(startPoint, endPoint, newWidth + road.midDivide.midDivideWidth / 2);
         mathUtil.clonePoint(leftEdge.start, edgePoints.leftEdgeStart);
         mathUtil.clonePoint(leftEdge.end, edgePoints.leftEdgeEnd);
         road.setWidth(newWidth, dir);
       } else if (dir == "right") {
-        edgePoints = mathUtil.RectangleVertex(
-          startPoint,
-          endPoint,
-          newWidth + road.midDivide.midDivideWidth / 2
-        );
+        edgePoints = mathUtil.RectangleVertex(startPoint, endPoint, newWidth + road.midDivide.midDivideWidth / 2);
         mathUtil.clonePoint(rightEdge.start, edgePoints.rightEdgeStart);
         mathUtil.clonePoint(rightEdge.end, edgePoints.rightEdgeEnd);
         road.setWidth(newWidth, dir);
       }
       //左右两边的edge同时变宽或者变窄
       else {
-        edgePoints = mathUtil.RectangleVertex(
-          startPoint,
-          endPoint,
-          (newWidth * road.leftWidth) / (road.leftWidth + road.rightWidth) +
-            road.midDivide.midDivideWidth / 2
-        );
+        edgePoints = mathUtil.RectangleVertex(startPoint, endPoint, (newWidth * road.leftWidth) / (road.leftWidth + road.rightWidth) + road.midDivide.midDivideWidth / 2);
         mathUtil.clonePoint(leftEdge.start, edgePoints.leftEdgeStart);
         mathUtil.clonePoint(leftEdge.end, edgePoints.leftEdgeEnd);
-        road.setWidth(
-          (newWidth * road.leftWidth) / (road.leftWidth + road.rightWidth),
-          "left"
-        );
-        edgePoints = mathUtil.RectangleVertex(
-          startPoint,
-          endPoint,
-          (newWidth * road.rightWidth) / (road.leftWidth + road.rightWidth) +
-            road.midDivide.midDivideWidth / 2
-        );
+        road.setWidth((newWidth * road.leftWidth) / (road.leftWidth + road.rightWidth), "left");
+        edgePoints = mathUtil.RectangleVertex(startPoint, endPoint, (newWidth * road.rightWidth) / (road.leftWidth + road.rightWidth) + road.midDivide.midDivideWidth / 2);
         mathUtil.clonePoint(rightEdge.start, edgePoints.rightEdgeStart);
         mathUtil.clonePoint(rightEdge.end, edgePoints.rightEdgeEnd);
-        road.setWidth(
-          (newWidth * road.rightWidth) / (road.leftWidth + road.rightWidth),
-          "right"
-        );
+        road.setWidth((newWidth * road.rightWidth) / (road.leftWidth + road.rightWidth), "right");
       }
     }
 
@@ -1583,35 +1412,20 @@ export default class RoadService {
     rightLine.setWeight(rightEdge.getWeight());
     if (road.way == Constant.oneWay) {
       for (let i = 0; i < road.singleLanes.length; ++i) {
-        let laneLine = lineService.create(
-          road.singleLanes[i].start,
-          road.singleLanes[i].end
-        );
+        let laneLine = lineService.create(road.singleLanes[i].start, road.singleLanes[i].end);
         laneLine.setStyle(VectorStyle.SingleDashedLine);
       }
     } else if (road.way == Constant.twoWay) {
       for (let i = 0; i < road.leftLanes.length; ++i) {
-        let laneLine = lineService.create(
-          road.leftLanes[i].start,
-          road.leftLanes[i].end
-        );
+        let laneLine = lineService.create(road.leftLanes[i].start, road.leftLanes[i].end);
         laneLine.setStyle(VectorStyle.SingleDashedLine);
       }
       for (let i = 0; i < road.rightLanes.length; ++i) {
-        let laneLine = lineService.create(
-          road.rightLanes[i].start,
-          road.rightLanes[i].end
-        );
+        let laneLine = lineService.create(road.rightLanes[i].start, road.rightLanes[i].end);
         laneLine.setStyle(VectorStyle.SingleDashedLine);
       }
-      lineService.create(
-        road.midDivide.leftMidDivide.start,
-        road.midDivide.leftMidDivide.end
-      );
-      lineService.create(
-        road.midDivide.rightMidDivide.start,
-        road.midDivide.rightMidDivide.end
-      );
+      lineService.create(road.midDivide.leftMidDivide.start, road.midDivide.leftMidDivide.end);
+      lineService.create(road.midDivide.rightMidDivide.start, road.midDivide.rightMidDivide.end);
     }
   }
 
@@ -1633,56 +1447,26 @@ export default class RoadService {
       },
     };
 
-    let roadLine = mathUtil.createLine1(
-      dataService.getRoadPoint(road.startId),
-      dataService.getRoadPoint(road.endId)
-    );
-    let roadLineCrossPoint = mathUtil.getLineEndPointPos(
-      roadInfo.start,
-      roadInfo.end
-    );
-    let CrossPointStartDistance = mathUtil.getDistance(
-      roadStartPoint,
-      roadLineCrossPoint
-    );
+    let roadLine = mathUtil.createLine1(dataService.getRoadPoint(road.startId), dataService.getRoadPoint(road.endId));
+    let roadLineCrossPoint = mathUtil.getLineEndPointPos(roadInfo.start, roadInfo.end);
+    let CrossPointStartDistance = mathUtil.getDistance(roadStartPoint, roadLineCrossPoint);
     let leftEdgeDistance = mathUtil.getDistance(leftEdge.start, leftEdge.end);
-    let righttEdgeDistance = mathUtil.getDistance(
-      rightEdge.start,
-      rightEdge.end
-    );
-    if (
-      CrossPointStartDistance > leftEdgeDistance ||
-      CrossPointStartDistance > righttEdgeDistance
-    ) {
+    let righttEdgeDistance = mathUtil.getDistance(rightEdge.start, rightEdge.end);
+    if (CrossPointStartDistance > leftEdgeDistance || CrossPointStartDistance > righttEdgeDistance) {
       let satrtEdgeLine = mathUtil.createLine1(leftEdge.start, rightEdge.start);
       let endEdgeLine = mathUtil.createLine1(leftEdge.end, rightEdge.end);
-      let satrtEdgeCrossPoint = mathUtil.getIntersectionPoint(
-        satrtEdgeLine,
-        roadLine
-      );
-      let endEdgeCrossPoint = mathUtil.getIntersectionPoint(
-        endEdgeLine,
-        roadLine
-      );
-
-      roadLineCrossPoint = mathUtil.getLineEndPointPos(
-        satrtEdgeCrossPoint,
-        endEdgeCrossPoint
-      );
+      let satrtEdgeCrossPoint = mathUtil.getIntersectionPoint(satrtEdgeLine, roadLine);
+      let endEdgeCrossPoint = mathUtil.getIntersectionPoint(endEdgeLine, roadLine);
+
+      roadLineCrossPoint = mathUtil.getLineEndPointPos(satrtEdgeCrossPoint, endEdgeCrossPoint);
     }
     // if(roadLineCrossPoint){
     //   let lineLength = this.getDistance(startPoint, endPoint);
     // }
     let leftEdgeLine = mathUtil.createLine1(leftEdge.start, leftEdge.end);
     let rightEdgeLine = mathUtil.createLine1(rightEdge.start, rightEdge.end);
-    let leftEdgePoint = mathUtil.getJoinLinePoint(
-      roadLineCrossPoint,
-      leftEdgeLine
-    );
-    let rightEdgePoint = mathUtil.getJoinLinePoint(
-      roadLineCrossPoint,
-      rightEdgeLine
-    );
+    let leftEdgePoint = mathUtil.getJoinLinePoint(roadLineCrossPoint, leftEdgeLine);
+    let rightEdgePoint = mathUtil.getJoinLinePoint(roadLineCrossPoint, rightEdgeLine);
 
     // let rightEdgePoint = mathUtil.getLineEndPointPos(rightEdge.start, rightEdge.end);
     let edgeLine = mathUtil.createLine1(leftEdgePoint, rightEdgePoint);
@@ -1693,10 +1477,7 @@ export default class RoadService {
         //单向多车道
         let crossList = [];
         for (let i = 0; i < road.singleLanes.length; i++) {
-          let crossLine = mathUtil.createLine1(
-            road.singleLanes[i].start,
-            road.singleLanes[i].end
-          );
+          let crossLine = mathUtil.createLine1(road.singleLanes[i].start, road.singleLanes[i].end);
           // let crossPoint = mathUtil.getIntersectionPoint(edgeLine, crossLine);
           // crossList.push(crossPoint);
           crossList.push(crossLine);
@@ -1712,14 +1493,8 @@ export default class RoadService {
           } else {
             //以此类推
 
-            let middleEdgePoint1 = mathUtil.getJoinLinePoint(
-              roadLineCrossPoint,
-              crossList[i - 1]
-            );
-            let middleEdgePoint2 = mathUtil.getJoinLinePoint(
-              roadLineCrossPoint,
-              crossList[i]
-            );
+            let middleEdgePoint1 = mathUtil.getJoinLinePoint(roadLineCrossPoint, crossList[i - 1]);
+            let middleEdgePoint2 = mathUtil.getJoinLinePoint(roadLineCrossPoint, crossList[i]);
             // roadWidthTipsPos.push({
             //   start: crossList[i - 1],
             //   end: crossList[i],
@@ -1736,10 +1511,7 @@ export default class RoadService {
         //   start: crossList[crossList.length - 1],
         //   end: leftEdgePoint,
         // });
-        let a = mathUtil.getJoinLinePoint(
-          roadLineCrossPoint,
-          crossList[crossList.length - 1]
-        );
+        let a = mathUtil.getJoinLinePoint(roadLineCrossPoint, crossList[crossList.length - 1]);
         roadWidthTipsPos.push({
           start: a,
           end: leftEdgePoint,
@@ -1756,31 +1528,16 @@ export default class RoadService {
       // let leftMidDividePoint = mathUtil.getLineEndPointPos(road.midDivide.leftMidDivide.start, road.midDivide.leftMidDivide.end);
       // let rightMidDividePoint = mathUtil.getLineEndPointPos(road.midDivide.rightMidDivide.start, road.midDivide.rightMidDivide.end);
 
-      let leftMidDivideLine = mathUtil.createLine1(
-        road.midDivide.leftMidDivide.start,
-        road.midDivide.leftMidDivide.end
-      );
-      let rightMidDividePointLine = mathUtil.createLine1(
-        road.midDivide.rightMidDivide.start,
-        road.midDivide.rightMidDivide.end
-      );
-      let leftMidDividePoint = mathUtil.getJoinLinePoint(
-        roadLineCrossPoint,
-        leftMidDivideLine
-      );
-      let rightMidDividePoint = mathUtil.getJoinLinePoint(
-        roadLineCrossPoint,
-        rightMidDividePointLine
-      );
+      let leftMidDivideLine = mathUtil.createLine1(road.midDivide.leftMidDivide.start, road.midDivide.leftMidDivide.end);
+      let rightMidDividePointLine = mathUtil.createLine1(road.midDivide.rightMidDivide.start, road.midDivide.rightMidDivide.end);
+      let leftMidDividePoint = mathUtil.getJoinLinePoint(roadLineCrossPoint, leftMidDivideLine);
+      let rightMidDividePoint = mathUtil.getJoinLinePoint(roadLineCrossPoint, rightMidDividePointLine);
 
       // leftLanes,rightLanes
       if (road.leftLanes.length) {
         let crossList = [];
         for (let i = 0; i < road.leftLanes.length; i++) {
-          let crossLine = mathUtil.createLine1(
-            road.leftLanes[i].start,
-            road.leftLanes[i].end
-          );
+          let crossLine = mathUtil.createLine1(road.leftLanes[i].start, road.leftLanes[i].end);
           // let crossPoint = mathUtil.getIntersectionPoint(edgeLine, crossLine);
           // crossList.push(crossPoint);
 
@@ -1805,10 +1562,7 @@ export default class RoadService {
             //   end: crossList[i],
             // });
             roadWidthTipsPos.push({
-              start: mathUtil.getJoinLinePoint(
-                roadLineCrossPoint,
-                crossList[i - 1]
-              ),
+              start: mathUtil.getJoinLinePoint(roadLineCrossPoint, crossList[i - 1]),
               end: mathUtil.getJoinLinePoint(roadLineCrossPoint, crossList[i]),
             });
           }
@@ -1819,10 +1573,7 @@ export default class RoadService {
         //   end: leftEdgePoint,
         // });
         roadWidthTipsPos.push({
-          start: mathUtil.getJoinLinePoint(
-            roadLineCrossPoint,
-            crossList[crossList.length - 1]
-          ),
+          start: mathUtil.getJoinLinePoint(roadLineCrossPoint, crossList[crossList.length - 1]),
           end: leftEdgePoint,
         });
         road.setRoadWidthTipsPos(roadWidthTipsPos);
@@ -1836,10 +1587,7 @@ export default class RoadService {
       if (road.rightLanes.length) {
         let crossList = [];
         for (let i = 0; i < road.rightLanes.length; i++) {
-          let crossLine = mathUtil.createLine1(
-            road.rightLanes[i].start,
-            road.rightLanes[i].end
-          );
+          let crossLine = mathUtil.createLine1(road.rightLanes[i].start, road.rightLanes[i].end);
           // let crossPoint = mathUtil.getIntersectionPoint(edgeLine, crossLine);
           // crossList.push(crossPoint);
           crossList.push(crossLine);
@@ -1864,10 +1612,7 @@ export default class RoadService {
             // });
 
             roadWidthTipsPos.push({
-              start: mathUtil.getJoinLinePoint(
-                roadLineCrossPoint,
-                crossList[i - 1]
-              ),
+              start: mathUtil.getJoinLinePoint(roadLineCrossPoint, crossList[i - 1]),
               end: mathUtil.getJoinLinePoint(roadLineCrossPoint, crossList[i]),
             });
           }
@@ -1878,10 +1623,7 @@ export default class RoadService {
         //   end: rightEdgePoint,
         // });
         roadWidthTipsPos.push({
-          start: mathUtil.getJoinLinePoint(
-            roadLineCrossPoint,
-            crossList[crossList.length - 1]
-          ),
+          start: mathUtil.getJoinLinePoint(roadLineCrossPoint, crossList[crossList.length - 1]),
           end: rightEdgePoint,
         });
 

src/graphic/Settings.js

@@ -1,9 +1,9 @@
 import Constant from "./Constant";
 import VectorCategory from "./enum/VectorCategory";
 import { os } from "@/utils/vue.ts";
-
+import { drawSetting } from "@/store/drawSetting";
 const Settings = {
-  lineWidth: 1,
+  lineWidth: drawSetting.value?.lineWidth || 1,
   roadLeftDrivewayCount: 1,
   screenMode: false,
   roadRightDrivewayCount: 1,

src/hook/useGraphic.ts

@@ -64,6 +64,8 @@ export const loadData = genUseLoading(
         backImage: data.photoUrl,
       });
       bus.emit("graphicLoader");
+      graphicState.value.canRecovery = false;
+      graphicState.value.canRevoke = false;
     } else {
       drawRef.value.load.clear();
     }

src/store/accidentPhotos.ts

@@ -1,32 +1,32 @@
-import {ref, watch, watchEffect} from "vue";
-import type { PhotoRaw } from './photos'
+import { ref, watch, watchEffect } from "vue";
+import type { PhotoRaw } from "./photos";
 
 export type AccidentPhoto = {
-  id: string
-  photoUrl: string
-  title: string
-  url: string
-  time: number,
-  data: any,
-  type?: string
+  id: string;
+  photoUrl: string;
+  title: string;
+  url: string;
+  time: number;
+  data: any;
+  updateTime?: number;
+  type?: string;
   sceneData: {
-    meterPerPixel: number
-    measures: PhotoRaw['measures'],
-    fixPoints: PhotoRaw['fixPoints'],
-    basePoints: PhotoRaw['basePoints']
-    baseLines: PhotoRaw['baseLines']
-  }
-}
+    meterPerPixel: number;
+    measures: PhotoRaw["measures"];
+    fixPoints: PhotoRaw["fixPoints"];
+    basePoints: PhotoRaw["basePoints"];
+    baseLines: PhotoRaw["baseLines"];
+  };
+};
 
-export const types = [
-  "概览照片",
-  "中心照片",
-  "细目照片",
-  "方位照片"
-]
+export const types = ["概览照片", "中心照片", "细目照片", "方位照片"];
 
-export const accidentPhotos = ref<AccidentPhoto[]>([])
+export const accidentPhotos = ref<AccidentPhoto[]>([]);
 
-watch(accidentPhotos, (val) => {
-  console.error(accidentPhotos.value[1])
-}, { deep: true, flush: "sync"})
+watch(
+  accidentPhotos,
+  (val) => {
+    console.error(accidentPhotos.value[1]);
+  },
+  { deep: true, flush: "sync" }
+);

src/store/drawSetting.ts

@@ -0,0 +1,9 @@
+import { ref } from "vue";
+
+export const drawSetting = ref({
+  defaultSingleLaneWidth: 3.5, //单个车道的宽度
+  defaultMidDivideWidth: 0.2, //隔离带的宽度
+  lineWidth: 1, //基本线宽
+});
+
+(window as any).drawSetting = drawSetting;

src/store/roadPhotos.ts

@@ -1,47 +1,50 @@
-import {ref} from "vue";
-import {PhotoRaw} from "@/store/photos";
+import { ref } from "vue";
+import { PhotoRaw } from "@/store/photos";
 import matruces from "@/utils/matruces";
 
 export type RoadPhotoTable = {
-  arrivalTime: string,
-  weather: string,
-  conditions: string,
-  location: string,
-  illustrate: string,
-  date: number,
-  url?: string,
-  compassAngle: number[]
-  imageTransform: number[]
-
-}
+  arrivalTime: string;
+  weather: string;
+  conditions: string;
+  location: string;
+  illustrate: string;
+  date: number;
+  url?: string;
+  compassAngle: number[];
+  imageTransform: number[];
+};
 export type RoadPhoto = {
-  id: string
-  photoUrl: string
-  url: string
-  title: string
-  time: number,
-  table?: RoadPhotoTable,
-  data: any
+  id: string;
+  photoUrl: string;
+  url: string;
+  title: string;
+  time: number;
+  table?: RoadPhotoTable;
+  data: any;
   sceneData: {
-    meterPerPixel: number
-    measures: PhotoRaw['measures'],
-    fixPoints: PhotoRaw['fixPoints'],
-    basePoints: PhotoRaw['basePoints']
-    baseLines: PhotoRaw['baseLines']
-  }
-}
+    meterPerPixel: number;
+    measures: PhotoRaw["measures"];
+    fixPoints: PhotoRaw["fixPoints"];
+    basePoints: PhotoRaw["basePoints"];
+    baseLines: PhotoRaw["baseLines"];
+  };
+  updateTime?: number;
+};
 
 export const getDefaultTable = (road): RoadPhotoTable => {
-  return road.table ? { ...road.table } : {
-    arrivalTime: "2020-10-12",
-    weather: "晴天",
-    conditions: "普通",
-    location: "",
-    imageTransform: matruces.translateMatrix(0, 0, 0),
-    compassAngle: matruces.translateMatrix(0, 0, 0),
-    illustrate: "说明:绘图比例为1:215，单位为米。车辆甲为小轿车，无车号。车辆乙为小轿车，无车号。选取道路边缘线为基准线，井盖为基准点。",
-    other: "",
-  }
-}
+  return road.table
+    ? { ...road.table }
+    : {
+        arrivalTime: "2020-10-12",
+        weather: "晴天",
+        conditions: "普通",
+        location: "",
+        imageTransform: matruces.translateMatrix(0, 0, 0),
+        compassAngle: matruces.translateMatrix(0, 0, 0),
+        illustrate:
+          "说明:绘图比例为1:215，单位为米。车辆甲为小轿车，无车号。车辆乙为小轿车，无车号。选取道路边缘线为基准线，井盖为基准点。",
+        other: "",
+      };
+};
 
-export const roadPhotos = ref<RoadPhoto[]>([])
+export const roadPhotos = ref<RoadPhoto[]>([]);

src/store/sync.ts

@@ -15,6 +15,7 @@ import { defaultUses, uses } from "@/store/SVGLabel";
 import { imageRotate } from "@/utils/image-rotate";
 import { sceneSeting } from "./sceneSeting";
 import { tables } from "./tables";
+import { drawSetting } from "./drawSetting";
 
 const global = window as any;
 
@@ -216,7 +217,8 @@ const loadStore = async () => {
   roadPhotos.value = data?.roadPhotos || [];
   uses.value = data?.uses || defaultUses;
   tables.value = data?.tables || {};
-
+  drawSetting.value = data?.drawSetting || {};
+  
   syncSceneStore();
 };
 
@@ -246,16 +248,16 @@ const syncSceneStore = () => {
       accidentPhotos: accidentPhotos.value,
       roadPhotos: roadPhotos.value,
       tables: tables.value,
+      drawSetting: drawSetting.value,
     }),
     (data) => {
-      console.error("收到数据源更新")
+      console.error("收到数据源更新");
       updateSceneStore(data);
     },
-    { deep: true, flush: 'sync' }
+    { deep: true, flush: "sync" }
   );
 };
 
-
 loadStore().catch((e) => {
   console.error(e);
   alert("场景数据加载失败");

src/utils/index.ts

@@ -27,10 +27,7 @@ export const debounce = <T extends (...args: any) => any>(fn: T, delay: number =
 const place = /(?:\/:([^/]*))/g;
 // 匹配 /:id 是否匹配某个url
 export const equalUrl = (tempUrl: string, url: string) => {
-  const urlRgStr =
-    "^" +
-    tempUrl.replace(/\/([^:])/g, (_, d) => `\\/${d}`).replace(place, () => `(?:/[^/]*)`) +
-    "$";
+  const urlRgStr = "^" + tempUrl.replace(/\/([^:])/g, (_, d) => `\\/${d}`).replace(place, () => `(?:/[^/]*)`) + "$";
   return new RegExp(urlRgStr).test(url);
 };
 
@@ -48,8 +45,7 @@ export const gendUrl = (tempUrl: string, params: { [key: string]: any }) => {
 };
 
 // 匹配一组数组是否是path链接
-export const includesUrl = (tempUrls: Array<string> | readonly string[], url: string) =>
-  tempUrls.some((tempUrl) => equalUrl(tempUrl, url));
+export const includesUrl = (tempUrls: Array<string> | readonly string[], url: string) => tempUrls.some((tempUrl) => equalUrl(tempUrl, url));
 
 // 字符串转params对象
 export const strToParams = (str: string) => {
@@ -85,17 +81,10 @@ export const toRawType = (value: unknown): string => {
   return toTypeString(value).slice(8, -1);
 };
 
-export const isString = <T>(value: T): T extends string ? true : false =>
-  (toRawType(value) === "String") as any;
+export const isString = <T>(value: T): T extends string ? true : false => (toRawType(value) === "String") as any;
 
 // 递归复制
-export const recursionCopy = <
-  T extends object | Array<any>,
-  R extends object | Array<any>
->(
-  from: R,
-  to: T
-): T & R => {
+export const recursionCopy = <T extends object | Array<any>, R extends object | Array<any>>(from: R, to: T): T & R => {
   if (toRawType(from) !== toRawType(to)) {
     return to as T & R;
   }
@@ -115,10 +104,7 @@ export const recursionCopy = <
         const fromItemType = toRawType(fromItem);
         const toItemType = toRawType(toItem);
 
-        if (
-          fromItemType === toItemType &&
-          (fromItemType === "Object" || fromItemType === "Array")
-        ) {
+        if (fromItemType === toItemType && (fromItemType === "Object" || fromItemType === "Array")) {
           (result as any)[fromKey] = recursionCopy(fromItem, toItem);
         } else {
           (result as any)[fromKey] = toItem;
@@ -161,10 +147,7 @@ export const formatDate = (date: Date, fmt: string = "yyyy-MM-dd hh:mm") => {
   (Object.keys(map) as Array<keyof typeof map>).forEach((k) => {
     if (new RegExp("(" + k + ")").test(fmt)) {
       const val = map[k].toString();
-      fmt = fmt.replace(
-        RegExp.$1,
-        RegExp.$1.length === 1 ? val : ("00" + val).substr(val.length)
-      );
+      fmt = fmt.replace(RegExp.$1, RegExp.$1.length === 1 ? val : ("00" + val).substr(val.length));
     }
   });
 
@@ -172,10 +155,7 @@ export const formatDate = (date: Date, fmt: string = "yyyy-MM-dd hh:mm") => {
 };
 
 // 函数调用拦截
-export const funIntercept = <T extends (...args: any) => any>(
-  originFun: T,
-  proxyFun: (args: Parameters<T>, result: ReturnType<T>) => void
-): T =>
+export const funIntercept = <T extends (...args: any) => any>(originFun: T, proxyFun: (args: Parameters<T>, result: ReturnType<T>) => void): T =>
   function (...args: Parameters<T>) {
     const result = originFun.apply(this, args);
     proxyFun(args, result);
@@ -189,8 +169,7 @@ export const round = (num: number, index: number = 2) => {
 };
 
 // setTimeout转promise
-export const asyncTimeout = (mis: number = 0) =>
-  new Promise((resolve) => setTimeout(resolve, mis));
+export const asyncTimeout = (mis: number = 0) => new Promise((resolve) => setTimeout(resolve, mis));
 
 // 持续检查直到通过
 export const checkPromise = <T = any>(check: () => T) => {
@@ -296,26 +275,17 @@ const _inRevise = (raw1, raw2, readly: Set<[any, any]>) => {
   readly.add([raw1, raw2]);
 
   if (rawType1 === "Array") {
-    return (
-      raw1.length !== raw2.length ||
-      raw1.some((item1, i) => _inRevise(item1, raw2[i], readly))
-    );
+    return raw1.length !== raw2.length || raw1.some((item1, i) => _inRevise(item1, raw2[i], readly));
   } else if (rawType1 === "Object") {
     const rawKeys1 = Object.keys(raw1).sort();
     const rawKeys2 = Object.keys(raw2).sort();
 
-    return (
-      _inRevise(rawKeys1, rawKeys2, readly) ||
-      rawKeys1.some((key) => _inRevise(raw1[key], raw2[key], readly))
-    );
+    return _inRevise(rawKeys1, rawKeys2, readly) || rawKeys1.some((key) => _inRevise(raw1[key], raw2[key], readly));
   } else if (rawType1 === "Map") {
     const rawKeys1 = Array.from(raw1.keys()).sort();
     const rawKeys2 = Array.from(raw2.keys()).sort();
 
-    return (
-      _inRevise(rawKeys1, rawKeys2, readly) ||
-      rawKeys1.some((key) => _inRevise(raw1.get(key), raw2.get(key), readly))
-    );
+    return _inRevise(rawKeys1, rawKeys2, readly) || rawKeys1.some((key) => _inRevise(raw1.get(key), raw2.get(key), readly));
   } else if (rawType1 === "Set") {
     return inRevise(Array.from(raw1.values()), Array.from(raw2.values()));
   } else {
@@ -493,10 +463,7 @@ export const toDigital = (dms: string, retain = 6) => {
   }
 };
 
-export const addImmobilityClick = (
-  dom: HTMLElement,
-  handler: (ev?: MouseEvent) => any
-) => {
+export const addImmobilityClick = (dom: HTMLElement, handler: (ev?: MouseEvent) => any) => {
   const mousedownHandler = (ev: MouseEvent) => {
     const dx = ev.offsetX;
     const dy = ev.offsetY;
@@ -560,3 +527,12 @@ export const blobToBase64 = (blob: Blob) => {
 export const getId = () => {
   return new Date().getTime().toString() + Math.ceil(Math.random() * 1000).toString();
 };
+
+export const getQueryString = (name) => {
+  var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
+  var r = decodeURIComponent(window.location.search.substr(1)).match(reg);
+  if (r != null) {
+    return unescape(r[2]);
+  }
+  return null;
+};

src/views/graphic/geos/roadEdge.vue

@@ -4,7 +4,7 @@
   <VRange
     v-if="showChange"
     :max="1000"
-    :min="100"
+    :min="0"
     :step="1"
     unit="mm"
     v-model:value="(lineWidthMenu[2].desc as number)"
@@ -123,7 +123,7 @@ watchEffect(() => {
   if (style.value === VectorStyle.RoadSide) {
     console.log(vector.value.roadSide);
     menus.value[1] = lineWidthMenu[2];
-    lineWidthMenu[2].desc = vector.value.roadSide.width * 10;
+    lineWidthMenu[2].desc = vector.value.roadSide.width * 1000;
   } else {
     (menus.value[1] =
       vector.value?.weight === VectorWeight.Bold ? lineWidthMenu[0] : lineWidthMenu[1]),
@@ -132,7 +132,7 @@ watchEffect(() => {
 });
 watchEffect(() => {
   if (style.value === VectorStyle.RoadSide) {
-    vector.value.setRoadSideWidth((lineWidthMenu[2].desc as number) / 10);
+    vector.value.setRoadSideWidth((lineWidthMenu[2].desc as number) / 1000);
     drawRef.value.renderer.autoRedraw();
   }
 });

src/views/graphic/header.vue

@@ -173,6 +173,7 @@ const saveStore = genUseLoading(async () => {
   const newData = {
     ...data.value,
     data: JSON.parse(JSON.stringify(drawRef.value.load.save())),
+    updateTime: new Date().getTime(),
   };
   const blob = await drawRef.value.uiControl.screenShot();
   newData.url = await uploadImage(blob);

src/views/graphic/imageLabel.vue

@@ -1,6 +1,5 @@
 <template>
   <div class="graphic-child-menus">
-    {{}}
     <div class="header">
       <ui-icon type="return" class="icon" ctrl @click="$emit('quit')" />
       <p>{{ config.title }}</p>

src/views/roads/index.vue

@@ -107,10 +107,10 @@ const enum TypeEnum {
   Table = "table",
 }
 const currentType = ref(TypeEnum.Draw);
-const sortPhotos = computed(() =>
-  roadPhotos.value
-    // .filter((item) => (currentType.value === TypeEnum.Draw ? !item.table : !!item.table))
-    .reverse()
+const sortPhotos = computed(
+  () =>
+    roadPhotos.value.sort((a, b) => (b.updateTime || b.time) - (a.updateTime || a.time))
+  // .filter((item) => (currentType.value === TypeEnum.Draw ? !item.table : !!item.table))
 );
 const onBack = () => {
   router.back();

src/views/scene/index.vue

@@ -3,14 +3,8 @@
     <template v-slot:header>
       <div class="photos-header">
         <div class="left">
-          <ui-icon
-            class="back-icon"
-            type="return"
-            ctrl
-            style="margin-right: 10px"
-            @click="back"
-          />
-          <span> 案件 </span>
+          <ui-icon class="back-icon" type="return" ctrl style="margin-right: 10px" @click="back" />
+          <span> {{ sceneTitle }} </span>
         </div>
       </div>
     </template>
@@ -20,28 +14,15 @@
         <div class="info-top-left" :class="{ full: viewStatus }">
           <Container @loaded="loaded = true" />
           <template v-if="loaded && !trackMode">
-            <Menus
-              v-if="viewStatus"
-              @active="(data) => (activeMenuKeys = data)"
-              @enter-child="childPage = true"
-              @leave-child="childPage = false"
-            />
+            <Menus v-if="viewStatus" @active="(data) => (activeMenuKeys = data)" @enter-child="childPage = true" @leave-child="childPage = false" />
             <!-- v-if="currentView" -->
             <BasePoints />
             <FixPoints />
             <Measures />
             <Photo />
-            <Range
-              v-if="activeMenuKeys[0] === 'range'"
-              :rangeKey="activeMenuKeys.slice(1).join(':')"
-            />
+            <Range v-if="activeMenuKeys[0] === 'range'" :rangeKey="activeMenuKeys.slice(1).join(':')" />
             <!-- <ButtonPane class="back fun-ctrl" size="48" @click="router.push('/scene')" v-if="!childPage"> -->
-            <ButtonPane
-              class="back fun-ctrl"
-              :size="viewStatus ? 64 : 48"
-              @click="onScale"
-              v-if="!childPage"
-            >
+            <ButtonPane class="back fun-ctrl" :size="viewStatus ? 64 : 48" @click="onScale" v-if="!childPage">
               <ui-icon :type="viewStatus ? 'screen_c' : 'screen_f'" class="icon" />
             </ButtonPane>
             <Mode />
@@ -50,23 +31,19 @@
         <div class="info-top-right" :class="{ full: viewStatus }">
           <div class="input-item">
             <p>事故时间:</p>
-            <input type="text" v-model="sceneInfo.accidentTime" @input="inputHandler" />
+            <input id="accidentTime" type="text" v-model="sceneInfo.accidentTime" @input="inputHandler" />
           </div>
           <div class="input-item">
             <p>天气:</p>
-            <input type="text" v-model="sceneInfo.weather" @input="inputHandler" />
+            <input id="weather" type="text" v-model="sceneInfo.weather" @input="inputHandler" />
           </div>
           <div class="input-item">
             <p>地点:</p>
-            <input type="text" v-model="sceneInfo.address" @input="inputHandler" />
+            <input id="address" type="text" v-model="sceneInfo.address" @input="inputHandler" />
           </div>
           <div class="text-item">
             <p>事故描述:</p>
-            <textarea
-              class="info-textarea"
-              v-model="sceneInfo.accidentDesc"
-              @input="inputHandler"
-            ></textarea>
+            <textarea id="accidentDesc" class="info-textarea" v-model="sceneInfo.accidentDesc" @input="inputHandler"></textarea>
           </div>
           <div class="info-btn">
             <div
@@ -80,9 +57,7 @@
             >
               现场绘图({{ sceneSortPhotos.length }})
             </div>
-            <div class="right-btn" @click="router.push('/accidents?back=1')">
-              事故照片({{ accodentSortPhotos.length }})
-            </div>
+            <div class="right-btn" @click="router.push('/accidents?back=1')">事故照片({{ accodentSortPhotos.length }})</div>
           </div>
         </div>
       </div>
@@ -117,7 +92,7 @@ import { currentView } from "./currentScene";
 import { router, writeRouteName } from "@/router";
 import { roadPhotos } from "@/store/roadPhotos";
 import { types, accidentPhotos } from "@/store/accidentPhotos";
-import { debounce } from "@/utils";
+import { debounce, getQueryString } from "@/utils";
 import { tables } from "@/store/tables";
 const layoutRef = ref(null);
 const activeMenuKeys = ref<string[]>([]);
@@ -137,6 +112,8 @@ const enum TypeEnum {
 const currentType = ref(TypeEnum.Draw);
 const sceneSortPhotos = computed(() => roadPhotos.value);
 
+const sceneTitle = ref(getQueryString("title") ? decodeURIComponent(getQueryString("title")) : "案件");
+
 const loaded = ref(false);
 const childPage = ref(false);
 const stopReg = watchEffect(() => {
@@ -211,6 +188,7 @@ const list = ref([
     type: "law",
   },
 ]);
+
 onMounted(() => {
   var screenHeight = document.body.clientHeight;
   layoutRef.value.style.height = screenHeight + "px";
@@ -219,7 +197,23 @@ onMounted(() => {
   if (tables.value && tables.value["sceneInfo"]) {
     sceneInfo.value = tables.value["sceneInfo"];
   }
+  nextTick(() => {
+    let sceneCanvas = document.querySelector(".scene-canvas");
+    sceneCanvas.addEventListener("touchstart", () => {
+      setBlur();
+    });
+  });
 });
+const setBlur = () => {
+  let domlList = [];
+  domlList.push(document.getElementById("accidentTime"));
+  domlList.push(document.getElementById("weather"));
+  domlList.push(document.getElementById("address"));
+  domlList.push(document.getElementById("accidentDesc"));
+  domlList.forEach((item) => {
+    item.blur();
+  });
+};
 onActivated(async () => {
   await nextTick();
   let full = router.currentRoute.value.query.full;

src/views/tables/author/author-one.vue

@@ -73,7 +73,7 @@
       <div class="item">
         <div style="flex: 1" class="input-box">
           <input style="width: 100%" v-model="data.authorByPhoneNum" />
-          <div class="content-box">{{ data.authorByPhoneNum }}</div>
+          <div class="content-box left">{{ data.authorByPhoneNum }}</div>
         </div>
       </div>
 
@@ -91,8 +91,8 @@
       <div class="item" style="margin-top: 100px">
         <span>受托人：</span>
         <div class="input-box">
-          <input style="width: 100%" v-model="data.authorByName" />
-          <div class="content-box">{{ data.authorByName }}</div>
+          <input style="width: 100%" v-model="data.authorByNameB" />
+          <div class="content-box">{{ data.authorByNameB }}</div>
         </div>
         <span>代理权限为：</span>
       </div>
@@ -108,9 +108,10 @@
 </template>
 
 <script setup>
-import { reactive, ref, toRefs, onBeforeMount, onMounted } from "vue";
+import { reactive, ref, toRefs, onBeforeMount, onMounted, watch } from "vue";
 import { tables } from "@/store/tables";
 import { tablesInfo, setData } from "../data";
+import { bus } from "@/hook/useGraphic";
 const props = defineProps({
   downMode: { type: Boolean, default: false },
   isDownloadShow: { type: Boolean, default: false },
@@ -119,6 +120,8 @@ const data = ref(null);
 const checkOptions = (item, index) => {
   item.check = item.options[index].id;
   data.value[item.type].check = item.check;
+
+  bus.emit("changeAuthorOneCheck");
 };
 const checkData = ref({
   check: 0,
@@ -138,7 +141,13 @@ const checkData = ref({
 const saveHandler = () => {
   return { type: "authorOne", data: data.value };
 };
-
+watch(
+  () => tablesInfo.authorOne,
+  (val, old) => {
+    console.error(val);
+  },
+  { deep: true }
+);
 defineExpose({ saveHandler, data });
 onMounted(() => {
   if (props.isDownloadShow) {
@@ -149,12 +158,16 @@ onMounted(() => {
   if (tablesInfo.authorOne) {
     data.value = tablesInfo.authorOne;
   }
+  bus.on("changeAuthorTwoCheck", (newData) => {
+    data.value.options.check = "";
+  });
 });
 </script>
 <style lang="scss" scoped>
 .content-box {
   width: 100%;
   height: 100%;
+  min-height: 28px;
   display: flex;
   align-items: center;
   justify-content: center;
@@ -194,6 +207,16 @@ onMounted(() => {
     .content-box {
       display: flex;
     }
+
+    .content {
+      .item {
+        width: 100%;
+        display: flex;
+        align-items: flex-end;
+        justify-content: flex-start;
+        margin-bottom: 20px;
+      }
+    }
   }
   .title {
     text-align: center;

src/views/tables/author/author-two.vue

@@ -11,12 +11,33 @@
           </div>
         </div>
       </div> -->
+
+      <div class="check-item" @click="checkOptions(checkData1, index)" v-for="(i, index) in checkData1.options">
+        <div class="item">
+          <ui-icon :type="data.oneOptions.check == i.id ? 'rb_y' : 'rb_n'"></ui-icon>
+          <span>{{ i.title }}</span>
+          <div class="input-box" style="flex: 1">
+            <input v-model="data.oneOptions.value" />
+            <div class="content-box left">{{ data.oneOptions.value }}</div>
+          </div>
+        </div>
+      </div>
+
+      <div class="item" style="margin-bottom: 20px">
+        <span>受托人：</span>
+        <div class="input-box">
+          <input style="width: 100%" v-model="data.authorByName" />
+          <div class="content-box">{{ data.authorByName }}</div>
+        </div>
+        <span>代理权限为：</span>
+      </div>
       <div class="check-item" @click="checkOptions(checkData, index)" v-for="(i, index) in checkData.options">
-        <div class="item" :style="i.id == 1 || i.id == 4 ? '' : 'display: inline-block'">
-          <ui-icon :type="checkData.check == i.id ? 'rb_y' : 'rb_n'"></ui-icon>
+        <div class="item" :style="i.id == 3 ? '' : 'display: inline-block'">
+          <ui-icon :type="data.options.check == i.id ? 'rb_y' : 'rb_n'"></ui-icon>
           <span>{{ i.title }}</span>
-          <div v-if="i.id == 1 || i.id == 4" class="input-box" style="flex: 1">
-            <input type="text" />
+          <div v-if="i.id == 3" class="input-box" style="flex: 1">
+            <input v-model="data.options.value" />
+            <div class="content-box left">{{ data.options.value }}</div>
           </div>
         </div>
       </div>
@@ -24,13 +45,15 @@
       <div class="item" style="margin-top: 200px">
         <span style="padding-left: 20px">委托人（签名）：</span>
         <div style="flex: 1">
-          <input type="text" v-model="data.authorSign" />
+          <input v-model="data.authorSign" />
+          <div class="content-box left" style="border: none">{{ data.authorSign }}</div>
         </div>
       </div>
       <div class="item" style="margin-top: 100px">
         <span>受委托人（签名）：</span>
         <div style="flex: 1">
-          <input type="text" v-model="data.authorBySign" />
+          <input v-model="data.authorBySign" />
+          <div class="content-box left" style="border: none">{{ data.authorBySign }}</div>
         </div>
       </div>
     </div>
@@ -38,20 +61,29 @@
 </template>
 
 <script setup>
-import { reactive, ref, toRefs, onBeforeMount, onMounted } from "vue";
+import { reactive, ref, toRefs, onBeforeMount, onMounted, watch } from "vue";
 import { tables } from "@/store/tables";
-import { tablesInfo, setData } from "../data";
+import { tablesInfo, setData, resetData } from "../data";
+import { bus } from "@/hook/useGraphic";
 const props = defineProps({
   downMode: { type: Boolean, default: false },
   isDownloadShow: { type: Boolean, default: false },
 });
 const data = ref(null);
+// const checkOneOptions = (item, index) => {
+//   item.check = item.options[index].id;
+//   data.value["oneOptions"].check = item.check;
+// };
 const checkOptions = (item, index) => {
   item.check = item.options[index].id;
   data.value[item.type].check = item.check;
+  if (item.type == "oneOptions") {
+    bus.emit("changeAuthorTwoCheck");
+  }
 };
 const checkData1 = ref({
   check: 0,
+  type: "oneOptions",
   options: [
     {
       id: 1,
@@ -59,23 +91,21 @@ const checkData1 = ref({
     },
   ],
 });
+
 const checkData = ref({
+  type: "options",
   check: 0,
   options: [
     {
       id: 1,
-      title: "...",
-    },
-    {
-      id: 2,
       title: "一般代理。即代理为参与诉讼、调解，提供法律帮助。",
     },
     {
-      id: 3,
+      id: 2,
       title: "特别授权，代为起诉，陈述事实，参加辩论和调解，代为提出、承认、放弃或变更赔偿请求， 提起反诉或上诉，签收法律文书。",
     },
     {
-      id: 4,
+      id: 3,
       title: "...",
     },
   ],
@@ -95,12 +125,16 @@ onMounted(() => {
   if (tablesInfo.authorTwo) {
     data.value = tablesInfo.authorTwo;
   }
+  bus.on("changeAuthorOneCheck", (newData) => {
+    data.value.oneOptions.check = "";
+  });
 });
 </script>
 <style lang="scss" scoped>
 .content-box {
   width: 100%;
   height: 100%;
+  min-height: 28px;
   display: flex;
   align-items: center;
   justify-content: center;

src/views/tables/data/index.ts

@@ -191,8 +191,10 @@ let data = {
   },
   authorTwo: {
     options: { check: "", value: "" },
+    oneOptions: { check: "", value: "" },
     authorSign: "",
     authorBySign: "",
+    authorByName: "",
   },
 
   authorOne: {
@@ -202,6 +204,7 @@ let data = {
       { name: "", sex: "", age: "", id: "", address: "", phoneNum: "" },
     ],
     authorByName: "",
+    authorByNameB: "",
     authorBySex: "",
     authorByAge: "",
     authorById: "",
@@ -213,8 +216,12 @@ let data = {
 };
 
 export let tablesInfo = JSON.parse(JSON.stringify(data));
-export const resetData = () => {
-  tablesInfo = JSON.parse(JSON.stringify(data));
+export const resetData = (newData) => {
+  if (!newData) {
+    tablesInfo = JSON.parse(JSON.stringify(data));
+  } else {
+    tablesInfo = JSON.parse(JSON.stringify(newData));
+  }
 };
 export const setData = (type) => {
   if (tables && tables.value[type]) {

src/views/tables/explorate-one.vue

@@ -555,6 +555,7 @@ onMounted(() => {
 .content-box {
   width: 100%;
   height: 100%;
+ 
   display: none;
   align-items: center;
   justify-content: center;

src/views/tables/index.vue

@@ -127,7 +127,7 @@ const saveHandler = genUseLoading(async () => {
 
 const saveStore = () => {
   let reportData = initData();
-  console.error(reportData);
+  // console.error(reportData);
   const origin = tables.value;
   let newData = Object.assign(origin, reportData);
 };