修改道路交互

src/graphic/Renderer/Draw.js

@@ -282,6 +282,7 @@ export default class Draw {
     if (!isTemp && vector.display && vector.way !== "oneWay") {
       const ctx = this.context;
       const draw = (midDivide) => {
+        console.log(midDivide)
         const startScreen = coordinate.getScreenXY(midDivide.start);
         const endScreen = coordinate.getScreenXY(midDivide.end);
         ctx.beginPath();
@@ -294,6 +295,7 @@ export default class Draw {
       help.setVectorStyle(ctx, vector);
       vector.midDivide.leftMidDivide && draw(vector.midDivide.leftMidDivide);
       vector.midDivide.rightMidDivide && draw(vector.midDivide.rightMidDivide);
+
       ctx.restore();
     }
 
@@ -313,6 +315,7 @@ export default class Draw {
     this.drawRoadEdge(vector, isTemp);
     vector.leftLanes && vector.leftLanes.forEach(this.drawLan.bind(this));
     vector.rightLanes && vector.rightLanes.forEach(this.drawLan.bind(this));
+    vector.singleLanes && vector.singleLanes.forEach(this.drawLan.bind(this));
   }
 
   drawLan(lan) {
@@ -669,6 +672,10 @@ export default class Draw {
 
     if (vector.color) {
       ctx.strokeStyle = vector.color;
+      style = {
+        ...style,
+        strokeStyle: vector.color
+      };
     }
     const draw = (style) => {
       const radius = vector.radius || style.radius;
@@ -762,20 +769,24 @@ 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] = help.setVectorStyle(this.context, vector);
+    const [style, label] = help.setVectorStyle(this.context, vector);
     this.context.lineWidth = style.lineWidth / (width / svgWidth);
-    SVGIcons['chemotuoche_p.svg'].draw(this.context);
+    SVGIcons[vector.type].draw(this.context);
+    this.context.restore();
 
-    if (import.meta.env.DEV) {
-      this.context.restore();
+    if (label) {
+      this.context.save();
       this.context.beginPath();
       this.context.moveTo(points[0].x, points[0].y);
       this.context.lineTo(points[1].x, points[1].y);
       this.context.lineTo(points[2].x, points[2].y);
       this.context.lineTo(points[3].x, points[3].y);
+      this.context.strokeStyle = "red"
+      this.context.setLineDash([6 * coordinate.ratio, 2 * coordinate.ratio]);
       this.context.closePath();
       this.context.stroke();
       this.context.restore();
+      vector.points.forEach(point => this.drawPoint({...point, color: 'red', radius: 5 }))
     }
   }
 

src/graphic/enum/UIEvents.js

@@ -45,7 +45,7 @@ const UIEvents = {
   // 单向双车道直路
   OneEdgeTwoLanRoad: "OneEdgeTwoLanRoad",
   // 单向三车道直路
-  OneEdgeThreeLanRoad: "OneEdgeTwoLanRoad",
+  OneEdgeThreeLanRoad: "OneEdgeThreeLanRoad",
 
   // 双向单车道直路
   TwoEdgeOneLanRoad: "TwoEdgeOneLanRoad",

src/views/graphic/geos/del.vue

@@ -1,13 +1,13 @@
 <template>
-  <GeoTeleport :menus="menus" class="geo-teleport-use" />
+  <GeoTeleport :menus="menus" class="geo-teleport-use" v-if="geo.type !== VectorType.CurveRoadPoint" />
 </template>
 
 <script setup lang="ts">
 import GeoTeleport from "@/views/graphic/geos/geo-teleport.vue";
-import UiIcon from "@/components/base/components/icon/index.vue";
-import {drawRef, uiType, UIType} from '@/hook/useGraphic'
+import {drawRef, FocusVector, VectorType} from '@/hook/useGraphic'
 import GeoActions from "@/graphic/enum/GeoActions"
 
+const props = defineProps<{geo: FocusVector}>()
 const menus = [
   {
     key: 'del',

vite.config.ts

@@ -11,6 +11,9 @@ export default async ({ mode }) => {
   if (isDev) {
     await createMockServer(Number(env.VITE_DEV_PORT));
     server = {
+      watch: {
+        ignored: ['!**/node_modules/your-package-name/**'],
+      },
       proxy: {
         ["/" + env.VITE_API_BASE_URL]: {
           target: `http://localhost:${env.VITE_DEV_PORT}`,
@@ -28,6 +31,7 @@ export default async ({ mode }) => {
   }
 
   return defineConfig({
+
     base: "./",
     mode,
     build: {