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

package.json

@@ -10,6 +10,7 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "@lk77/vue3-color": "^3.0.6",
     "@types/express": "^4.17.17",
     "axios": "^1.3.5",
     "body-parser": "^1.20.2",
@@ -18,6 +19,7 @@
     "driver.js": "^0.9.8",
     "express-fileupload": "^1.4.0",
     "html2canvas": "^1.4.1",
+    "install": "^0.13.0",
     "js-base64": "^3.7.5",
     "jspdf": "^2.5.1",
     "mitt": "^3.0.0",

src/components/base/assets/scss/components/_slide.scss

@@ -3,8 +3,12 @@
   position: relative;
   height: 100%;
 
+
   &.stop-animation .ui-gate-slides{
     transition: none;
+    .ui-gate-content {
+      transition: none !important;
+    }
   }
 
   .right,
@@ -56,4 +60,4 @@
       }
     }
   }
-}
+}

src/components/base/components/input/color.vue

@@ -1,6 +1,15 @@
 <template>
     <div class="color input" :class="{ default: !$slots.replace }" :style="{ width, height }">
-        <input :name="name" :disabled="disabled" :id="id" :value="props.modelValue" type="color" class="replace-input" :checked="props.modelValue" @input="inputHandler" />
+        <input
+            :name="name"
+            :disabled="disabled"
+            :id="id"
+            :value="props.modelValue"
+            type="color"
+            class="replace-input"
+            :checked="props.modelValue"
+            @input="inputHandler"
+        />
         <span class="replace" v-if="$slots.replace">
             <slot name="replace"></slot>
         </span>
@@ -15,6 +24,7 @@ const props = defineProps(colorPropsDesc)
 const emit = defineEmits(['update:modelValue'])
 const id = randomId(4)
 
+
 const inputHandler = ev => {
     emit('update:modelValue', ev.target.value)
     nextTick(() => {

src/components/base/components/slide/index.vue

@@ -125,7 +125,7 @@ const mousedownHandler = ev => {
 }
 
 let prevent = false
-const openPrevent = (fn) => {
+const openPrevent = (fn, fnend) => {
     prevent = true
     setTimeout(() => {
         stopAmimation.value = true
@@ -134,29 +134,38 @@ const openPrevent = (fn) => {
             setTimeout(() => {
                 stopAmimation.value = false
                 prevent = false
-            }, 50)
+                fnend && fnend()
+            }, 300)
         })
     }, 300)
 }
 const prevHandler = () => {
     if (prevent) return;
     if (index.value === 0) {
+        extendIndex.value--
         openPrevent(() => {
             extendIndex.value = extendLength.value + props.items.length  - 1
+        }, () => {
+            emit('change', index.value)
         })
+    } else {
+        extendIndex.value--
+        emit('change', index.value)
     }
-    extendIndex.value--
-    emit('change', index.value)
 }
 const nextHandler = () => {
     if (prevent) return;
     if (index.value === props.items.length - 1) {
+        extendIndex.value++
         openPrevent(() => {
             extendIndex.value = extendLength.value
+        }, () => {
+            emit('change', index.value)
         })
+    } else {
+        extendIndex.value++
+        emit('change', index.value)
     }
-    extendIndex.value++
-    emit('change', index.value)
 }
 </script>
 

src/components/color/index.vue

@@ -0,0 +1,86 @@
+<template>
+  <div class="color-layout" @click.stop>
+    <div v-if="show" class="color-model">
+      <Sketch
+          :modelValue="color"
+          :presetColors="presetColors"
+          @update:modelValue="data => $emit('update:color', data.hex8)"
+      />
+    </div>
+    <div @click.stop="show = !show">
+      <slot/>
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import {Sketch} from '@lk77/vue3-color'
+import {ref, watchEffect} from "vue";
+
+defineProps<{ color: string }>()
+defineEmits<{ (e: "update:color", color: string): void }>()
+const presetColors = [
+  '#f00', '#00ff00', '#00ff0055','#00ff0055', 'rgb(201, 76, 76)', 'rgba(0,0,255,1)', 'hsl(89, 43%, 51%)', 'hsla(89, 43%, 51%, 0.6)'
+]
+const show = ref(false)
+
+watchEffect((onCleanup) => {
+  if (show.value) {
+    const handler = () => {
+      show.value = false
+    }
+    document.documentElement.addEventListener("click", handler)
+    onCleanup(() => {
+      document.documentElement.removeEventListener("click", handler)
+    })
+  }
+})
+</script>
+
+<style lang="scss" scoped>
+
+.color-layout {
+  position: relative;
+
+  .color-model {
+    position: absolute;
+    bottom: calc(100% + 20px);
+    left: 50%;
+    transform: translateX(-50%);
+  }
+}
+</style>
+<style lang="scss">
+body {
+  .vc-sketch-alpha-wrap,
+  .vc-sketch-field--single,
+  .vc-sketch-field {
+    display: none !important;
+  }
+
+  .vc-sketch {
+    /*background-color: #000;*/
+    width: 30vw !important;
+  }
+
+  .vc-sketch-presets-color {
+    width: 3vw;
+    height: 3vw;
+  }
+
+  .vc-hue-picker {
+    width: 14px;
+    height: 22px;
+  }
+
+  .vc-sketch-alpha-wrap, .vc-sketch-hue-wrap {
+    height: 24px;
+  }
+
+  .vc-saturation-circle {
+    width: 24px;
+    height: 24px;
+    transform: translate(-12px, -12px);
+  }
+}
+</style>

src/components/main-panel/index.vue

@@ -107,4 +107,4 @@ const layoutClass = computed(() => ({
 .fill {
   left: calc(-1 * var(--editor-menu-width))
 }
-</style>
+</style>

src/graphic/Controls/AddCrossRoad.js

@@ -108,7 +108,7 @@ export default class AddCrossRoad {
     startPoint.setIndex(0);
 
     endPoint.setPointParent(curveRoad.vectorId);
-    endPoint.setIndex(2);
+    endPoint.setIndex(1);
 
     let edgePoints = mathUtil.RectangleVertex(
       startPoint,
@@ -158,8 +158,8 @@ export default class AddCrossRoad {
       y: (endPoint.y + midPoint.y) / 2,
     };
 
-    curveRoadService.addCPoint(curveRoad, mid1, 0);
-    curveRoadService.addCPoint(curveRoad, mid2, 1);
+    curveRoadService.addCPoint(curveRoad, mid1, 1);
+    curveRoadService.addCPoint(curveRoad, mid2, 2);
     mid1.x -= offsetDis;
     mid2.x += offsetDis;
     curveRoadService.updateForMovePoint(curveRoad.points[1].vectorId, mid1);
@@ -383,7 +383,7 @@ export default class AddCrossRoad {
     startPoint.setIndex(0);
 
     endPoint.setPointParent(curveRoad.vectorId);
-    endPoint.setIndex(2);
+    endPoint.setIndex(1);
 
     let edgePoints = mathUtil.RectangleVertex(
       startPoint,
@@ -436,11 +436,11 @@ export default class AddCrossRoad {
       y: position.y - height / 2,
     };
 
-    curveRoadService.addCPoint(curveRoad, point1, 0);
-    curveRoadService.addCPoint(curveRoad, point2, 1);
-    curveRoadService.addCPoint(curveRoad, position, 2);
-    curveRoadService.addCPoint(curveRoad, point3, 3);
-    curveRoadService.addCPoint(curveRoad, point4, 4);
+    curveRoadService.addCPoint(curveRoad, point1, 1);
+    curveRoadService.addCPoint(curveRoad, point2, 2);
+    curveRoadService.addCPoint(curveRoad, position, 3);
+    curveRoadService.addCPoint(curveRoad, point3, 4);
+    curveRoadService.addCPoint(curveRoad, point4, 5);
 
     curveRoadService.updateForMovePoint(curveRoad.points[1].vectorId, point1);
     curveRoadService.updateForMovePoint(curveRoad.points[2].vectorId, point2);

src/graphic/Controls/AddPoint.js

@@ -1,16 +1,16 @@
-import { dataService } from '../Service/DataService';
-import { lineService } from '../Service/LineService';
-import { pointService } from '../Service/PointService';
-import VectorCategory from '../enum/VectorCategory';
-import Point from '../Geometry/Point.js';
-import { mathUtil } from '../Util/MathUtil';
-import addLine from './AddLine';
-import Settings from '../Settings';
-import { stateService } from '../Service/StateService';
-import LayerEvents from '../enum/LayerEvents';
-import VectorType from '../enum/VectorType';
-import Constant from '../Constant';
-import { listenLayer } from '../ListenLayer';
+import { dataService } from "../Service/DataService";
+import { lineService } from "../Service/LineService";
+import { pointService } from "../Service/PointService";
+import VectorCategory from "../enum/VectorCategory";
+import Point from "../Geometry/Point.js";
+import { mathUtil } from "../Util/MathUtil";
+import addLine from "./AddLine";
+import Settings from "../Settings";
+import { stateService } from "../Service/StateService";
+import LayerEvents from "../enum/LayerEvents";
+import VectorType from "../enum/VectorType";
+import Constant from "../Constant";
+import { listenLayer } from "../ListenLayer";
 
 export default class AddPoint {
   constructor() {
@@ -19,7 +19,11 @@ export default class AddPoint {
 
   buildPoint(position) {
     //只有一个基准点的时候，测量的时候自动选择基准点
-    if ((Settings.selectLocationMode == Constant.angleLocationMode || Settings.selectLocationMode == Constant.allLocationMode) && Settings.basePointIds.length == 1) {
+    if (
+      (Settings.selectLocationMode == Constant.angleLocationMode ||
+        Settings.selectLocationMode == Constant.allLocationMode) &&
+      Settings.basePointIds.length == 1
+    ) {
       Settings.selectBasePointId = Settings.basePointIds[0];
     }
     let newPoint;
@@ -27,28 +31,43 @@ export default class AddPoint {
       newPoint = pointService.create(position);
       Settings.selectBasePointId = newPoint.vectorId;
     } else {
-      if (Settings.selectBasePointId != null && Settings.selectLocationMode == Constant.angleLocationMode) {
+      if (
+        Settings.selectBasePointId != null &&
+        Settings.selectLocationMode == Constant.angleLocationMode
+      ) {
         newPoint = pointService.create(position);
         this.setLocationByAngle(newPoint.vectorId);
         newPoint.setLocationMode(Constant.angleLocationMode);
         stateService.setEventName(LayerEvents.AddPoint);
-      } else if (Settings.selectBasePointId != null && Settings.selectLocationMode == Constant.allLocationMode) {
+      } else if (
+        Settings.selectBasePointId != null &&
+        Settings.selectLocationMode == Constant.allLocationMode
+      ) {
         newPoint = pointService.create(position);
         this.setLocationByAll(newPoint.vectorId);
         newPoint.setLocationMode(Constant.allLocationMode);
         stateService.setEventName(LayerEvents.AddPoint);
-      } else if (Settings.baseLineId != null && Settings.selectLocationMode == Constant.normalLocationMode) {
+      } else if (
+        Settings.baseLineId != null &&
+        Settings.selectLocationMode == Constant.normalLocationMode
+      ) {
         newPoint = pointService.create(position);
         this.setLocationByNormal(newPoint.vectorId);
         newPoint.setLocationMode(Constant.normalLocationMode);
 
         stateService.setEventName(LayerEvents.AddPoint);
-      } else if (Settings.selectBasePointId == null && (Settings.selectLocationMode == Constant.angleLocationMode || Settings.selectLocationMode == Constant.allLocationMode)) {
+      } else if (
+        Settings.selectBasePointId == null &&
+        (Settings.selectLocationMode == Constant.angleLocationMode ||
+          Settings.selectLocationMode == Constant.allLocationMode)
+      ) {
         return null;
       }
       if (
         newPoint &&
-        (newPoint.getLocationMode() == Constant.allLocationMode || newPoint.getLocationMode() == Constant.angleLocationMode || newPoint.getLocationMode() == Constant.normalLocationMode) &&
+        (newPoint.getLocationMode() == Constant.allLocationMode ||
+          newPoint.getLocationMode() == Constant.angleLocationMode ||
+          newPoint.getLocationMode() == Constant.normalLocationMode) &&
         newPoint.getCategory() == VectorCategory.Point.TestPoint
       ) {
         this.testPointIds.push(newPoint.vectorId);
@@ -58,6 +77,24 @@ export default class AddPoint {
     return newPoint;
   }
 
+  //添加固定点/基准点
+  buildPoint2(position) {
+    let newPoint = null;
+    if (listenLayer.modifyPoint && listenLayer.modifyPoint.linkedPointId) {
+      return null;
+    }
+    if (Settings.selectPointCategory == VectorCategory.Point.BasePoint) {
+      newPoint = pointService.create(position);
+      Settings.selectBasePointId = newPoint.vectorId;
+      stateService.setEventName(LayerEvents.AddPoint);
+    } else if (Settings.selectPointCategory == VectorCategory.Point.FixPoint) {
+      newPoint = pointService.create(position);
+      stateService.setEventName(LayerEvents.AddPoint);
+    }
+    listenLayer.clear();
+    return newPoint;
+  }
+
   isFocusBasePoint() {
     if (Settings.selectBasePointId) {
       let point = dataService.getPoint(Settings.selectBasePointId);
@@ -90,9 +127,17 @@ export default class AddPoint {
     join.setLocationMode(Constant.angleLocationMode);
     join.setLinkedBasePointId(basePoint.vectorId);
     join.setLinkedTestPointId(testPointId);
-    let guidePositionLine = lineService.createByPointId(testPointId, join.vectorId, VectorCategory.Line.GuidePositionLine);
+    let guidePositionLine = lineService.createByPointId(
+      testPointId,
+      join.vectorId,
+      VectorCategory.Line.GuidePositionLine
+    );
 
-    let positionLine = lineService.createByPointId(basePoint.vectorId, join.vectorId, VectorCategory.Line.PositionLine);
+    let positionLine = lineService.createByPointId(
+      basePoint.vectorId,
+      join.vectorId,
+      VectorCategory.Line.PositionLine
+    );
     guidePositionLine.setLocationMode(Constant.angleLocationMode);
     positionLine.setLocationMode(Constant.angleLocationMode);
     join.setCategory(VectorCategory.Point.TestBasePoint);
@@ -118,15 +163,29 @@ export default class AddPoint {
     join.setLinkedBasePointId(basePoint.vectorId);
     join.setLinkedTestPointId(testPointId);
     //待测点与基准线的垂直线
-    lineService.createByPointId(testPointId, join.vectorId, VectorCategory.Line.PositionLine);
+    lineService.createByPointId(
+      testPointId,
+      join.vectorId,
+      VectorCategory.Line.PositionLine
+    );
     //暂时没有其他待测点
     if (this.testPointIds.length == 0) {
       //待测点与基准线点的连线
-      lineService.createByPointId(basePoint.vectorId, testPointId, VectorCategory.Line.PositionLine);
+      lineService.createByPointId(
+        basePoint.vectorId,
+        testPointId,
+        VectorCategory.Line.PositionLine
+      );
     } else {
       //取上一个待测点
-      lineService.createByPointId(this.testPointIds[this.testPointIds.length - 1], testPointId, VectorCategory.Line.PositionLine);
-      testPoint.setLinkedTestPointId(this.testPointIds[this.testPointIds.length - 1]);
+      lineService.createByPointId(
+        this.testPointIds[this.testPointIds.length - 1],
+        testPointId,
+        VectorCategory.Line.PositionLine
+      );
+      testPoint.setLinkedTestPointId(
+        this.testPointIds[this.testPointIds.length - 1]
+      );
     }
   }
 
@@ -148,7 +207,11 @@ export default class AddPoint {
     join.setCategory(VectorCategory.Point.TestBasePoint);
     join.setLocationMode(Constant.normalLocationMode);
     join.setLinkedTestPointId(testPointId);
-    lineService.createByPointId(testPointId, join.vectorId, VectorCategory.Line.PositionLine);
+    lineService.createByPointId(
+      testPointId,
+      join.vectorId,
+      VectorCategory.Line.PositionLine
+    );
   }
 
   deleteTestPoints() {
@@ -158,7 +221,7 @@ export default class AddPoint {
     this.testPointIds = [];
   }
 
-  resetTestPoints(){
+  resetTestPoints() {
     this.testPointIds = [];
   }
 }

src/graphic/Controls/LocationModeControl.js

@@ -0,0 +1,91 @@
+import { mathUtil } from "../Util/MathUtil";
+import { textService } from "../Service/TextService";
+import { listenLayer } from "../ListenLayer";
+import Settings from "../Settings";
+import { dataService } from "../Service/DataService";
+import { lineService } from "../Service/LineService";
+import { pointService } from "../Service/PointService";
+import VectorCategory from "../enum/VectorCategory";
+import Constant from "../Constant";
+
+export default class LocationModeControl {
+  constructor() {}
+
+  //设置直角定位法
+  setAngle() {
+    let selectBasePoint = this.isFocusBasePoint();
+    if (selectBasePoint) {
+      let points = dataService.getPoints();
+      for (let key in points) {
+        let point = dataService.getPoint(key);
+        if (point.getCategory() == VectorCategory.Point.FixPoint) {
+          this.setSingleFixPointByAngle(
+            point.vectorId,
+            selectBasePoint.vectorId
+          );
+        }
+      }
+    }
+  }
+
+  //对一个点进行直角定位法
+  //生成两条定位线和一条辅助线
+  setSingleFixPointByAngle(fixPointId, basePointId) {
+    let fixPoint = dataService.getPoint(fixPointId);
+    let basePoint = dataService.getPoint(basePointId);
+    let baseLine = dataService.getLine(Settings.baseLineId);
+    let startPoint = dataService.getPoint(baseLine.startId);
+    let endPoint = dataService.getPoint(baseLine.endId);
+
+    let baseLineGeometry = mathUtil.createLine1(startPoint, endPoint);
+    let vLine = mathUtil.getVerticalLine(baseLineGeometry, fixPoint);
+    let join = mathUtil.getJoinLinePoint(basePoint, vLine);
+    join = pointService.create(join);
+    join.setLocationMode(Constant.angleLocationMode);
+
+    let locationLineByFixPoint = lineService.createByPointId(
+      fixPointId,
+      join.vectorId,
+      VectorCategory.Line.LocationLineByFixPoint
+    );
+    locationLineByFixPoint.setLocationMode(Constant.angleLocationMode);
+
+    let locationLineByBasePoint = mathUtil.getVerticalLine(vLine, basePoint);
+    join = mathUtil.getIntersectionPoint(locationLineByBasePoint, vLine);
+    join = pointService.create(join);
+    join.setLocationMode(Constant.angleLocationMode);
+    locationLineByBasePoint = lineService.createByPointId(
+      basePointId,
+      join.vectorId,
+      VectorCategory.Line.LocationLineByBasePoint
+    );
+    locationLineByBasePoint.setLocationMode(Constant.angleLocationMode);
+
+    let guideLocationLine = lineService.createByPointId(
+      fixPointId,
+      join.vectorId,
+      VectorCategory.Line.GuideLocationLine
+    );
+    guideLocationLine.setLocationMode(Constant.angleLocationMode);
+  }
+
+  /******************************************************************************************************************************************************/
+
+  //设置综合定位法
+  setAll() {}
+
+  /******************************************************************************************************************************************************/
+
+  isFocusBasePoint() {
+    if (Settings.selectBasePointId) {
+      let point = dataService.getPoint(Settings.selectBasePointId);
+      if (point.getCategory() == VectorCategory.Point.BasePoint) {
+        return point;
+      }
+    }
+    return null;
+  }
+}
+
+const locationModeControl = new LocationModeControl();
+export { locationModeControl };

src/graphic/Controls/MoveLine.js

@@ -1,14 +1,91 @@
-import Constant from '../Constant';
-import { dataService } from '../Service/DataService';
-import { lineService } from '../Service/LineService';
-import { pointService } from '../Service/PointService';
-import { movePoint } from './MovePoint';
-import { mathUtil } from '../Util/MathUtil';
-import VectorCategory from '../enum/VectorCategory';
+import Constant from "../Constant";
+import { dataService } from "../Service/DataService";
+import { lineService } from "../Service/LineService";
+import { pointService } from "../Service/PointService";
+import { movePoint } from "./MovePoint";
+import { mathUtil } from "../Util/MathUtil";
+import VectorCategory from "../enum/VectorCategory";
 
 export default class MoveLine {
   constructor() {}
 
+  // moveLine(lineId, dx, dy) {
+  //   dx = dx;
+  //   dy = -dy;
+  //   let line = dataService.getLine(lineId);
+  //   let startPoint = dataService.getPoint(line.startId);
+  //   let endPoint = dataService.getPoint(line.endId);
+
+  //   //垂直移动
+  //   if (line.getCategory() == VectorCategory.Line.PositionLine && line.getLocationMode() == Constant.angleLocationMode) {
+  //     let point1 = {
+  //       x: startPoint.x + dx,
+  //       y: startPoint.y + dy,
+  //     };
+  //     let point2 = {
+  //       x: endPoint.x + dx,
+  //       y: endPoint.y + dy,
+  //     };
+  //     let lineGeometry = mathUtil.createLine1(point1, point2);
+  //     point1 = mathUtil.getJoinLinePoint(startPoint, lineGeometry);
+  //     //startPoint本来是基准点
+  //     if (startPoint.getCategory() == VectorCategory.Point.BasePoint) {
+  //       //达到一定距离才能移动
+  //       if (mathUtil.getDistance(startPoint, point1) < Constant.minAdsorbPix) {
+  //         return false;
+  //       }
+  //       let newStartPoint = pointService.create(point1);
+  //       let extendedPositionLine = lineService.createByPointId(startPoint.vectorId, newStartPoint.vectorId, VectorCategory.Line.ExtendedPositionLine);
+  //       extendedPositionLine.setLocationMode(Constant.angleLocationMode);
+  //       dataService.deletePointParent(startPoint.vectorId, lineId);
+  //       line.startId = newStartPoint.vectorId;
+  //       newStartPoint.setPointParent(line.vectorId, 'start');
+  //       newStartPoint.setCategory(VectorCategory.Point.TestBasePoint);
+  //     } else {
+  //       startPoint.x = point1.x;
+  //       startPoint.y = point1.y;
+  //       let parents = Object.keys(startPoint.parent);
+  //       let extendedLine = dataService.getLine(parents[0]);
+  //       if (extendedLine.getCategory() != VectorCategory.Line.ExtendedPositionLine) {
+  //         extendedLine = dataService.getLine(parents[1]);
+  //       }
+  //       if (extendedLine.getCategory() == VectorCategory.Line.ExtendedPositionLine) {
+  //         //point1是基准点
+  //         point1 = dataService.getPoint(extendedLine.startId);
+  //         point2 = dataService.getPoint(extendedLine.endId);
+  //         if (mathUtil.getDistance(point1, point2) < Constant.minAdsorbPix) {
+  //           dataService.deleteLine(extendedLine.vectorId);
+  //           dataService.deletePoint(extendedLine.endId);
+
+  //           line.startId = point1.vectorId;
+  //           point1.setPointParent(line.vectorId, 'start');
+
+  //           lineGeometry = mathUtil.createLine3(lineGeometry, point1);
+  //         }
+  //       }
+  //     }
+
+  //     point2 = mathUtil.getJoinLinePoint(endPoint, lineGeometry);
+  //     endPoint.x = point2.x;
+  //     endPoint.y = point2.y;
+  //   } else {
+  //     //综合定位和垂线定位，拖动基准线更新位置
+  //     if (line.getCategory() == VectorCategory.Line.BaseLine) {
+  //       let points = dataService.vectorData.points;
+  //       for (let key in points) {
+  //         if (points[key].category == VectorCategory.Point.TestPoint && (points[key].locationMode == Constant.allLocationMode || points[key].locationMode == Constant.normalLocationMode)) {
+  //           movePoint.updatePositionByTestPoint(points[key].vectorId);
+  //         }
+  //       }
+  //     }
+  //     startPoint.x += dx;
+  //     startPoint.y += dy;
+  //     endPoint.x += dx;
+  //     endPoint.y += dy;
+  //   }
+  //   return true;
+  // }
+
   moveLine(lineId, dx, dy) {
     dx = dx;
     dy = -dy;
@@ -16,8 +93,12 @@ export default class MoveLine {
     let startPoint = dataService.getPoint(line.startId);
     let endPoint = dataService.getPoint(line.endId);
 
-    //垂直移动
-    if (line.getCategory() == VectorCategory.Line.PositionLine && line.getLocationMode() == Constant.angleLocationMode) {
+    //垂直移动，直角定位法只支持定位线的拖拽
+    if (
+      (line.getCategory() == VectorCategory.Line.LocationLineByFixPoint ||
+        line.getCategory() == VectorCategory.Line.LocationLineByBasePoint) &&
+      line.getLocationMode() == Constant.angleLocationMode
+    ) {
       let point1 = {
         x: startPoint.x + dx,
         y: startPoint.y + dy,
@@ -35,21 +116,29 @@ export default class MoveLine {
           return false;
         }
         let newStartPoint = pointService.create(point1);
-        let extendedPositionLine = lineService.createByPointId(startPoint.vectorId, newStartPoint.vectorId, VectorCategory.Line.ExtendedPositionLine);
+        let extendedPositionLine = lineService.createByPointId(
+          startPoint.vectorId,
+          newStartPoint.vectorId,
+          VectorCategory.Line.ExtendedPositionLine
+        );
         extendedPositionLine.setLocationMode(Constant.angleLocationMode);
         dataService.deletePointParent(startPoint.vectorId, lineId);
         line.startId = newStartPoint.vectorId;
-        newStartPoint.setPointParent(line.vectorId, 'start');
+        newStartPoint.setPointParent(line.vectorId, "start");
         newStartPoint.setCategory(VectorCategory.Point.TestBasePoint);
       } else {
         startPoint.x = point1.x;
         startPoint.y = point1.y;
         let parents = Object.keys(startPoint.parent);
         let extendedLine = dataService.getLine(parents[0]);
-        if (extendedLine.getCategory() != VectorCategory.Line.ExtendedPositionLine) {
+        if (
+          extendedLine.getCategory() != VectorCategory.Line.ExtendedPositionLine
+        ) {
           extendedLine = dataService.getLine(parents[1]);
         }
-        if (extendedLine.getCategory() == VectorCategory.Line.ExtendedPositionLine) {
+        if (
+          extendedLine.getCategory() == VectorCategory.Line.ExtendedPositionLine
+        ) {
           //point1是基准点
           point1 = dataService.getPoint(extendedLine.startId);
           point2 = dataService.getPoint(extendedLine.endId);
@@ -58,7 +147,7 @@ export default class MoveLine {
             dataService.deletePoint(extendedLine.endId);
 
             line.startId = point1.vectorId;
-            point1.setPointParent(line.vectorId, 'start');
+            point1.setPointParent(line.vectorId, "start");
 
             lineGeometry = mathUtil.createLine3(lineGeometry, point1);
           }
@@ -70,14 +159,7 @@ export default class MoveLine {
       endPoint.y = point2.y;
     } else {
       //综合定位和垂线定位，拖动基准线更新位置
-      if (line.getCategory() == VectorCategory.Line.BaseLine) {
-        let points = dataService.vectorData.points;
-        for (let key in points) {
-          if (points[key].category == VectorCategory.Point.TestPoint && (points[key].locationMode == Constant.allLocationMode || points[key].locationMode == Constant.normalLocationMode)) {
-            movePoint.updatePositionByTestPoint(points[key].vectorId);
-          }
-        }
-      }
+      //缺
       startPoint.x += dx;
       startPoint.y += dy;
       endPoint.x += dx;

src/graphic/Geometry/Img.js

@@ -13,6 +13,7 @@ export default class Img extends Geometry {
     this.center = null;
     this.imageData = null;
     this.bounding = null;
+    this.scale = 1;
     this.geoType = VectorType.Img;
     this.setId(vectorId);
     this.setSrc(src);
@@ -59,5 +60,6 @@ export default class Img extends Geometry {
       x: this.center.x - width / 2,
       y: this.center.y - height / 2,
     };
+    this.scale = coordinate.width / width;
   }
 }

src/graphic/History/HistoryUtil.js

@@ -28,7 +28,9 @@ export default class HistoryUtil {
       line1.startId == line2.startId &&
       line1.endId == line2.endId &&
       line1.category == line2.category &&
-      line1.locationMode == line2.locationMode
+      line1.locationMode == line2.locationMode && 
+      line1.style == line2.style && 
+      line1.weight == line2.weight 
     ) {
       return false;
     } else {
@@ -350,6 +352,8 @@ export default class HistoryUtil {
     lineInfo.category = line2.category;
     lineInfo.locationMode = line2.locationMode;
     lineInfo.value = line2.value;
+    lineInfo.style = line2.style;
+    lineInfo.weight = line2.weight;
     this.setLineInfo(lineInfo);
   }
 
@@ -592,6 +596,8 @@ export default class HistoryUtil {
     data.category = line.category;
     data.locationMode = line.locationMode;
     data.type = line.geoType;
+    data.style = line.style;
+    data.weight = line.weight;
     return data;
   }
 
@@ -821,6 +827,8 @@ export default class HistoryUtil {
     line.category = lineInfo.category;
     line.locationMode = lineInfo.locationMode;
     line.value = lineInfo.value;
+    line.style = lineInfo.style;
+    line.weight = lineInfo.weight;
     return line;
   }
 

src/graphic/Layer.js

@@ -1,48 +1,48 @@
-import Load from './Load';
-import { stateService } from './Service/StateService';
-import { elementService } from './Service/ElementService';
-import { dataService } from './Service/DataService';
-import { textService } from './Service/TextService';
-import { historyService } from './Service/HistoryService';
-import UIControl from './Controls/UIControl';
-// import { moveRectangle } from "./Controls/MoveRectangle";
-import { moveText } from './Controls/MoveText';
-import { moveSVG } from './Controls/MoveSVG';
-import { moveMagnifier } from './Controls/MoveMagnifier';
-import { addRoad } from './Controls/AddRoad';
-import { addCrossRoad } from './Controls/AddCrossRoad';
-import { addLine } from './Controls/AddLine';
-import { addPoint } from './Controls/AddPoint';
-import { addCircle } from './Controls/AddCircle';
-import { addText } from './Controls/AddText';
-import { addMagnifier } from './Controls/AddMagnifier';
-import { addSVG } from './Controls/AddSVG';
-import { moveRoad } from './Controls/MoveRoad';
-import { moveLine } from './Controls/MoveLine';
-import { movePoint } from './Controls/MovePoint';
-import { moveCircle } from './Controls/MoveCircle';
-import { coordinate } from './Coordinate';
-import Render from './Renderer/Render';
-import { draw } from './Renderer/Draw';
-import { listenLayer } from './ListenLayer';
-import LayerEvents from './enum/LayerEvents.js';
-import UIEvents from './enum/UIEvents.js';
-import SelectState from './enum/SelectState.js';
-import VectorType from './enum/VectorType';
-import { mathUtil } from './Util/MathUtil';
-import History from './History/History';
-import mitt from 'mitt';
-import { roadService } from './Service/RoadService';
-import { edgeService } from './Service/EdgeService';
-import { roadPointService } from './Service/RoadPointService';
-import { curveRoadService } from './Service/CurveRoadService';
-import VectorCategory from './enum/VectorCategory';
-import Settings from './Settings';
-import Constant from './Constant';
-import { uiService } from './Service/UIService';
-import { imageService } from './Service/ImageService';
-import VectorEvents from './enum/VectorEvents';
-import { lineService } from './Service/LineService';
+import Load from "./Load";
+import { stateService } from "./Service/StateService";
+import { elementService } from "./Service/ElementService";
+import { dataService } from "./Service/DataService";
+import { textService } from "./Service/TextService";
+import { historyService } from "./Service/HistoryService";
+import UIControl from "./Controls/UIControl";
+import { locationModeControl } from "./Controls/LocationModeControl";
+import { moveText } from "./Controls/MoveText";
+import { moveSVG } from "./Controls/MoveSVG";
+import { moveMagnifier } from "./Controls/MoveMagnifier";
+import { addRoad } from "./Controls/AddRoad";
+import { addCrossRoad } from "./Controls/AddCrossRoad";
+import { addLine } from "./Controls/AddLine";
+import { addPoint } from "./Controls/AddPoint";
+import { addCircle } from "./Controls/AddCircle";
+import { addText } from "./Controls/AddText";
+import { addMagnifier } from "./Controls/AddMagnifier";
+import { addSVG } from "./Controls/AddSVG";
+import { moveRoad } from "./Controls/MoveRoad";
+import { moveLine } from "./Controls/MoveLine";
+import { movePoint } from "./Controls/MovePoint";
+import { moveCircle } from "./Controls/MoveCircle";
+import { coordinate } from "./Coordinate";
+import Render from "./Renderer/Render";
+import { draw } from "./Renderer/Draw";
+import { listenLayer } from "./ListenLayer";
+import LayerEvents from "./enum/LayerEvents.js";
+import UIEvents from "./enum/UIEvents.js";
+import SelectState from "./enum/SelectState.js";
+import VectorType from "./enum/VectorType";
+import { mathUtil } from "./Util/MathUtil";
+import History from "./History/History";
+import mitt from "mitt";
+import { roadService } from "./Service/RoadService";
+import { edgeService } from "./Service/EdgeService";
+import { roadPointService } from "./Service/RoadPointService";
+import { curveRoadService } from "./Service/CurveRoadService";
+import VectorCategory from "./enum/VectorCategory";
+import Settings from "./Settings";
+import Constant from "./Constant";
+import { uiService } from "./Service/UIService";
+import { imageService } from "./Service/ImageService";
+import VectorEvents from "./enum/VectorEvents";
+import { lineService } from "./Service/LineService";
 
 const minDragDis = 10;
 const minZoom = 20;
@@ -77,24 +77,25 @@ export default class Layer {
   }
 
   bindEvents() {
-    this.canvas.addEventListener('contextmenu', function (e) {
+    this.canvas.addEventListener("contextmenu", function (e) {
       e.preventDefault();
     });
-    this.canvas.addEventListener('mousedown', this.onMouseDown.bind(this));
-    this.canvas.addEventListener('mousemove', this.onMouseMove.bind(this));
-    this.canvas.addEventListener('mouseup', this.onMouseUp.bind(this));
+    this.canvas.addEventListener("mousedown", this.onMouseDown.bind(this));
+    this.canvas.addEventListener("mousemove", this.onMouseMove.bind(this));
+    this.canvas.addEventListener("mouseup", this.onMouseUp.bind(this));
 
-    this.canvas.addEventListener('touchstart', this.onMouseDown.bind(this));
-    this.canvas.addEventListener('touchmove', this.onMouseMove.bind(this));
-    this.canvas.addEventListener('touchend', this.onMouseUp.bind(this));
+    this.canvas.addEventListener("touchstart", this.onMouseDown.bind(this));
+    this.canvas.addEventListener("touchmove", this.onMouseMove.bind(this));
+    this.canvas.addEventListener("touchend", this.onMouseUp.bind(this));
 
-    this.canvas.addEventListener('mousewheel', this.onWheel.bind(this));
-    this.canvas.addEventListener('DOMMouseScroll', this.onWheel.bind(this));
-    this.canvas.addEventListener('resize', this.reSize.bind(this));
+    this.canvas.addEventListener("mousewheel", this.onWheel.bind(this));
+    this.canvas.addEventListener("DOMMouseScroll", this.onWheel.bind(this));
+    this.canvas.addEventListener("resize", this.reSize.bind(this));
+    document.addEventListener("keydown", this.onKeydown.bind(this));
   }
 
   reSize = function () {
-    console.log('resize');
+    console.log("resize");
     coordinate.updateForCanvas();
     this.renderer.autoRedraw();
   };
@@ -130,16 +131,16 @@ export default class Layer {
     let selectItem = stateService.getSelectItem();
     let focusItem = stateService.getFocusItem();
 
-    this.setEventName('mouseDown');
+    this.setEventName("mouseDown");
     const eventName = stateService.getEventName();
     switch (eventName) {
       case LayerEvents.AddRoad:
         stateService.setEventName(LayerEvents.AddingRoad);
-        addRoad.setNewRoadPoint('start', position);
+        addRoad.setNewRoadPoint("start", position);
         break;
       case LayerEvents.AddCurveRoad:
         stateService.setEventName(LayerEvents.AddingCurveRoad);
-        addRoad.setNewRoadPoint('start', position);
+        addRoad.setNewRoadPoint("start", position);
         break;
       case LayerEvents.AddLine:
         stateService.setEventName(LayerEvents.AddingLine);
@@ -151,16 +152,20 @@ export default class Layer {
       //   break;
       case LayerEvents.AddPoint:
         stateService.setEventName(LayerEvents.MovePoint);
-        const newPoint = addPoint.buildPoint(position);
+        const newPoint = addPoint.buildPoint2(position);
         if (newPoint) {
-          stateService.setSelectItem(newPoint.vectorId, VectorType.Point, SelectState.Select);
+          stateService.setSelectItem(
+            newPoint.vectorId,
+            VectorType.Point,
+            SelectState.Select
+          );
           this.history.save();
           this.renderer.autoRedraw();
         } else {
           if (Settings.basePointIds.length > 1) {
-            this.uiControl.prompt({ msg: '请先选择基准点', time: 1000 });
+            this.uiControl.prompt({ msg: "请先选择基准点", time: 1000 });
           } else {
-            this.uiControl.prompt({ msg: '请先添加基准点', time: 1000 });
+            this.uiControl.prompt({ msg: "请先添加基准点", time: 1000 });
           }
 
           // this.uiControl.prompt({ msg: '请先选择基准点', time: 1000 });
@@ -174,7 +179,11 @@ export default class Layer {
       case LayerEvents.AddText:
         stateService.setEventName(LayerEvents.MoveText);
         addText.buildText(position);
-        stateService.setSelectItem(addText.newText.vectorId, VectorType.Text, SelectState.Select);
+        stateService.setSelectItem(
+          addText.newText.vectorId,
+          VectorType.Text,
+          SelectState.Select
+        );
         addText.clear();
         break;
       case LayerEvents.AddSVG:
@@ -188,7 +197,11 @@ export default class Layer {
       case LayerEvents.AddMagnifier:
         stateService.setEventName(LayerEvents.MoveMagnifier);
         addMagnifier.buildMagnifier(position);
-        stateService.setSelectItem(addMagnifier.newMagnifier.vectorId, VectorType.Magnifier, SelectState.Select);
+        stateService.setSelectItem(
+          addMagnifier.newMagnifier.vectorId,
+          VectorType.Magnifier,
+          SelectState.Select
+        );
         addMagnifier.clear();
         break;
       case VectorEvents.AddLane:
@@ -196,18 +209,34 @@ export default class Layer {
           let road = dataService.getRoad(selectItem.vectorId);
           if (road) {
             let roadLanCount = road.getLanesCount(selectItem.dir);
-            if (selectItem.dir == 'left') {
-              roadService.updateForAddSubtractLanesCount(road.vectorId, roadLanCount + 1, selectItem.dir);
+            if (selectItem.dir == "left") {
+              roadService.updateForAddSubtractLanesCount(
+                road.vectorId,
+                roadLanCount + 1,
+                selectItem.dir
+              );
             } else {
-              roadService.updateForAddSubtractLanesCount(road.vectorId, roadLanCount + 1, selectItem.dir);
+              roadService.updateForAddSubtractLanesCount(
+                road.vectorId,
+                roadLanCount + 1,
+                selectItem.dir
+              );
             }
           } else {
             road = dataService.getCurveRoad(selectItem.vectorId);
             let curveRoadLanCount = road.getLanesCount(selectItem.dir);
-            if (selectItem.dir == 'left') {
-              curveRoadService.updateForAddSubtractLanesCount(road.vectorId, curveRoadLanCount + 1, selectItem.dir);
+            if (selectItem.dir == "left") {
+              curveRoadService.updateForAddSubtractLanesCount(
+                road.vectorId,
+                curveRoadLanCount + 1,
+                selectItem.dir
+              );
             } else {
-              curveRoadService.updateForAddSubtractLanesCount(road.vectorId, curveRoadLanCount + 1, selectItem.dir);
+              curveRoadService.updateForAddSubtractLanesCount(
+                road.vectorId,
+                curveRoadLanCount + 1,
+                selectItem.dir
+              );
             }
           }
           stateService.clearEventName();
@@ -220,18 +249,34 @@ export default class Layer {
           let road = dataService.getRoad(selectItem.vectorId);
           if (road) {
             let roadLanCount = road.getLanesCount(selectItem.dir);
-            if (selectItem.dir == 'left') {
-              roadService.updateForAddSubtractLanesCount(road.vectorId, roadLanCount - 1, selectItem.dir);
+            if (selectItem.dir == "left") {
+              roadService.updateForAddSubtractLanesCount(
+                road.vectorId,
+                roadLanCount - 1,
+                selectItem.dir
+              );
             } else {
-              roadService.updateForAddSubtractLanesCount(road.vectorId, roadLanCount - 1, selectItem.dir);
+              roadService.updateForAddSubtractLanesCount(
+                road.vectorId,
+                roadLanCount - 1,
+                selectItem.dir
+              );
             }
           } else {
             road = dataService.getCurveRoad(selectItem.vectorId);
             let curveRoadLanCount = road.getLanesCount(selectItem.dir);
-            if (selectItem.dir == 'left') {
-              curveRoadService.updateForAddSubtractLanesCount(road.vectorId, curveRoadLanCount - 1, selectItem.dir);
+            if (selectItem.dir == "left") {
+              curveRoadService.updateForAddSubtractLanesCount(
+                road.vectorId,
+                curveRoadLanCount - 1,
+                selectItem.dir
+              );
             } else {
-              curveRoadService.updateForAddSubtractLanesCount(road.vectorId, curveRoadLanCount - 1, selectItem.dir);
+              curveRoadService.updateForAddSubtractLanesCount(
+                road.vectorId,
+                curveRoadLanCount - 1,
+                selectItem.dir
+              );
             }
           }
           stateService.clearEventName();
@@ -243,12 +288,18 @@ export default class Layer {
         if (focusItem && focusItem.vectorId) {
           if (focusItem.type == VectorType.CurveRoad) {
             const curveRoad = dataService.getCurveRoad(focusItem.vectorId);
-            let index = mathUtil.getIndexForCurvesPoints(position, curveRoad.points);
+            let index = mathUtil.getIndexForCurvesPoints(
+              position,
+              curveRoad.points
+            );
             if (index != -1) {
               curveRoadService.addCPoint(curveRoad, position, index);
             } else {
               const dis1 = mathUtil.getDistance(curveRoad.points[0], position);
-              const dis2 = mathUtil.getDistance(curveRoad.points[curveRoad.points.length - 1], position);
+              const dis2 = mathUtil.getDistance(
+                curveRoad.points[curveRoad.points.length - 1],
+                position
+              );
               if (dis1 > dis2) {
                 index = curveRoad.points.length - 2;
               } else {
@@ -273,12 +324,18 @@ export default class Layer {
             curveLine.setWeight(weight);
           } else if (focusItem.type == VectorType.CurveLine) {
             let curveLine = dataService.getCurveLine(focusItem.vectorId);
-            let index = mathUtil.getIndexForCurvesPoints(position, curveLine.points);
+            let index = mathUtil.getIndexForCurvesPoints(
+              position,
+              curveLine.points
+            );
             if (index != -1) {
               lineService.addCPoint(position, index, focusItem.vectorId);
             } else {
               const dis1 = mathUtil.getDistance(curveLine.points[0], position);
-              const dis2 = mathUtil.getDistance(curveLine.points[curveLine.points.length - 1], position);
+              const dis2 = mathUtil.getDistance(
+                curveLine.points[curveLine.points.length - 1],
+                position
+              );
               if (dis1 > dis2) {
                 index = curveLine.points.length - 2;
               } else {
@@ -369,14 +426,24 @@ export default class Layer {
       y: position.y,
     };
     const eventName = stateService.getEventName();
-    if (!this.dragging && Math.abs(X - this.startX) < minDragDis && Math.abs(Y - this.startY) < minDragDis) {
+    if (
+      !this.dragging &&
+      Math.abs(X - this.startX) < minDragDis &&
+      Math.abs(Y - this.startY) < minDragDis
+    ) {
       return;
     }
     this.dragging = true;
-    if (Math.abs(X - this.startX) > minDragDis || Math.abs(Y - this.startY) > minDragDis) {
+    if (
+      Math.abs(X - this.startX) > minDragDis ||
+      Math.abs(Y - this.startY) > minDragDis
+    ) {
       // 是否拖拽了
       if (eventName != null) {
-        if (eventName == LayerEvents.MoveMagnifier && stateService.getSelectItem().state != 0) {
+        if (
+          eventName == LayerEvents.MoveMagnifier &&
+          stateService.getSelectItem().state != 0
+        ) {
         } else {
           stateService.clearFocusItem();
           this.uiControl.focusVector = null;
@@ -397,15 +464,17 @@ export default class Layer {
         needAutoRedraw = listenLayer.start(position);
         let seleteItem = stateService.getSelectItem();
         if (seleteItem != null) {
-          console.log('选中：' + seleteItem.vectorId);
+          console.log("选中：" + seleteItem.vectorId);
         } else {
         }
         break;
       case LayerEvents.PanBackGround:
         stateService.clearItems();
         let center = {};
-        center.x = coordinate.center.x - (dx * coordinate.defaultZoom) / coordinate.zoom;
-        center.y = coordinate.center.y + (dy * coordinate.defaultZoom) / coordinate.zoom;
+        center.x =
+          coordinate.center.x - (dx * coordinate.defaultZoom) / coordinate.zoom;
+        center.y =
+          coordinate.center.y + (dy * coordinate.defaultZoom) / coordinate.zoom;
         let tempCenter = {};
         mathUtil.clonePoint(tempCenter, coordinate.center);
         mathUtil.clonePoint(coordinate.center, center);
@@ -500,12 +569,12 @@ export default class Layer {
         elementService.setNewRoad(addRoad.startInfo.position, position);
         elementService.showNewRoad();
 
-        addRoad.setNewRoadPoint('end', position);
+        addRoad.setNewRoadPoint("end", position);
         addRoad.canAdd = addRoad.canAddRoadForEnd(position);
         if (!addRoad.canAdd) {
-          elementService.setNewRoadState('error');
+          elementService.setNewRoadState("error");
         } else {
-          elementService.setNewRoadState('normal');
+          elementService.setNewRoadState("normal");
         }
         elementService.showPoint();
         this.showElementLine(position, eventName);
@@ -599,9 +668,16 @@ export default class Layer {
         let road = dataService.getRoad(draggingItem.vectorId);
         let start = dataService.getRoadPoint(road.startId);
         let end = dataService.getRoadPoint(road.endId);
-        if (Object.keys(start.getParent()).length == 1 && Object.keys(end.getParent()).length == 1) {
+        if (
+          Object.keys(start.getParent()).length == 1 &&
+          Object.keys(end.getParent()).length == 1
+        ) {
           //拖拽的路只有一条
-          moveRoad.moveRoad(draggingItem.vectorId, (dx * coordinate.defaultZoom) / coordinate.zoom, (dy * coordinate.defaultZoom) / coordinate.zoom);
+          moveRoad.moveRoad(
+            draggingItem.vectorId,
+            (dx * coordinate.defaultZoom) / coordinate.zoom,
+            (dy * coordinate.defaultZoom) / coordinate.zoom
+          );
         }
         break;
       case LayerEvents.MoveRoadPoint:
@@ -612,7 +688,10 @@ export default class Layer {
         });
         if (
           listenLayer.modifyPoint &&
-          (listenLayer.modifyPoint.linkedRoadPointId || listenLayer.modifyPoint.linkedRoadId || listenLayer.modifyPoint.linkedRoadPointIdX || listenLayer.modifyPoint.linkedRoadPointIdY)
+          (listenLayer.modifyPoint.linkedRoadPointId ||
+            listenLayer.modifyPoint.linkedRoadId ||
+            listenLayer.modifyPoint.linkedRoadPointIdX ||
+            listenLayer.modifyPoint.linkedRoadPointIdY)
         ) {
           position = {
             x: listenLayer.modifyPoint.x,
@@ -622,7 +701,11 @@ export default class Layer {
           listenLayer.modifyPoint = null;
         }
 
-        let flag = moveRoad.moveingRoadPoint(draggingItem.vectorId, position, listenLayer.modifyPoint);
+        let flag = moveRoad.moveingRoadPoint(
+          draggingItem.vectorId,
+          position,
+          listenLayer.modifyPoint
+        );
         if (!flag) {
           elementService.hideAll();
         } else {
@@ -658,19 +741,23 @@ export default class Layer {
         elementService.setNewRoad(addRoad.startInfo.position, position);
         elementService.showNewRoad();
 
-        addRoad.setNewRoadPoint('end', position);
+        addRoad.setNewRoadPoint("end", position);
         addRoad.canAdd = addRoad.canAddRoadForEnd(position);
         if (!addRoad.canAdd) {
-          elementService.setNewRoadState('error');
+          elementService.setNewRoadState("error");
         } else {
-          elementService.setNewRoadState('normal');
+          elementService.setNewRoadState("normal");
         }
         elementService.showPoint();
         this.showElementLine(position, eventName);
         break;
       case LayerEvents.MoveCurveRoad:
         needAutoRedraw = true;
-        moveRoad.moveCurveRoad(draggingItem.vectorId, (dx * coordinate.defaultZoom) / coordinate.zoom, (dy * coordinate.defaultZoom) / coordinate.zoom);
+        moveRoad.moveCurveRoad(
+          draggingItem.vectorId,
+          (dx * coordinate.defaultZoom) / coordinate.zoom,
+          (dy * coordinate.defaultZoom) / coordinate.zoom
+        );
         break;
       case LayerEvents.MoveCurveRoadPoint:
         if (!draggingItem || !draggingItem.vectorId) {
@@ -713,13 +800,21 @@ export default class Layer {
         break;
       case LayerEvents.MoveCurveEdge:
         if (listenLayer.modifyPoint) {
-          moveRoad.moveCurveEdge(draggingItem.vectorId, listenLayer.modifyPoint.selectIndex, position);
+          moveRoad.moveCurveEdge(
+            draggingItem.vectorId,
+            listenLayer.modifyPoint.selectIndex,
+            position
+          );
         }
         needAutoRedraw = true;
         break;
       case LayerEvents.MoveLine:
         if (draggingItem != null) {
-          let flag = moveLine.moveLine(draggingItem.vectorId, (dx * coordinate.defaultZoom) / coordinate.zoom, (dy * coordinate.defaultZoom) / coordinate.zoom);
+          let flag = moveLine.moveLine(
+            draggingItem.vectorId,
+            (dx * coordinate.defaultZoom) / coordinate.zoom,
+            (dy * coordinate.defaultZoom) / coordinate.zoom
+          );
           if (!flag) {
             this.lastX = this.lastX - dx / coordinate.ratio;
             this.lastY = this.lastY - dy / coordinate.ratio;
@@ -735,9 +830,12 @@ export default class Layer {
             exceptLineId: point.parent,
           });
 
-
           // if (listenLayer.modifyPoint) {  //原本是这样的，不知用途，下面修改为了修复拖动点经过放大镜导致NaN或者错位
-          if (listenLayer.modifyPoint && listenLayer.modifyPoint.x && listenLayer.modifyPoint.y) {
+          if (
+            listenLayer.modifyPoint &&
+            listenLayer.modifyPoint.x &&
+            listenLayer.modifyPoint.y
+          ) {
             position = {
               x: listenLayer.modifyPoint.x,
               y: listenLayer.modifyPoint.y,
@@ -775,16 +873,33 @@ export default class Layer {
         break;
       case LayerEvents.MoveCurveLine:
         if (draggingItem != null) {
-          moveLine.moveCurveLine(draggingItem.vectorId, (dx * coordinate.defaultZoom) / coordinate.zoom, (dy * coordinate.defaultZoom) / coordinate.zoom);
+          moveLine.moveCurveLine(
+            draggingItem.vectorId,
+            (dx * coordinate.defaultZoom) / coordinate.zoom,
+            (dy * coordinate.defaultZoom) / coordinate.zoom
+          );
           needAutoRedraw = true;
         }
         break;
       case LayerEvents.MoveCircle:
         if (draggingItem != null) {
           if (draggingItem.state == -1) {
-            moveCircle.moveFull(draggingItem.vectorId, (dx * coordinate.defaultZoom) / coordinate.zoom, (dy * coordinate.defaultZoom) / coordinate.zoom);
-          } else if (draggingItem.state == 0 || draggingItem.state == 1 || draggingItem.state == 2 || draggingItem.state == 3) {
-            moveCircle.movePoint(position, draggingItem.vectorId, draggingItem.state);
+            moveCircle.moveFull(
+              draggingItem.vectorId,
+              (dx * coordinate.defaultZoom) / coordinate.zoom,
+              (dy * coordinate.defaultZoom) / coordinate.zoom
+            );
+          } else if (
+            draggingItem.state == 0 ||
+            draggingItem.state == 1 ||
+            draggingItem.state == 2 ||
+            draggingItem.state == 3
+          ) {
+            moveCircle.movePoint(
+              position,
+              draggingItem.vectorId,
+              draggingItem.state
+            );
           } else {
             debugger;
           }
@@ -803,14 +918,22 @@ export default class Layer {
           if (draggingItem.state == -1) {
             moveSVG.moveFullSVG(position, draggingItem.vectorId);
           } else {
-            moveSVG.movePoint(position, draggingItem.vectorId, draggingItem.state);
+            moveSVG.movePoint(
+              position,
+              draggingItem.vectorId,
+              draggingItem.state
+            );
           }
         }
         break;
       case LayerEvents.MoveMagnifier:
         needAutoRedraw = true;
         if (draggingItem != null) {
-          moveMagnifier.moveFullMagnifier(position, draggingItem.vectorId, draggingItem.state);
+          moveMagnifier.moveFullMagnifier(
+            position,
+            draggingItem.vectorId,
+            draggingItem.state
+          );
         }
         break;
     }
@@ -887,19 +1010,40 @@ export default class Layer {
             exceptRoadIds: point.parent,
           });
 
-          if (listenLayer.modifyPoint && listenLayer.modifyPoint.hasOwnProperty('linkedRoadPointId')) {
-            moveRoad.moveTo(draggingItem.vectorId, listenLayer.modifyPoint.linkedRoadPointId);
-          } else if (listenLayer.modifyPoint && (listenLayer.modifyPoint.linkedRoadPointIdX || listenLayer.modifyPoint.linkedRoadPointIdY)) {
+          if (
+            listenLayer.modifyPoint &&
+            listenLayer.modifyPoint.hasOwnProperty("linkedRoadPointId")
+          ) {
+            moveRoad.moveTo(
+              draggingItem.vectorId,
+              listenLayer.modifyPoint.linkedRoadPointId
+            );
+          } else if (
+            listenLayer.modifyPoint &&
+            (listenLayer.modifyPoint.linkedRoadPointIdX ||
+              listenLayer.modifyPoint.linkedRoadPointIdY)
+          ) {
             mathUtil.clonePoint(point, listenLayer.modifyPoint);
-          } else if (listenLayer.modifyPoint && listenLayer.modifyPoint.hasOwnProperty('linkedRoadId')) {
+          } else if (
+            listenLayer.modifyPoint &&
+            listenLayer.modifyPoint.hasOwnProperty("linkedRoadId")
+          ) {
             point = roadPointService.create({
               x: listenLayer.modifyPoint.x,
               y: listenLayer.modifyPoint.y,
             });
-            roadService.splitRoad(listenLayer.modifyPoint.linkedRoadId, point.vectorId, 'start');
+            roadService.splitRoad(
+              listenLayer.modifyPoint.linkedRoadId,
+              point.vectorId,
+              "start"
+            );
             moveRoad.moveTo(draggingItem.vectorId, point.vectorId);
           } else if (moveRoad.splitRoadId != null) {
-            roadService.splitRoad(moveRoad.splitRoadId, draggingItem.vectorId, 'start');
+            roadService.splitRoad(
+              moveRoad.splitRoadId,
+              draggingItem.vectorId,
+              "start"
+            );
           }
           //draggingItem.vectorId所在的墙面与其他墙角相交
           moveRoad.updateForAbsorbRoadPoints();
@@ -1038,8 +1182,11 @@ export default class Layer {
         break;
       case LayerEvents.AddPoint:
         if (
-          (Settings.selectBasePointId != null && (Settings.selectLocationMode == Constant.angleLocationMode || Settings.selectLocationMode == Constant.allLocationMode)) ||
-          (Settings.baseLineId != null && Settings.selectLocationMode == Constant.normalLocationMode)
+          (Settings.selectBasePointId != null &&
+            (Settings.selectLocationMode == Constant.angleLocationMode ||
+              Settings.selectLocationMode == Constant.allLocationMode)) ||
+          (Settings.baseLineId != null &&
+            Settings.selectLocationMode == Constant.normalLocationMode)
         ) {
           this.uiControl.showConfirm();
           needAutoRedraw = true;
@@ -1053,7 +1200,7 @@ export default class Layer {
         break;
     }
 
-    this.setEventName('mouseUp');
+    this.setEventName("mouseUp");
     stateService.clearDraggingItem();
     if (needAutoRedraw) {
       this.renderer.autoRedraw();
@@ -1063,9 +1210,11 @@ export default class Layer {
   onWheel(e) {
     e.preventDefault();
     const type = e.type;
-    if (type == 'DOMMouseScroll' || type == 'mousewheel') {
+    if (type == "DOMMouseScroll" || type == "mousewheel") {
       // 当在canvas用滚轮滚动时
-      const delta = e.wheelDelta ? (e.wheelDelta / 120) * 20 : (-(e.detail || 0) / 3) * 20;
+      const delta = e.wheelDelta
+        ? (e.wheelDelta / 120) * 20
+        : (-(e.detail || 0) / 3) * 20;
       const zoom = coordinate.zoom + delta;
       let X = e.offsetX || e.layerX;
       let Y = e.offsetY || e.layerY;
@@ -1102,7 +1251,7 @@ export default class Layer {
   setEventName(eventType) {
     let eventName = stateService.getEventName();
 
-    if (eventType == 'mouseDown') {
+    if (eventType == "mouseDown") {
       if (eventName == null) {
         const selectItem = stateService.getSelectItem();
         if (selectItem == null) {
@@ -1139,7 +1288,7 @@ export default class Layer {
           stateService.setEventName(LayerEvents.MoveSVG);
         }
       }
-    } else if (eventType == 'mouseUp') {
+    } else if (eventType == "mouseUp") {
       if (eventName == LayerEvents.AddingRoad) {
         if (Settings.isMobile) {
           stateService.clearEventName();
@@ -1171,8 +1320,11 @@ export default class Layer {
       } else if (
         (eventName == LayerEvents.AddPoint &&
           Settings.selectBasePointId != null &&
-          (Settings.selectLocationMode == Constant.angleLocationMode || Settings.selectLocationMode == Constant.allLocationMode)) ||
-        (eventName == LayerEvents.AddPoint && Settings.baseLineId != null && Settings.selectLocationMode == Constant.normalLocationMode)
+          (Settings.selectLocationMode == Constant.angleLocationMode ||
+            Settings.selectLocationMode == Constant.allLocationMode)) ||
+        (eventName == LayerEvents.AddPoint &&
+          Settings.baseLineId != null &&
+          Settings.selectLocationMode == Constant.normalLocationMode)
       ) {
       } else {
         stateService.clearEventName();
@@ -1189,7 +1341,10 @@ export default class Layer {
 
   stopAddVector() {
     let eventName = stateService.getEventName();
-    if (eventName != LayerEvents.AddingRoad && eventName != LayerEvents.AddingLine) {
+    if (
+      eventName != LayerEvents.AddingRoad &&
+      eventName != LayerEvents.AddingLine
+    ) {
       stateService.clearEventName();
     } else if (eventName == LayerEvents.AddingRoad) {
       stateService.setEventName(LayerEvents.AddRoad);
@@ -1327,23 +1482,57 @@ export default class Layer {
     let otherPoint1 = null;
     let otherPoint2 = null;
     if (listenLayer.modifyPoint && listenLayer.modifyPoint.linkedRoadPointIdX) {
-      otherPoint1 = dataService.getRoadPoint(listenLayer.modifyPoint.linkedRoadPointIdX);
-    } else if (listenLayer.modifyPoint && listenLayer.modifyPoint.linkedCurveRoadPointIdX) {
-      otherPoint1 = dataService.getCurveRoadPoint(listenLayer.modifyPoint.linkedCurvePointIdX);
-    } else if (listenLayer.modifyPoint && listenLayer.modifyPoint.linkedPointIdX) {
-      otherPoint1 = dataService.getPoint(listenLayer.modifyPoint.linkedPointIdX);
-    } else if (listenLayer.modifyPoint && listenLayer.modifyPoint.linkedCurvePointIdX) {
-      otherPoint1 = dataService.getCurvePoint(listenLayer.modifyPoint.linkedCurvePointIdX);
+      otherPoint1 = dataService.getRoadPoint(
+        listenLayer.modifyPoint.linkedRoadPointIdX
+      );
+    } else if (
+      listenLayer.modifyPoint &&
+      listenLayer.modifyPoint.linkedCurveRoadPointIdX
+    ) {
+      otherPoint1 = dataService.getCurveRoadPoint(
+        listenLayer.modifyPoint.linkedCurvePointIdX
+      );
+    } else if (
+      listenLayer.modifyPoint &&
+      listenLayer.modifyPoint.linkedPointIdX
+    ) {
+      otherPoint1 = dataService.getPoint(
+        listenLayer.modifyPoint.linkedPointIdX
+      );
+    } else if (
+      listenLayer.modifyPoint &&
+      listenLayer.modifyPoint.linkedCurvePointIdX
+    ) {
+      otherPoint1 = dataService.getCurvePoint(
+        listenLayer.modifyPoint.linkedCurvePointIdX
+      );
     }
 
     if (listenLayer.modifyPoint && listenLayer.modifyPoint.linkedRoadPointIdY) {
-      otherPoint2 = dataService.getRoadPoint(listenLayer.modifyPoint.linkedRoadPointIdY);
-    } else if (listenLayer.modifyPoint && listenLayer.modifyPoint.linkedCurvePointIdY) {
-      otherPoint2 = dataService.getCurveRoadPoint(listenLayer.modifyPoint.linkedCurvePointIdY);
-    } else if (listenLayer.modifyPoint && listenLayer.modifyPoint.linkedPointIdY) {
-      otherPoint2 = dataService.getPoint(listenLayer.modifyPoint.linkedPointIdY);
-    } else if (listenLayer.modifyPoint && listenLayer.modifyPoint.linkedCurvePointIdY) {
-      otherPoint2 = dataService.getCurvePoint(listenLayer.modifyPoint.linkedCurvePointIdY);
+      otherPoint2 = dataService.getRoadPoint(
+        listenLayer.modifyPoint.linkedRoadPointIdY
+      );
+    } else if (
+      listenLayer.modifyPoint &&
+      listenLayer.modifyPoint.linkedCurvePointIdY
+    ) {
+      otherPoint2 = dataService.getCurveRoadPoint(
+        listenLayer.modifyPoint.linkedCurvePointIdY
+      );
+    } else if (
+      listenLayer.modifyPoint &&
+      listenLayer.modifyPoint.linkedPointIdY
+    ) {
+      otherPoint2 = dataService.getPoint(
+        listenLayer.modifyPoint.linkedPointIdY
+      );
+    } else if (
+      listenLayer.modifyPoint &&
+      listenLayer.modifyPoint.linkedCurvePointIdY
+    ) {
+      otherPoint2 = dataService.getCurvePoint(
+        listenLayer.modifyPoint.linkedCurvePointIdY
+      );
     }
 
     let otherPoint = {};
@@ -1353,10 +1542,29 @@ export default class Layer {
     }
     if (otherPoint2) {
       otherPoint.y = otherPoint2.y;
-      if (!otherPoint.hasOwnProperty('x')) {
+      if (!otherPoint.hasOwnProperty("x")) {
         otherPoint.x = otherPoint2.x;
       }
     }
     elementService.execute(otherPoint, point);
   }
+
+  //测试用
+  onKeydown(e) {
+    let focusItem = stateService.getFocusItem();
+    if (focusItem) {
+      console.log("键盘(foucus有效)：" + e.code);
+      //添加固定点
+      if (e.code == "KeyQ") {
+        uiService.setSelectPointCategory(VectorCategory.Point.FixPoint);
+        stateService.setEventName(LayerEvents.AddPoint);
+      }
+      //一键测量
+      if (e.code == "KeyA") {
+        locationModeControl.setAngle();
+        this.renderer.autoRedraw();
+        this.history.save();
+      }
+    }
+  }
 }

src/graphic/ListenLayer.js

@@ -21,7 +21,7 @@ export default class ListenLayer {
 
   //开始监听，exceptVectorIds表示不考虑的元素
   /**
-   * 
+   *
    * @param exceptVectorIds：{
           exceptPointId,
           exceptLineId,
@@ -34,8 +34,8 @@ export default class ListenLayer {
           exceptCrossCrossPointId,
           exceptTextId,
           exceptSVGId,
-  }  
-   * @returns 
+  }
+   * @returns
    */
   start(position, exceptVectorIds) {
     let flag = false;
@@ -134,11 +134,19 @@ export default class ListenLayer {
           }
         }
       } else {
-        if (Math.abs(position.x - curvePoint.x) < Constant.minAdsorbPix) {
+        if (
+          (Math.abs(position.x - curvePoint.x) * coordinate.zoom) /
+            coordinate.defaultZoom <
+          Constant.minAdsorbPix
+        ) {
           seqInfo.linkedCurvePointIdX = curvePointId;
           seqInfo.x = curvePoint.x;
         }
-        if (Math.abs(position.y - curvePoint.y) < Constant.minAdsorbPix) {
+        if (
+          (Math.abs(position.y - curvePoint.y) * coordinate.zoom) /
+            coordinate.defaultZoom <
+          Constant.minAdsorbPix
+        ) {
           seqInfo.linkedPointIdY = curvePointId;
           seqInfo.y = curvePoint.y;
         }
@@ -250,11 +258,19 @@ export default class ListenLayer {
           }
         }
       } else {
-        if (Math.abs(position.x - point.x) < Constant.minAdsorbPix) {
+        if (
+          (Math.abs(position.x - point.x) * coordinate.zoom) /
+            coordinate.defaultZoom <
+          Constant.minAdsorbPix
+        ) {
           seqInfo.linkedPointIdX = pointId;
           seqInfo.x = point.x;
         }
-        if (Math.abs(position.y - point.y) < Constant.minAdsorbPix) {
+        if (
+          (Math.abs(position.y - point.y) * coordinate.zoom) /
+            coordinate.defaultZoom <
+          Constant.minAdsorbPix
+        ) {
           seqInfo.linkedPointIdY = pointId;
           seqInfo.y = point.y;
         }
@@ -439,10 +455,18 @@ export default class ListenLayer {
           }
         }
       } else {
-        if (Math.abs(position.x - roadPoint.x) < Constant.minAdsorbPix) {
+        if (
+          (Math.abs(position.x - roadPoint.x) * coordinate.zoom) /
+            coordinate.defaultZoom <
+          Constant.minAdsorbPix
+        ) {
           seqInfo.linkedRoadPointIdX = roadPointId;
           seqInfo.x = roadPoint.x;
-        } else if (Math.abs(position.y - roadPoint.y) < Constant.minAdsorbPix) {
+        } else if (
+          (Math.abs(position.y - roadPoint.y) * coordinate.zoom) /
+            coordinate.defaultZoom <
+          Constant.minAdsorbPix
+        ) {
           seqInfo.linkedRoadPointIdY = roadPointId;
           seqInfo.y = roadPoint.y;
         }
@@ -514,11 +538,17 @@ export default class ListenLayer {
           }
         }
       } else {
-        if (Math.abs(position.x - curveRoadPoint.x) < Constant.minAdsorbPix) {
+        if (
+          (Math.abs(position.x - curveRoadPoint.x) * coordinate.zoom) /
+            coordinate.defaultZoom <
+          Constant.minAdsorbPix
+        ) {
           seqInfo.linkedCurveRoadPointIdX = curveRoadPointId;
           seqInfo.x = curveRoadPoint.x;
         } else if (
-          Math.abs(position.y - curveRoadPoint.y) < Constant.minAdsorbPix
+          (Math.abs(position.y - curveRoadPoint.y) * coordinate.zoom) /
+            coordinate.defaultZoom <
+          Constant.minAdsorbPix
         ) {
           seqInfo.linkedCurveRoadPointIdY = curveRoadPointId;
           seqInfo.y = curveRoadPoint.y;
@@ -727,7 +757,8 @@ export default class ListenLayer {
       let joinInfo = this.distanceForBezier(
         position,
         curveRoad.curves,
-        Constant.minAdsorbPix
+        //Constant.minAdsorbPix
+        Math.max(curveRoad.leftWidth, curveRoad.rightWidth)
       );
 
       //检查edge
@@ -965,8 +996,8 @@ export default class ListenLayer {
     return magnifierInfo;
   }
   /**
-    * 
-    * @param info:{ 
+    *
+    * @param info:{
         roadPointInfo,
         curveRoadPointInfo,
         roadEdgeInfo,
@@ -974,7 +1005,7 @@ export default class ListenLayer {
         crossPointInfo,
         pointInfo,
         roadPointInfo
-      }  
+      }
     */
   setModifyPoint(position, info) {
     //优先级最高
@@ -1322,7 +1353,9 @@ export default class ListenLayer {
   }
 
   distanceForBezier(position, curves, width) {
-    return mathUtil.getHitInfoForCurves(position, curves, width);
+
+    const data = mathUtil.getHitInfoForCurves(position, curves, width);
+    return data
   }
 
   equalAndClone(info1, info2) {
@@ -1337,6 +1370,7 @@ export default class ListenLayer {
     return flag;
   }
 
+  //调整到与像素的长度一致
   getDistance(start, end) {
     return (
       (mathUtil.getDistance(start, end) * coordinate.zoom) /

src/graphic/Load.js

@@ -15,7 +15,7 @@ import { textService } from "./Service/TextService.js";
 import { svgService } from "./Service/SVGService.js";
 import { mathUtil } from "./Util/MathUtil.js";
 import { historyService } from "./Service/HistoryService.js";
-
+import { uiService } from "./Service/UIService";
 export default class Load {
   constructor(layer) {
     this.layer = layer;
@@ -71,9 +71,9 @@ export default class Load {
           );
           magnifier.setSrc(dataLocal.magnifiers[key].photoUrl);
           magnifier.setDisplay(dataLocal.magnifiers[key].display);
-     
+
           magnifier.setPopPosition(null,dataLocal.magnifiers[key].popPosition)
-      
+
           try {
             if (dataLocal.magnifiers[key].photoUrl) {
               await magnifier.setImageData();
@@ -149,6 +149,52 @@ export default class Load {
           }
         }
       }
+      // if (dataLocal.curvelines) {
+      //   for (let key in dataLocal.curvelines) {
+      //     let startPointId = dataLocal.curvelines[key].startId
+      //     let endPointId = dataLocal.curvelines[key].endId
+
+      //     let startPosition = null;
+      //     let endPosition = null ;
+      //     if(dataLocal.curvePoints){
+      //       startPosition ={ 
+      //         x:dataLocal.curvePoints[startPointId].x,
+      //         y:dataLocal.curvePoints[startPointId].y,
+      //       }
+      //       endPosition ={ 
+      //         x:dataLocal.curvePoints[endPointId].x,
+      //         y:dataLocal.curvePoints[endPointId].y,
+      //       }
+
+      //     }
+         
+      //     let curveline = lineService.createCurveLine(
+      //       startPosition,
+      //       endPosition,
+      //       dataLocal.curvelines[key].vectorId,
+      //     );
+
+      //     if (dataLocal.curvelines[key].style) {
+      //       curveline.setStyle(dataLocal.curvelines[key].style);
+      //     }
+      //     if (dataLocal.curvelines[key].weight) {
+      //       curveline.setWeight(dataLocal.curvelines[key].weight);
+      //     }
+      //     if (dataLocal.curvelines[key].color) {
+      //       curveline.setColor(dataLocal.curvelines[key].color);
+      //     }
+      //     if (dataLocal.curvelines[key].value) {
+      //       curveline.setValue(dataLocal.curvelines[key].value);
+      //     }
+      //     if (dataLocal.curvelines[key].locationMode) {
+      //       curveline.setLocationMode(dataLocal.curvelines[key].locationMode);
+      //     }
+      //     curveline.setDisplay(dataLocal.curvelines[key].display);
+      //     if (curveline.getCategory() == VectorCategory.Line.BaseLine) {
+      //       Settings.baseLineId = key;
+      //     }
+      //   }
+      // }
       if(dataLocal.roadPoints){
 
         for (let key in dataLocal.roadPoints) {
@@ -160,21 +206,19 @@ export default class Load {
       }
       if(dataLocal.roads){
         for (let key in dataLocal.roads) {
+          uiService.setWayType(dataLocal.roads[key].way);
+          uiService.setSingleRoadDrivewayCount( dataLocal.roads[key].singleRoadDrivewayCount)
           let road = roadService.create(
             dataLocal.roads[key].startId,
             dataLocal.roads[key].endId,
             dataLocal.roads[key].vectorId,
           );
-          let leftEdge =null
-          let rightEdge =null
-          if(dataLocal.roadEdges){
+          if(dataLocal.roadEdges){ //当roadEdge有样式的时候需要设置
             for(let edgeKey in dataLocal.roadEdges){
               let roadId = dataLocal.roadEdges[edgeKey].parent
-            
-              if(roadId== key ){
-
+              if(roadId == key ){
                 for(let roadKey in dataLocal.roads[key]){
-                  if( roadKey == 'leftEdgeId' && dataLocal.roads[key][roadKey] ==dataLocal.roadEdges[edgeKey].vectorId){
+                  if( roadKey == 'leftEdgeId' && dataLocal.roads[key][roadKey] == dataLocal.roadEdges[edgeKey].vectorId){
                     let leftEdge = dataService.getRoadEdge(road.leftEdgeId);
                     if(dataLocal.roadEdges[edgeKey].style){
                       leftEdge.setStyle(dataLocal.roadEdges[edgeKey].style)
@@ -182,9 +226,7 @@ export default class Load {
                     if(dataLocal.roadEdges[edgeKey].weight){
                       leftEdge.setWeight(dataLocal.roadEdges[edgeKey].weight)
                     }
-
-
-                  }else if(roadKey == 'rightEdgeId' && dataLocal.roads[key][roadKey] ==dataLocal.roadEdges[edgeKey].vectorId){
+                  }else if(roadKey == 'rightEdgeId' && dataLocal.roads[key][roadKey] == dataLocal.roadEdges[edgeKey].vectorId){
                     let rightEdge = dataService.getRoadEdge(road.rightEdgeId);
                     if(dataLocal.roadEdges[edgeKey].style){
                       rightEdge.setStyle(dataLocal.roadEdges[edgeKey].style)
@@ -194,12 +236,9 @@ export default class Load {
                     }
                   }
                 }
-            
               }
-            
             }
           }
-        
         }
       }
       if(dataLocal.curveRoadPoints){
@@ -212,11 +251,14 @@ export default class Load {
       }
       if(dataLocal.curveRoads){
         for (let key in dataLocal.curveRoads) {
+          console.log(dataLocal.curveRoads[key].points)
+          console.log(mathUtil.getCurvesByPoints(dataLocal.curveRoads[key].points, 0.2))
           let curveRoad = curveRoadService.create(
             dataLocal.curveRoads[key].startId,
             dataLocal.curveRoads[key].endId,
             dataLocal.curveRoads[key].vectorId,
           );
+    
         }
       }
       if (dataLocal.texts) {
@@ -286,7 +328,9 @@ export default class Load {
               this.getXY(width, height, data3d.measures[i].pos[1]),
               VectorCategory.Line.MeasureLine
             );
-            line.value = data3d.measures[i].dis;
+            if(data3d.measures[i].dis){
+              line.value = data3d.measures[i].dis;
+            }
           }
         }
         if (data3d.basePoints) {
@@ -343,6 +387,7 @@ export default class Load {
 
     const scale = res / (coordinate.zoom / coordinate.defaultZoom);
     dataService.setScale(scale);
+    console.log({...dataService.vectorData,Settings})
     return {...dataService.vectorData,Settings};
   }
 

src/graphic/Renderer/Draw.js

@@ -248,6 +248,7 @@ const help = {
       // 单实线
       case VectorStyle.DoubleDashedLine:
       case VectorStyle.DoubleSolidLine:
+        ctx.lineWidth = lineWidth;
         if (style === VectorStyle.DoubleDashedLine) {
           ctx.setLineDash([8 * coordinate.ratio, 8 * coordinate.ratio]);
         }
@@ -409,6 +410,11 @@ export default class Draw {
     const height = help.getReal(img.height);
     const center = coordinate.getScreenXY(vector.center);
     this.context.save();
+    if (vector.scale) {
+      this.context.translate(center.x, center.y)
+      this.context.scale(vector.scale, vector.scale)
+      this.context.translate(-center.x, -center.y)
+    }
     this.context.drawImage(
       img,
       center.x - width / 2,
@@ -668,6 +674,16 @@ export default class Draw {
       for (let coves of midCovesArray) {
         help.drawCoves(ctx, coves);
       }
+
+
+      midCovesArray = help.transformCoves([
+        vector.curves,
+      ]);
+      ctx.strokeStyle = 'red'
+      for (let coves of midCovesArray) {
+        help.drawCoves(ctx, coves);
+      }
+
     }
     ctx.restore();
 
@@ -1095,9 +1111,11 @@ export default class Draw {
     this.context.translate(points[0].x, points[0].y);
     this.context.rotate(angle);
     this.context.scale(width / svgWidth, height / svgHidth);
-    const [style, label] = help.setVectorStyle(this.context, vector);
+    const [style, label] = help.getVectorStyle(vector);
     this.context.lineWidth = style.lineWidth / (width / svgWidth);
-    SVGIcons[vector.type].draw(this.context, style.fillStyle, style.strokeStyle);
+    this.context.fillStyle = 'rgba(0,0,0,0)'
+    this.context.strokeStyle = 'rgba(0,0,0,0)'
+    SVGIcons[vector.type].draw(this.context, style.fillStyle || 'rgba(0,0,0,0)', style.strokeStyle || 'rgba(0,0,0,0)');
     this.context.restore();
 
     if (label) {
@@ -1199,9 +1217,9 @@ export default class Draw {
     });
     ctx.restore();
 
-    if (import.meta.env.DEV) {
+    // if (import.meta.env.DEV) {
       vector.points.forEach(this.drawPoint.bind(this));
-    }
+    // }
   }
 
   drawLine(vector) {

src/graphic/Service/CurveRoadService.js

@@ -25,7 +25,7 @@ export default class CurveRoadService extends RoadService {
     startPoint.setIndex(0);
     let endPoint = dataService.getCurveRoadPoint(endId);
     endPoint.setPointParent(curveRoad.vectorId);
-    endPoint.setIndex(2);
+    endPoint.setIndex(1);
 
     let edgePoints;
     if (curveRoad.way == Constant.oneWay) {
@@ -83,7 +83,7 @@ export default class CurveRoadService extends RoadService {
     let parallelLines = mathUtil.getParallelLineForDistance(line, offsetDis);
     const join = mathUtil.getJoinLinePoint(midPoint, parallelLines.line1);
 
-    this.addCPoint(curveRoad, join, 0);
+    this.addCPoint(curveRoad, join, 1);
     this.setLanes(curveRoad.vectorId);
     return curveRoad;
   }
@@ -121,7 +121,7 @@ export default class CurveRoadService extends RoadService {
     newStartPoint.setIndex(0);
 
     newEndPoint.setPointParent(newCurveRoad.vectorId);
-    newEndPoint.setIndex(endPoint.getIndex());
+    newEndPoint.setIndex(1); //addCPoint执行后会自动增加
 
     newCurveRoad.setWay(curveRoad.way);
     newCurveRoad.singleRoadWidth = curveRoad.singleRoadWidth;
@@ -175,13 +175,35 @@ export default class CurveRoadService extends RoadService {
       this.addCPoint(
         newCurveRoad,
         uiService.getNewPositionForPop(curveRoad.points[i]),
-        curveRoad.points[i].getIndex() - 1
+        curveRoad.points[i].getIndex()
       );
     }
 
+    const leftCurveEdge = dataService.getCurveRoadEdge(curveRoad.leftEdgeId);
+    for (let i = 0; i < leftEdge.points.length; ++i) {
+      leftEdge.points[i] = uiService.getNewPositionForPop(
+        leftCurveEdge.points[i]
+      );
+    }
+    leftEdge.start = uiService.getNewPositionForPop(leftCurveEdge.start);
+    leftEdge.end = uiService.getNewPositionForPop(leftCurveEdge.end);
+
+    const rightCurveEdge = dataService.getCurveRoadEdge(curveRoad.rightEdgeId);
+    for (let i = 0; i < rightEdge.points.length; ++i) {
+      rightEdge.points[i] = uiService.getNewPositionForPop(
+        rightCurveEdge.points[i]
+      );
+    }
+    rightEdge.start = uiService.getNewPositionForPop(rightCurveEdge.start);
+    rightEdge.end = uiService.getNewPositionForPop(rightCurveEdge.end);
+
+    curveEdgeService.setCurves(leftEdge);
+    curveEdgeService.setCurves(rightEdge);
     newCurveRoad.singleRoadDrivewayCount = curveRoad.singleRoadDrivewayCount;
     newCurveRoad.leftDrivewayCount = curveRoad.leftDrivewayCount;
     newCurveRoad.rightDrivewayCount = curveRoad.rightDrivewayCount;
+    newCurveRoad.leftWidth = curveRoad.leftWidth;
+    newCurveRoad.rightWidth = curveRoad.rightWidth;
     this.setLanes(newCurveRoad.vectorId);
     return newCurveRoad.vectorId;
   }
@@ -190,123 +212,245 @@ export default class CurveRoadService extends RoadService {
   //完全不处理车道，都放在setLanes上处理
   addCPoint(curveRoad, position, startIndex) {
     let point = curveRoadPointService.create(position);
-    curveRoad.points.splice(startIndex + 1, 0, point);
+    curveRoad.points.splice(startIndex, 0, point);
     point.setPointParent(curveRoad.vectorId, startIndex);
-    point.setIndex(startIndex + 1);
-    for (let i = startIndex + 2; i < curveRoad.points.length; ++i) {
-      curveRoad.points[i].setIndex(i);
+    point.setIndex(startIndex);
+    for (let i = startIndex + 1; i < curveRoad.points.length; ++i) {
+      let index = curveRoad.points[i].getIndex();
+      curveRoad.points[i].setIndex(index + 1);
     }
 
     let leftCount = curveRoad.leftDrivewayCount;
     let rightCount = curveRoad.rightDrivewayCount;
+    let leftWidth = curveRoad.leftWidth;
+    let rightWidth = curveRoad.rightWidth;
     let leftJoin = null;
     let rightJoin = null;
     const leftCurveEdge = dataService.getCurveRoadEdge(curveRoad.leftEdgeId);
     const rightCurveEdge = dataService.getCurveRoadEdge(curveRoad.rightEdgeId);
 
-    if (curveRoad.points[startIndex + 2]) {
-      let line1 = mathUtil.createLine1(
-        curveRoad.points[startIndex],
-        curveRoad.points[startIndex + 1]
-      );
-      let line2 = mathUtil.createLine1(
-        curveRoad.points[startIndex + 1],
-        curveRoad.points[startIndex + 2]
-      );
+    if (startIndex == 0) {
+      let line = mathUtil.createLine1(curveRoad.points[0], curveRoad.points[1]);
+      let leftLine = mathUtil.createLine3(line, leftCurveEdge.points[0]);
+      let rightLine = mathUtil.createLine3(line, rightCurveEdge.points[0]);
+      let leftJoin = mathUtil.getJoinLinePoint(curveRoad.points[0], leftLine);
+      let rightJoin = mathUtil.getJoinLinePoint(curveRoad.points[0], rightLine);
 
-      const leftLine = mathUtil.createLine1(
-        leftCurveEdge.points[startIndex],
-        leftCurveEdge.points[startIndex + 1]
-      );
-      let leftLine1 = mathUtil.createLine3(
-        line1,
-        leftCurveEdge.points[startIndex]
-      );
-      let leftLine2 = mathUtil.createLine3(
-        line2,
-        leftCurveEdge.points[startIndex + 1]
-      );
+      leftCurveEdge.start = JSON.parse(JSON.stringify(leftJoin));
+      //mathUtil.clonePoint(leftCurveEdge.start, leftJoin);
+      leftCurveEdge.points.splice(startIndex, 0, leftJoin);
+      curveEdgeService.setCurves(leftCurveEdge);
 
-      const rightLine = mathUtil.createLine1(
-        rightCurveEdge.points[startIndex],
-        rightCurveEdge.points[startIndex + 1]
+      rightCurveEdge.start = JSON.parse(JSON.stringify(rightJoin));
+      //mathUtil.clonePoint(rightCurveEdge.start, rightJoin);
+      rightCurveEdge.points.splice(startIndex, 0, rightJoin);
+      curveEdgeService.setCurves(rightCurveEdge);
+      curveRoad.startId = point.vectorId;
+    } else if (startIndex == curveRoad.points.length - 1) {
+      let line = mathUtil.createLine1(
+        curveRoad.points[startIndex],
+        curveRoad.points[startIndex - 1]
+      );
+      let leftLine = mathUtil.createLine3(
+        line,
+        leftCurveEdge.points[startIndex - 1]
       );
-      let rightLine1 = mathUtil.createLine3(
-        line1,
-        rightCurveEdge.points[startIndex]
+      let rightLine = mathUtil.createLine3(
+        line,
+        rightCurveEdge.points[startIndex - 1]
       );
-      let rightLine2 = mathUtil.createLine3(
-        line2,
-        rightCurveEdge.points[startIndex + 1]
+      let leftJoin = mathUtil.getJoinLinePoint(
+        curveRoad.points[startIndex],
+        leftLine
       );
-
-      const line = mathUtil.createLine1(
+      let rightJoin = mathUtil.getJoinLinePoint(
         curveRoad.points[startIndex],
-        curveRoad.points[startIndex + 2]
+        rightLine
       );
 
+      leftCurveEdge.end = JSON.parse(JSON.stringify(leftJoin));
+      //mathUtil.clonePoint(leftCurveEdge.end, leftJoin);
+      leftCurveEdge.points.splice(startIndex, 0, leftJoin);
+      curveEdgeService.setCurves(leftCurveEdge);
+
+      rightCurveEdge.end = JSON.parse(JSON.stringify(rightJoin));
+      //mathUtil.clonePoint(rightCurveEdge.end, rightJoin);
+      rightCurveEdge.points.splice(startIndex, 0, rightJoin);
+      curveEdgeService.setCurves(rightCurveEdge);
+      curveRoad.endId = point.vectorId;
+    } else {
       if (
         mathUtil.Angle(
-          curveRoad.points[startIndex + 1],
           curveRoad.points[startIndex],
-          curveRoad.points[startIndex + 2]
+          curveRoad.points[startIndex - 1],
+          curveRoad.points[startIndex + 1]
         ) > Constant.maxAngle
       ) {
+        let line = mathUtil.createLine1(
+          curveRoad.points[startIndex - 1],
+          curveRoad.points[startIndex + 1]
+        );
         const join = mathUtil.getJoinLinePoint(position, line);
         let dx = position.x - join.x;
         let dy = position.y - join.y;
 
+        let leftLine = mathUtil.createLine1(
+          leftCurveEdge.points[startIndex - 1],
+          leftCurveEdge.points[startIndex]
+        );
         leftJoin = mathUtil.getJoinLinePoint(position, leftLine);
         leftJoin.x += dx;
         leftJoin.y += dy;
-        leftCurveEdge.points.splice(startIndex + 1, 0, leftJoin);
+        leftCurveEdge.points.splice(startIndex, 0, leftJoin);
         curveEdgeService.setCurves(leftCurveEdge);
 
+        let rightLine = mathUtil.createLine1(
+          rightCurveEdge.points[startIndex - 1],
+          rightCurveEdge.points[startIndex]
+        );
         rightJoin = mathUtil.getJoinLinePoint(position, rightLine);
         rightJoin.x += dx;
         rightJoin.y += dy;
-        rightCurveEdge.points.splice(startIndex + 1, 0, rightJoin);
+        rightCurveEdge.points.splice(startIndex, 0, rightJoin);
         curveEdgeService.setCurves(rightCurveEdge);
       } else {
+        let line1 = mathUtil.createLine1(
+          curveRoad.points[startIndex - 1],
+          curveRoad.points[startIndex]
+        );
+        let line2 = mathUtil.createLine1(
+          curveRoad.points[startIndex],
+          curveRoad.points[startIndex + 1]
+        );
+        let leftLine1 = mathUtil.createLine3(
+          line1,
+          leftCurveEdge.points[startIndex - 1]
+        );
+        let leftLine2 = mathUtil.createLine3(
+          line2,
+          leftCurveEdge.points[startIndex]
+        );
         leftJoin = mathUtil.getIntersectionPoint(leftLine1, leftLine2);
-        leftCurveEdge.points.splice(startIndex + 1, 0, leftJoin);
+        leftCurveEdge.points.splice(startIndex, 0, leftJoin);
         curveEdgeService.setCurves(leftCurveEdge);
 
+        let rightLine1 = mathUtil.createLine3(
+          line1,
+          rightCurveEdge.points[startIndex - 1]
+        );
+        let rightLine2 = mathUtil.createLine3(
+          line2,
+          rightCurveEdge.points[startIndex]
+        );
         rightJoin = mathUtil.getIntersectionPoint(rightLine1, rightLine2);
-        rightCurveEdge.points.splice(startIndex + 1, 0, rightJoin);
+        rightCurveEdge.points.splice(startIndex, 0, rightJoin);
         curveEdgeService.setCurves(rightCurveEdge);
       }
-    } else {
-      curveRoad.endId = point.vectorId;
-      let line = mathUtil.createLine1(
-        curveRoad.points[startIndex],
-        curveRoad.points[startIndex + 1]
-      );
-      let leftLine = mathUtil.createLine3(
-        line,
-        leftCurveEdge.points[startIndex]
-      );
-      let leftJoin = mathUtil.getJoinLinePoint(position, leftLine);
-      leftCurveEdge.points.splice(startIndex + 1, 0, leftJoin);
-      leftCurveEdge.points[startIndex] = JSON.parse(
-        JSON.stringify(leftCurveEdge.end)
-      );
-      mathUtil.clonePoint(leftCurveEdge.end, leftJoin);
-      curveEdgeService.setCurves(leftCurveEdge);
-
-      let rightLine = mathUtil.createLine3(
-        line,
-        rightCurveEdge.points[startIndex]
-      );
-      let rightJoin = mathUtil.getJoinLinePoint(position, rightLine);
-      rightCurveEdge.points.splice(startIndex + 1, 0, rightJoin);
-      rightCurveEdge.points[startIndex] = JSON.parse(
-        JSON.stringify(rightCurveEdge.end)
-      );
-      mathUtil.clonePoint(rightCurveEdge.end, rightJoin);
-      curveEdgeService.setCurves(rightCurveEdge);
     }
 
+    // if (curveRoad.points[startIndex + 2]) {
+    //   let line1 = mathUtil.createLine1(
+    //     curveRoad.points[startIndex],
+    //     curveRoad.points[startIndex + 1]
+    //   );
+    //   let line2 = mathUtil.createLine1(
+    //     curveRoad.points[startIndex + 1],
+    //     curveRoad.points[startIndex + 2]
+    //   );
+
+    //   const leftLine = mathUtil.createLine1(
+    //     leftCurveEdge.points[startIndex],
+    //     leftCurveEdge.points[startIndex + 1]
+    //   );
+    //   let leftLine1 = mathUtil.createLine3(
+    //     line1,
+    //     leftCurveEdge.points[startIndex]
+    //   );
+    //   let leftLine2 = mathUtil.createLine3(
+    //     line2,
+    //     leftCurveEdge.points[startIndex + 1]
+    //   );
+
+    //   const rightLine = mathUtil.createLine1(
+    //     rightCurveEdge.points[startIndex],
+    //     rightCurveEdge.points[startIndex + 1]
+    //   );
+    //   let rightLine1 = mathUtil.createLine3(
+    //     line1,
+    //     rightCurveEdge.points[startIndex]
+    //   );
+    //   let rightLine2 = mathUtil.createLine3(
+    //     line2,
+    //     rightCurveEdge.points[startIndex + 1]
+    //   );
+
+    //   const line = mathUtil.createLine1(
+    //     curveRoad.points[startIndex],
+    //     curveRoad.points[startIndex + 2]
+    //   );
+
+    //   if (
+    //     mathUtil.Angle(
+    //       curveRoad.points[startIndex + 1],
+    //       curveRoad.points[startIndex],
+    //       curveRoad.points[startIndex + 2]
+    //     ) > Constant.maxAngle
+    //   ) {
+    //     const join = mathUtil.getJoinLinePoint(position, line);
+    //     let dx = position.x - join.x;
+    //     let dy = position.y - join.y;
+
+    //     leftJoin = mathUtil.getJoinLinePoint(position, leftLine);
+    //     leftJoin.x += dx;
+    //     leftJoin.y += dy;
+    //     leftCurveEdge.points.splice(startIndex + 1, 0, leftJoin);
+    //     curveEdgeService.setCurves(leftCurveEdge);
+
+    //     rightJoin = mathUtil.getJoinLinePoint(position, rightLine);
+    //     rightJoin.x += dx;
+    //     rightJoin.y += dy;
+    //     rightCurveEdge.points.splice(startIndex + 1, 0, rightJoin);
+    //     curveEdgeService.setCurves(rightCurveEdge);
+    //   } else {
+    //     leftJoin = mathUtil.getIntersectionPoint(leftLine1, leftLine2);
+    //     leftCurveEdge.points.splice(startIndex + 1, 0, leftJoin);
+    //     curveEdgeService.setCurves(leftCurveEdge);
+
+    //     rightJoin = mathUtil.getIntersectionPoint(rightLine1, rightLine2);
+    //     rightCurveEdge.points.splice(startIndex + 1, 0, rightJoin);
+    //     curveEdgeService.setCurves(rightCurveEdge);
+    //   }
+    // } else {
+    //   curveRoad.endId = point.vectorId;
+    //   let line = mathUtil.createLine1(
+    //     curveRoad.points[startIndex],
+    //     curveRoad.points[startIndex + 1]
+    //   );
+    //   let leftLine = mathUtil.createLine3(
+    //     line,
+    //     leftCurveEdge.points[startIndex]
+    //   );
+    //   let leftJoin = mathUtil.getJoinLinePoint(position, leftLine);
+    //   leftCurveEdge.points.splice(startIndex + 1, 0, leftJoin);
+    //   leftCurveEdge.points[startIndex] = JSON.parse(
+    //     JSON.stringify(leftCurveEdge.end)
+    //   );
+    //   mathUtil.clonePoint(leftCurveEdge.end, leftJoin);
+    //   curveEdgeService.setCurves(leftCurveEdge);
+
+    //   let rightLine = mathUtil.createLine3(
+    //     line,
+    //     rightCurveEdge.points[startIndex]
+    //   );
+    //   let rightJoin = mathUtil.getJoinLinePoint(position, rightLine);
+    //   rightCurveEdge.points.splice(startIndex + 1, 0, rightJoin);
+    //   rightCurveEdge.points[startIndex] = JSON.parse(
+    //     JSON.stringify(rightCurveEdge.end)
+    //   );
+    //   mathUtil.clonePoint(rightCurveEdge.end, rightJoin);
+    //   curveEdgeService.setCurves(rightCurveEdge);
+    // }
+
     this.setCurves(curveRoad);
   }
 
@@ -744,6 +888,14 @@ export default class CurveRoadService extends RoadService {
         }
       }
     }
+    leftCurveEdge.start = JSON.parse(JSON.stringify(leftCurveEdge.points[0]));
+    leftCurveEdge.end = JSON.parse(
+      JSON.stringify(leftCurveEdge.points[leftCurveEdge.points.length - 1])
+    );
+    rightCurveEdge.start = JSON.parse(JSON.stringify(rightCurveEdge.points[0]));
+    rightCurveEdge.end = JSON.parse(
+      JSON.stringify(rightCurveEdge.points[rightCurveEdge.points.length - 1])
+    );
 
     if (dir == "left") {
       curveEdgeService.setCurves(leftCurveEdge);

src/graphic/Service/LineService.js

@@ -176,6 +176,11 @@ export default class LineService {
     newPoint.setIndex(index);
     newPoint.setPointParent(vectorId);
     curveLine.points.splice(index + 1, 0, newPoint);
+    for (let i = index + 1; i < curveLine.points.length; ++i) {
+      curveLine.points[i].setIndex(i);
+    }
+    curveLine.startId = curveLine.points[0].vectorId;
+    curveLine.endId = curveLine.points[curveLine.points.length - 1].vectorId;
     curveLine.curves = mathUtil.getCurvesByPoints(curveLine.points);
   }
 
@@ -194,14 +199,23 @@ export default class LineService {
     if (curveLine.style) {
       newCurveLine.setStyle(curveLine.style);
     }
-    mathUtil.clonePoint(newCurveLine.points[1], curveLine.points[1]);
+
+    mathUtil.clonePoint(
+      newCurveLine.points[1],
+      uiService.getNewPositionForPop(curveLine.points[1])
+    );
+    newCurveLine.points[1].setIndex(curveLine.points[1].getIndex());
+
     for (let i = 2; i < curveLine.points.length - 1; ++i) {
       let newPoint = uiService.getNewPositionForPop(curveLine.points[i]);
       newPoint = curvePointService.create(newPoint);
       newPoint.setPointParent(vectorId);
-      newPoint.setIndex(i);
-      newCurveLine.points.splice(i + 1, 0, newPoint);
+      newPoint.setIndex(curveLine.points[i].getIndex());
+      newCurveLine.points.splice(i, 0, newPoint);
     }
+    newCurveLine.points[newCurveLine.points.length - 1].setIndex(
+      curveLine.points[curveLine.points.length - 1].getIndex()
+    );
     newCurveLine.curves = mathUtil.getCurvesByPoints(newCurveLine.points);
     return newCurveLine;
   }
@@ -237,6 +251,7 @@ export default class LineService {
         break;
       }
     }
+    dataService.deleteCurvePoint(curvePointId);
     if (curveLine.points.length == 2) {
       let startPoint = dataService.getCurvePoint(curveLine.startId);
       let endPoint = dataService.getCurvePoint(curveLine.endId);

src/graphic/Service/RoadService.js

@@ -9,6 +9,7 @@ import Constant from "../Constant";
 import { crossPointService } from "./CrossPointService.js";
 import { lineService } from "./LineService.js";
 import { uiService } from "./UIService.js";
+import VectorStyle from "../enum/VectorStyle.js";
 
 export default class RoadService {
   constructor() {}
@@ -129,6 +130,15 @@ export default class RoadService {
       leftEdge.setEdgeParent(newRoad.vectorId);
       rightEdge.setEdgeParent(newRoad.vectorId);
     }
+
+    let oldLeftEdge = dataService.getRoadEdge(road.leftEdgeId);
+    leftEdge.start = uiService.getNewPositionForPop(oldLeftEdge.start);
+    leftEdge.end = uiService.getNewPositionForPop(oldLeftEdge.end);
+
+    let oldRightEdge = dataService.getRoadEdge(road.rightEdgeId);
+    rightEdge.start = uiService.getNewPositionForPop(oldRightEdge.start);
+    rightEdge.end = uiService.getNewPositionForPop(oldRightEdge.end);
+
     newRoad.singleRoadDrivewayCount = road.singleRoadDrivewayCount;
     newRoad.leftDrivewayCount = road.leftDrivewayCount;
     newRoad.rightDrivewayCount = road.rightDrivewayCount;
@@ -1494,14 +1504,26 @@ export default class RoadService {
     lineService.create(rightEdge.start, rightEdge.end);
     if (road.way == Constant.oneWay) {
       for (let i = 0; i < road.singleLanes.length; ++i) {
-        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) {
-        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) {
-        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,

src/graphic/Service/StateService.js

@@ -65,6 +65,9 @@ export default class StateService {
       return;
     } else if (this.draggingItem.type == VectorType.Line) {
       const line = dataService.getLine(this.draggingItem.vectorId);
+      if(!line){
+        return 
+      }
       this.draggingItem.category = line.getCategory();
     } else if (this.draggingItem.type == VectorType.Point) {
       const point = dataService.getPoint(this.draggingItem.vectorId);
@@ -86,6 +89,9 @@ export default class StateService {
       return;
     } else if (this.focusItem.type == VectorType.Line) {
       const line = dataService.getLine(this.focusItem.vectorId);
+      if(!line){
+        return
+      }
       this.focusItem.category = line.getCategory();
     } else if (this.focusItem.type == VectorType.Point) {
       const point = dataService.getPoint(this.focusItem.vectorId);

src/graphic/Util/MathUtil.js

@@ -1451,7 +1451,41 @@ export default class MathUtil {
   }
 
   getHitInfoForThreeBezier(position, curve, rang = 3) {
+    // 定义三次贝塞尔曲线的控制点和目标点
+    var p0 = curve.start;
+    var p1 = curve.controls[0];
+    var p2 = curve.controls[1];
+    var p3 = curve.end;
+    var target = position
+
+// 参数化方式在曲线上取一系列的点
+    var pointsOnCurve = [];
+    for (var t = 0; t <= 1; t += 0.01) {
+      var x = Math.pow(1 - t, 3) * p0.x + 3 * Math.pow(1 - t, 2) * t * p1.x + 3 * (1 - t) * Math.pow(t, 2) * p2.x + Math.pow(t, 3) * p3.x;
+      var y = Math.pow(1 - t, 3) * p0.y + 3 * Math.pow(1 - t, 2) * t * p1.y + 3 * (1 - t) * Math.pow(t, 2) * p2.y + Math.pow(t, 3) * p3.y;
+      pointsOnCurve.push({ x: x, y: y });
+    }
+
+// 计算每个点与目标点的距离
+    var shortestDistance = Number.MAX_VALUE;
+    var closestPoint;
+    for (var i = 0; i < pointsOnCurve.length; i++) {
+      var distance = Math.sqrt(Math.pow(pointsOnCurve[i].x - target.x, 2) + Math.pow(pointsOnCurve[i].y - target.y, 2));
+      if (distance < shortestDistance) {
+        shortestDistance = distance;
+        closestPoint = pointsOnCurve[i];
+      }
+    }
+    return {
+      position: closestPoint,
+      distance: shortestDistance,
+    }
+
+    console.log("最短距离:", shortestDistance);
+    console.log("最近点:", closestPoint);
+
     const { x: offsetX, y: offsetY } = position;
+    let results = []
     // 用 x 求出对应的 t，用 t 求相应位置的 y，再比较得出的 y 与 offsetY 之间的差值
     const tsx = this.getThreeBezierT(
       curve.start.x,
@@ -1460,6 +1494,7 @@ export default class MathUtil {
       curve.end.x,
       offsetX
     );
+    console.log(tsx)
     for (let x = 0; x < 3; x++) {
       if (tsx[x] <= 1 && tsx[x] >= 0) {
         const point = this.getThreeBezierPoint(
@@ -1469,12 +1504,12 @@ export default class MathUtil {
           curve.controls[1],
           curve.end
         );
-        if (Math.abs(point.y - offsetY) < rang) {
-          return {
+        // if (Math.abs(point.y - offsetY) < rang) {
+          results.push({
             position: point,
             distance: this.getDistance(point, position),
-          };
-        }
+          });
+        // }
       }
     }
     // 如果上述没有结果，则用 y 求出对应的 t，再用 t 求出对应的 x，与 offsetX 进行匹配
@@ -1494,14 +1529,17 @@ export default class MathUtil {
           curve.controls[1],
           curve.end
         );
-        if (Math.abs(point.x - offsetX) < rang) {
-          return {
+        // if (Math.abs(point.x - offsetX) < rang) {
+          results.push({
             position: point,
             distance: this.getDistance(point, position),
-          };
-        }
+          });
+        // }
       }
     }
+
+    console.log(results)
+    return results.sort((a, b) => a.distance - b.distance)[0]
   }
 
   // 二次曲线
@@ -1515,6 +1553,7 @@ export default class MathUtil {
     bezierData.push(curve.end.y);
     const { isHit, getInfo } = bezierUtil.measureBezier(...bezierData);
     const { point } = getInfo(position);
+
     return {
       position: {
         x: point[0],
@@ -1589,7 +1628,7 @@ export default class MathUtil {
         minDisToPoint >
         mathUtil.getDistance(position, points[points.length - 1])
       ) {
-        return points.length - 1;
+        return points.length;
       } else {
         return minPointIndex;
       }

src/graphic/enum/UIEvents.js

@@ -29,6 +29,7 @@ const UIEvents = {
   // 综合定位法
   AllLocationMode: "AllLocationMode",
 
+  FixPoint: "fixpoint",
   // 文字
   Text: "text", //这个是标注，暂时这样
   //svg

src/graphic/enum/VectorCategory.js

@@ -7,10 +7,18 @@ const VectorCategory = {
 
     MeasureLine: "MeasureLine",
     FreeMeasureLine: "FreeMeasureLine",
+
     GuideLine: "GuideLine",
     PositionLine: "PositionLine", //定位线。基准点与待测点相连的线，或者与待测基准点相连的线
     GuidePositionLine: "GuidePositionLine", //定位辅助线
     ExtendedPositionLine: "ExtendedPositionLine", //定位延长线
+
+    //重做定位
+    GuideLocationLine: "GuideLocationLine", //定位辅助线
+    LocationLineByFixPoint: "LocationLineByFixPoint", //经过固定点的定位线
+    LocationLineByBasePoint: "LocationLineByFixPoint", //经过基础点的定位线
+    LocationLineByFixPointToFixPoint: "LocationLineByFixPointToFixPoint", //经过固定点到固定点的定位线，综合定位法
+    LocationLineByFixPointToBasePoint: "LocationLineByFixPointToBasePoint", //经过固定点到基础点的定位线，综合定位法
   },
   Point: {
     BasePoint: "BasePoint", //基准点
@@ -18,6 +26,7 @@ const VectorCategory = {
     NormalPoint: "NormalPoint", //正常点
     TestBasePoint: "TestBasePoint", //待测基准点，待测点与基准线相交的点
     FixPoint: "FixPoint", //固定点
+    GuidePoint: "GuidePoint", //辅助点，定位法需要
   },
 };
 export default VectorCategory;

src/hook/custom/preset.ts

@@ -87,6 +87,7 @@ export enum CustomCom {
   boxWidth = "boxWidth",
   autoMarginLeft = "autoMarginLeft",
   fullCtrl = "fullCtrl",
+  trackMeasureMode = "trackMeasureMode"
 }
 
 export enum RightMenuEum {
@@ -127,6 +128,7 @@ export const boxWidthStack = stackFactory(
 );
 export const autoSysViewLeftStack = stackFactory(ref<string>("70px"));
 export const controlFullStack = stackFactory(ref<boolean>(false));
+export const trackMeasureModeStack = stackFactory(ref<boolean>(false));
 export const activeFixPointStack = stackFactory(ref<FixPoint>());
 export const activeBasePointStack = stackFactory(ref<BasePoint>());
 
@@ -144,6 +146,7 @@ export const customMapStack = {
   [CustomCom.boxWidth]: boxWidthStack,
   [CustomCom.autoMarginLeft]: autoSysViewLeftStack,
   [CustomCom.fullCtrl]: controlFullStack,
+  [CustomCom.trackMeasureMode]: trackMeasureModeStack
 };
 export type CustomMapStack = typeof customMapStack;
 

src/main.ts

@@ -1,5 +1,5 @@
 import VConsole from 'vconsole';
-if (import.meta.env.MODE !== "production") {
+if (import.meta.env.MODE === "test") {
   if (!os.isPc) {
     new VConsole();
   }

src/sdk/carry/measures/index.vue

@@ -13,13 +13,16 @@ import MeasureItem from './item.vue'
 import { propsKey, laserKey } from '../constant'
 import { inject, computed, ref, watch } from 'vue'
 import {MeasureUnit} from "@/sdk";
+import {tempMeasures} from "@/store/measure";
+import {customMap} from "@/hook";
+import {trackMode} from "@/views/scene/trackMeasureWidth";
 
 const props = inject(propsKey)
 const laser = inject(laserKey)
 const refs = ref([])
 const measureMap = props.measureMap
 
-const measure = computed(() => [...props.store.measure.list, ...props.store.baseLine.baseLines])
+const measure = computed(() => trackMode.value ?  props.store.measure.tempMeasures : [...props.store.measure.list, ...props.store.baseLine.baseLines])
 
 watch(
   refs,

src/sdk/types/store.ts

@@ -2,6 +2,7 @@ import { MeasuresRaw, MeasureUnit } from '@/sdk'
 
 export type Store = {
     measure?: {
+        tempMeasures: MeasuresRaw
         list: MeasuresRaw
         unit: MeasureUnit
     },

src/store/measure.ts

@@ -7,12 +7,14 @@ export * from "@/sdk/types/measure";
 
 export const list: Measures = ref([]);
 
+export const tempMeasures: Measures = ref([])
 export const show = ref(false);
 export const unit = ref<MeasureUnit>(
   Number(useParams().unit) || MeasureUnit.meter
 );
 export const store = reactive({
   list,
+  tempMeasures,
   show,
   unit,
 });

src/store/sync.ts

@@ -12,9 +12,20 @@ import {params} from "@/hook";
 import router, {writeRouteName} from "@/router";
 import {baseURL} from "@/dbo/main";
 import {defaultUses, uses} from '@/store/SVGLabel'
+import {imageRotate} from "@/utils/image-rotate";
 
 const global = window as any;
 
+const normalImage = async (url: string) => {
+  const getUrl = await api.getFile(url)
+  const blob = await imageRotate(getUrl)
+  if (!blob) {
+    return url
+  } else {
+    return await api.uploadImage(new File([blob], getId()))
+  }
+}
+
 let count = 0;
 export const api =
   !global.android
@@ -70,7 +81,8 @@ export const api =
             })
           })
 
-          return await this.uploadImage(file)
+          const url = await this.uploadImage(file)
+          return await normalImage(url);
         },
         async selectPhotoAlbum() {
           return await this.photograph()
@@ -167,7 +179,7 @@ export const api =
             const apiName = `photograph${count++}`
             global[apiName] = (data) => {
               console.log("拍照后路径：", data)
-              resolve(data);
+              normalImage(data).then(resolve);
               delete global[apiName]
             }
             global.android.cameraPhotograph(params.m, apiName);
@@ -178,7 +190,7 @@ export const api =
             const apiName = `selectPhotoAlbum${count++}`
             global[apiName] = (data) => {
               console.log("获得相册图片路径：", data)
-              resolve(data);
+              normalImage(data).then(resolve);
               delete global[apiName]
             }
             global.android.selectPhotoAlbum(params.m, apiName);

src/utils/image-rotate.ts

@@ -0,0 +1,39 @@
+
+
+export const imageRotate = async (url: string, direction: "row" | "column" = "row"): Promise<void | Blob> => {
+  const img = new Image()
+  img.src = url
+  await new Promise(resolve => img.onload = resolve);
+
+  let width = img.width
+  let height = img.height
+  if (width > height) {
+    if (direction === 'row') {
+      return;
+    }
+    width = img.height
+    height = img.width
+  } else {
+    if (direction === "column") {
+      return
+    }
+    width = img.height
+    height = img.width
+  }
+
+  const canvas = document.createElement("canvas");
+  canvas.width = width
+  canvas.height = height
+  const ctx = canvas.getContext("2d")
+
+  const center = direction === "row"
+    ? [img.width / 2, height / 2]
+    : [img.height / 2, width / 2]
+  console.log(img.width, img.height, width, height, center)
+  ctx.translate(center[0], center[1])
+  ctx.rotate((direction === "row" ? -1 : 1) * Math.PI / 2)
+  ctx.translate(-center[0], -center[1])
+  ctx.drawImage(img, 0, 0)
+
+  return await new Promise<Blob>(resolve => canvas.toBlob(resolve, "image/png", 1))
+}

src/views/accidents/print.vue

@@ -1,7 +1,7 @@
 <template>
   <MainPanel>
     <template v-slot:header>
-      <Header  title="生成A4" type="return">
+      <Header  title="生成A4" type="return" :onBack="() => router.back()">
         <ui-button
             type="primary"
             @click="saveHandler"

src/views/graphic/childMenus.vue

@@ -10,7 +10,7 @@
         :key="menu.key"
         class="menu"
         :class="{active: uiType.current === menu.key}"
-        @click="uiType.change(menu.key as any)"
+        @click="clickHandler(menu)"
       >
         <ui-icon :type="menu.icon" class="icon" />
         <p>{{ menu.text }}</p>
@@ -28,8 +28,11 @@ import {computed} from "vue";
 const props = defineProps<{ menus: MenusRaw }>();
 const title = computed(() => findMainMenuByAttr(props.menus)?.text)
 
-defineEmits<{ (e: "quit") }>();
-
+const emit = defineEmits<{ (e: "quit") }>();
+const clickHandler = (menu) => {
+  uiType.change(menu.key as any)
+  emit("quit")
+}
 </script>
 
 <style lang="scss" scoped>

src/views/graphic/geos/arrow.vue

@@ -2,8 +2,9 @@
   <GeoTeleport :menus="menus" class="geo-teleport-use" :active="typeMenus && menus[1]">
     <template v-slot="{ data }">
       <template v-if="data.key === 'color'">
-        <ui-input type="color" class="geo-input" v-model="color" />
-        <span class="color" :style="{backgroundColor: color}"></span>
+        <Color v-model:color="color">
+          <span class="color" :style="{backgroundColor: color}"></span>
+        </Color>
       </template>
     </template>
   </GeoTeleport>
@@ -12,13 +13,12 @@
 
 <script setup lang="ts">
 import GeoTeleport from "@/views/graphic/geos/geo-teleport.vue";
-import UiInput from "@/components/base/components/input/index.vue";
-import UiIcon from "@/components/base/components/icon/index.vue";
 import {drawRef, FocusVector, uiType, UIType, useChange} from '@/hook/useGraphic'
 import {computed, ref, UnwrapRef, watch, watchEffect} from "vue";
 import {dataService} from "@/graphic/Service/DataService";
 import GeoActions from "@/graphic/enum/GeoActions"
 import {debounce} from "@/utils";
+import Color from '@/components/color/index.vue'
 import VectorCategory from "@/graphic/enum/VectorCategory";
 
 const props = defineProps<{geo: FocusVector}>()
@@ -104,6 +104,7 @@ if (props.geo.category === VectorCategory.Line.NormalLine) {
   height: 18px;
   border: 2px solid #fff;
   border-radius: 50%;
+  display: inline-block;
 }
 
 .icon {
@@ -123,6 +124,7 @@ if (props.geo.category === VectorCategory.Line.NormalLine) {
 .type-geo {
   margin-bottom: 74px;
 }
+
 </style>
 
 <style lang="scss">

src/views/graphic/geos/circle.vue

@@ -2,8 +2,9 @@
   <GeoTeleport :menus="menus" class="geo-teleport-use">
     <template v-slot="{ data }">
       <template v-if="data.key === 'color'">
-        <ui-input type="color" class="geo-input" v-model="color" />
-        <span class="color" :style="{backgroundColor: color}"></span>
+        <Color v-model:color="color">
+          <span class="color" :style="{backgroundColor: color}"></span>
+        </Color>
       </template>
     </template>
   </GeoTeleport>
@@ -12,7 +13,7 @@
 <script setup lang="ts">
 import GeoTeleport from "@/views/graphic/geos/geo-teleport.vue";
 import UiInput from "@/components/base/components/input/index.vue";
-import UiIcon from "@/components/base/components/icon/index.vue";
+import Color from '@/components/color/index.vue'
 import {drawRef, FocusVector, uiType, UIType, useChange} from '@/hook/useGraphic'
 import {computed, ref, watch, watchEffect} from "vue";
 import {dataService} from "@/graphic/Service/DataService";
@@ -58,6 +59,7 @@ const menus = [
   height: 18px;
   border: 2px solid #fff;
   border-radius: 50%;
+  display: inline-block;
 }
 
 .icon {

src/views/graphic/geos/del.vue

@@ -14,8 +14,9 @@ import VectorCategory from "@/graphic/enum/VectorCategory";
 
 const props = defineProps<{geo: FocusVector}>()
 const hideTypes = [
-  VectorType.RoadPoint,
-  VectorType.CurveRoadPoint,
+  VectorType.CrossPoint,
+  // VectorType.RoadPoint,
+  // VectorType.CurveRoadPoint,
   VectorCategory.Point.NormalPoint
 ]
 console.log(props)

src/views/graphic/geos/geo-teleport.vue

@@ -94,7 +94,7 @@ defineProps<{ menus: Menu[], active?: Menu }>()
   display: flex;
   align-items: center;
   justify-content: center;
-  overflow-y: hidden;
+  //overflow-y: hidden;
 }
 
 </style>

src/views/graphic/geos/normalLine.vue

@@ -61,7 +61,7 @@ const lineTypeMenu = [
     text: "点画线",
     onClick: clickHandlerFactory(VectorStyle.PointDrawLine)
   },
-  {key: VectorStyle.Greenbelt, icon: "treelawn", text: "绿化带 ", onClick: clickHandlerFactory(VectorStyle.Greenbelt)},
+  // {key: VectorStyle.Greenbelt, icon: "treelawn", text: "绿化带 ", onClick: clickHandlerFactory(VectorStyle.Greenbelt)},
 ]
 const lineWidthMenu = [
   {

src/views/graphic/geos/road.vue

@@ -11,7 +11,7 @@
 import GeoTeleport from "@/views/graphic/geos/geo-teleport.vue";
 import UiIcon from "@/components/base/components/icon/index.vue";
 import {drawRef, FocusVector, VectorType} from '@/hook/useGraphic'
-import {computed, ref} from "vue";
+import {computed, ref, watchEffect} from "vue";
 import {dataService} from "@/graphic/Service/DataService";
 import GeoActions from "@/graphic/enum/GeoActions"
 import GraphicAction from "@/components/button-pane/index.vue";
@@ -20,9 +20,13 @@ import VectorEvents from "@/graphic/enum/VectorEvents";
 const props = defineProps<{geo: FocusVector}>()
 const vector = computed(() => dataService.getRoad(props.geo.vectorId))
 const clickHandlerFactory = (key) => {
-  return () => drawRef.value.uiControl.updateVectorForSelectUI(key)
+  return () => {
+    drawRef.value.uiControl.updateVectorForSelectUI(key)
+    console.log(vector)
+  }
 }
 
+
 const appendMenus = props.geo.type === VectorType.CurveRoad
   ? [
     {
@@ -71,6 +75,10 @@ const menus = ref([
   }
 ])
 
+watchEffect(() => {
+  menus.value[1].disabled = vector.value?.singleRoadDrivewayCount === 1
+})
+
 </script>
 
 <style scoped lang="scss">

src/views/graphic/geos/roadEdge.vue

@@ -55,7 +55,7 @@ const lineTypeMenu = [
     text: "点画线",
     onClick: clickHandlerFactory(VectorStyle.PointDrawLine)
   },
-  {key: VectorStyle.Greenbelt, icon: "treelawn", text: "绿化带 ", onClick: clickHandlerFactory(VectorStyle.Greenbelt)},
+  // {key: VectorStyle.Greenbelt, icon: "treelawn", text: "绿化带 ", onClick: clickHandlerFactory(VectorStyle.Greenbelt)},
 ]
 
 const lineWidthMenu = [

src/views/graphic/geos/text.vue

@@ -2,8 +2,9 @@
   <GeoTeleport :menus="menus" class="geo-teleport-use">
     <template v-slot="{ data }">
       <template v-if="data.key === 'color'">
-        <ui-input type="color" class="geo-input" v-model="color" />
-        <span class="color" :style="{backgroundColor: color}"></span>
+        <Color v-model:color="color">
+          <span class="color" :style="{backgroundColor: color}"></span>
+        </Color>
       </template>
       <template v-if="data.key === 'fontSize'">
         <ui-input
@@ -25,6 +26,7 @@
           ref="inputTextRef"
           v-model="text"
           width="100%"
+          :maxlength="20"
           height="64px"
           @blur="updateText = false"
       />
@@ -41,6 +43,7 @@ import {computed, ref, watch, watchEffect} from "vue";
 import {dataService} from "@/graphic/Service/DataService";
 import {debounce} from '@/utils'
 import GeoActions from "@/graphic/enum/GeoActions";
+import Color from "@/components/color/index.vue";
 
 const props = defineProps<{geo: FocusVector}>()
 const inputTextRef = ref()
@@ -113,6 +116,7 @@ const menus = [
   height: 18px;
   border: 2px solid #fff;
   border-radius: 50%;
+  display: inline-block;
 }
 
 .font-size {

src/views/graphic/header.vue

@@ -1,7 +1,7 @@
 <template>
   <div v-if="data" class="graphic-header">
     <div class="title">
-      <ui-icon class="head-icon" type="return" @click="back"/>
+      <ui-icon class="head-icon" type="return" @click="router.back"/>
       <p>{{ isRoad ? '现场绘图' : '事故照片' }}</p>
     </div>
     <div class="actions">

src/views/graphic/imageLabel.vue

@@ -56,7 +56,8 @@ const typeMenus = computed(() => {
       .filter(item => item.text.includes(keyword.value))
       .sort((a, b) => a.icon.localeCompare(b.icon))
   }));
-  const items = [
+
+  const items = keyword.value ? raws : [
     {
       title: "常用",
       children: uses.value

src/views/graphic/index.vue

@@ -1,13 +1,13 @@
 <template>
   <MainPanel
-      :menus="graphicState.continuedMode ? null : store.menus as any"
+      :menus="store.menus as any"
       :active-menu-key="store.activeMenuKey.value">
     <template v-slot:header>
-      <Header :class="{disabled: graphicState.continuedMode}" />
+      <Header  />
     </template>
     <Container />
     <ChildMenus
-        v-if="store.child.value"
+        v-if="store.child.value && store.activeMenuKey.value === UITypeExtend.template"
         :menus="store.child.value as any"
         @quit="store.child.value = null"
     />
@@ -16,7 +16,7 @@
         @quit="uiType.change(null)"
     />
 
-    <GraphicAction class="full-action">
+    <GraphicAction class="full-action" v-if="!graphicState.continuedMode">
       <ui-icon
         :type="isFull ? 'screen_c' : 'screen_f'"
         ctrl
@@ -38,7 +38,7 @@ import UiIcon from "@/components/base/components/icon/index.vue";
 import Confirm from './confirm.vue'
 import ImageLabel from "./imageLabel.vue";
 import {router} from '@/router'
-import {computed} from "vue";
+import {computed, watchEffect} from "vue";
 import {customMap} from '@/hook'
 import {focusMenuRaw, generateMixMenus, mainMenusRaw, photoMenusRaw, Mode, UITypeExtend} from './menus'
 import {currentVector, graphicState, uiType} from "@/hook/useGraphic";
@@ -61,6 +61,13 @@ const store = computed(() => generateMixMenus(
   menusRaws.value
 ))
 
+watchEffect(() => {
+  if (graphicState.value.continuedMode) {
+    customMap.sysView = 'full'
+  } else {
+    customMap.sysView = 'auto'
+  }
+})
 
 const focusMenus = computed(() => focusMenuRaw[currentVector.value?.type])
 const geoComponent = computed(() => {

src/views/graphic/menus.ts

@@ -170,6 +170,7 @@ export const mainMenusRaw: MenusRaw = [
     //   { key: UIType.BusPlane, text: "客车平面图" }
     // ]
   },
+  { key: UIType.FixPoint, text: '固定点', icon: 'text' },
   {
     key: UITypeExtend.measure,
     text: '测量',

src/views/graphic/setting.vue

@@ -9,7 +9,7 @@
           </p>
           <ui-input v-model="data.singleRoadWidth" width="100%">
             <template v-slot:icon>
-              <ui-icon type="measure" ctrl @click="setSceneSingleRoadWidth" />
+              <ui-icon type="measure" ctrl @click="setSceneSingleRoadWidth" class="measure_icon" />
             </template>
           </ui-input>
         </div>
@@ -21,7 +21,7 @@
           </p>
           <ui-input v-model="data.roadQuarantineWidth" width="100%">
             <template v-slot:icon>
-              <ui-icon type="measure" ctrl @click="setSceneRoadQuarantineWidth" />
+              <ui-icon type="measure" ctrl @click="setSceneRoadQuarantineWidth" class="measure_icon" />
             </template>
           </ui-input>
         </div>
@@ -69,7 +69,10 @@ const lineWidthOption = [
 console.log(data)
 
 const setSceneSingleRoadWidth = async () => {
-  data.value.singleRoadWidth = await trackMeasureWidth()
+  const width = await trackMeasureWidth()
+  if (width !== null) {
+    data.value.singleRoadWidth = width
+  }
 }
 
 const setSceneRoadQuarantineWidth = async () => {
@@ -117,4 +120,8 @@ const handler = (label) => {
     }
   }
 }
+
+.measure_icon {
+  padding: 10px;
+}
 </style>

src/views/scene/TrackMeasure.vue

@@ -1,33 +1,63 @@
 <template>
-  <ButtonPane class="photo-btn fun-ctrl" :size="80" @click="active = true">
-    <ui-icon type="line_h" class="icon" :class="{active}" />
-  </ButtonPane>
+  <div class="photo-btn">
+    <ButtonPane
+        class="item fun-ctrl"
+        :size="80"
+        @click="callback"
+    >
+      <ui-icon type="affirm" class="icon" />
+    </ButtonPane>
+    <ButtonPane class="item fun-ctrl" :size="80" @click="active = !active">
+      <ui-icon type="line_h" class="icon" :class="{active}" />
+    </ButtonPane>
+  </div>
 </template>
 <script setup lang="ts">
 import UiIcon from "@/components/base/components/icon/index.vue";
 import ButtonPane from "@/components/button-pane/index.vue";
 import {startMeasure, SuccessMeasureAtom} from "@/views/scene/linkage/measure";
-import {ref, watchEffect} from "vue";
+import {onActivated, onMounted, ref, watchEffect} from "vue";
+import {tempMeasures} from "@/store/measure";
+import {measureDisabledStack} from '@/hook/custom'
 
 const props = defineProps<{ onConfirm: (data: SuccessMeasureAtom) => void }>()
-const active = ref(false)
+const active = ref(true)
+const callback = () => {4
+  props.onConfirm(tempMeasures.value[0] as any)
+  tempMeasures.value = []
+}
 watchEffect(() => {
   if (active.value) {
+    tempMeasures.value = []
     startMeasure('L_LINE', 'red')
       .then((measure) => {
-        props.onConfirm(measure)
+        if (measure) {
+          active.value = null
+          tempMeasures.value = [measure]
+        }
       })
   }
 })
+
+onMounted(() => {
+  measureDisabledStack.push(ref(true))
+})
+onActivated(() => {
+  measureDisabledStack.pop()
+})
 </script>
 
 <style lang="scss" scoped>
 .photo-btn {
   position: absolute;
-  margin-bottom: 16px;
+  transform: translateY(-50%);
   top: 50%;
   left: 15px;
 
+  .item {
+    position: static;
+    margin: 20px 0;
+  }
 
   .icon {
     &.active {

src/views/scene/container.vue

@@ -93,13 +93,15 @@ onMounted(async () => {
 
 <style lang="scss">
 .canvas-layout  {
-  #navCube,
+  #navCube{
+    position: absolute !important;
+    right: calc(var(--boundMargin) + 10px) !important;
+    top: calc(var(--boundMargin) + 10px) !important;
+  }
   #home {
     position: absolute !important;
     right: var(--boundMargin) !important;
     top: var(--boundMargin) !important;
-  }
-  #home {
     display: flex;
     align-items: center;
     justify-content: center;

src/views/scene/covers/fixPoints.vue

@@ -24,7 +24,7 @@
       <h3>添加名称</h3>
       <ui-icon type="close" ctrl @click="edit = null" />
     </div>
-    <ui-input type="text" v-model="edit.text" width="100%" />
+    <ui-input type="text" v-model="edit.text" width="100%" maxlength="20" />
     <div class="select">
       <span>常用名称</span>
       <p
@@ -43,7 +43,6 @@
 <script setup lang="ts">
 import { fixPoints, FixPoint } from '@/store/fixPoint'
 import FixPointPanel from './fixPoint.vue'
-import ActionsPanel from './actions.vue'
 import {ref, watch, watchEffect} from "vue";
 import {customMap} from '@/hook'
 import UiIcon from "@/components/base/components/icon/index.vue";

src/views/scene/index.vue

@@ -23,7 +23,7 @@ import FixPoints from "@/views/scene/covers/fixPoints.vue";
 import Measures from "@/views/scene/covers/measures.vue";
 import Photo from './photo.vue'
 import ButtonPane from '@/components/button-pane'
-import {disabledMap, useSDK} from "@/hook";
+import {customMap, disabledMap, useSDK} from "@/hook";
 import customSetup from "../../hook/custom";
 import UiIcon from "@/components/base/components/icon/index.vue";
 import {ref, watchEffect} from "vue";

src/views/scene/menus/actions.ts

@@ -50,7 +50,8 @@ const trackMeasureMenuAction = (
   const startTip = () => {
     hide && hide()
     if (!startTipEd) {
-      hide = Message.success({msg: `请选择一个位置单击，确定${name}的起点`})
+      hide = Message.success({msg: `请绘制${name}`})
+      // 请选择一个位置单击，确定${name}的起点
       startTipEd = true
     }
   }
@@ -58,7 +59,7 @@ const trackMeasureMenuAction = (
     hide && hide()
     if (!endTipEd) {
       endTipEd = true
-      hide = Message.success({msg: `再选择一个位置单击，确定${name}的终点`})
+      // hide = Message.success({msg: `再选择一个位置单击，确定${name}的终点`})
     }
   }
   startTip()

src/views/scene/photo.vue

@@ -2,7 +2,7 @@
   <img :src="tempPhoto" class="face-animation" v-if="tempPhoto" ref="coverRef">
 
   <div class="photo-layout" v-if="disabledMap.photo">
-    <ButtonPane class="photo-btn fun-ctrl" size="80" @click="photo">
+    <ButtonPane class="photo-btn fun-ctrl" :size="80" @click="photo">
       <ui-icon type="photo" class="icon" />
     </ButtonPane>
 

src/views/scene/trackMeasureWidth.ts

@@ -39,5 +39,9 @@ export const trackMeasureWidth = async () => {
   await new Promise(resolve => setTimeout(resolve, 100))
   sdk.leaveTopView()
   trackMode.value = false
-  return Number(measure.length.toFixed(2))
+  if (measure) {
+    return Number(measure.length.toFixed(2))
+  } else {
+    return null
+  }
 }

yarn.lock

@@ -169,6 +169,11 @@
     "@intlify/core-base" "9.2.2"
     "@intlify/shared" "9.2.2"
 
+"@lk77/vue3-color@^3.0.6":
+  version "3.0.6"
+  resolved "http://192.168.0.47:4873/@lk77/vue3-color/-/vue3-color-3.0.6.tgz#3f9262b82b21c606b30e2b79c570636e80d91dfa"
+  integrity sha512-1e/TJrk2jJFo7z+teHjavndVxV9c25J5FA6LVEKJFKqLQzYDesTijxBmX1rAmiHHnFrjfVcwie5QAr3PzZbR2Q==
+
 "@types/body-parser@*":
   version "1.19.2"
   resolved "http://192.168.0.47:4873/@types/body-parser/-/body-parser-1.19.2.tgz#aea2059e28b7658639081347ac4fab3de166e6f0"
@@ -879,6 +884,11 @@ inherits@2.0.4:
   resolved "http://192.168.0.47:4873/inherits/-/inherits-2.0.4.tgz#0fa2c64f932917c3433a0ded55363aae37416b7c"
   integrity sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==
 
+install@^0.13.0:
+  version "0.13.0"
+  resolved "http://192.168.0.47:4873/install/-/install-0.13.0.tgz#6af6e9da9dd0987de2ab420f78e60d9c17260776"
+  integrity sha512-zDml/jzr2PKU9I8J/xyZBQn8rPCAY//UOYNmR01XwNwyfhEWObo2SWfSl1+0tm1u6PhxLwDnfsT/6jB7OUxqFA==
+
 ipaddr.js@1.9.1:
   version "1.9.1"
   resolved "http://192.168.0.47:4873/ipaddr.js/-/ipaddr.js-1.9.1.tgz#bff38543eeb8984825079ff3a2a8e6cbd46781b3"