feat:

src/graphic/Controls/MoveRoad.js

@@ -26,7 +26,8 @@ export default class MoveRoad {
 
     let point = dataService.getRoadPoint(pointId);
     let road = dataService.getRoad(Object.keys(point.parent)[0]);
-    
+    let leftEdge = dataService.getRoadEdge(road.leftEdgeId);
+    let rightEdge = dataService.getRoadEdge(road.rightEdgeId);
 
     let linkedRoadPointId = null;
     let linkedRoadId = null;
@@ -136,6 +137,12 @@ export default class MoveRoad {
     // }
     roadService.initRoadWidthTipsPos(road)
     edgeService.updateEdgeForMovePoint(pointId);
+    if(leftEdge.roadSide){
+      leftEdge.initRoadSide()
+    }
+    if(rightEdge.roadSide){
+      rightEdge.initRoadSide()
+    }
     return true;
   }
 
@@ -1070,7 +1077,6 @@ export default class MoveRoad {
     const road = dataService.getRoad(roadId);
     const startPoint = dataService.getRoadPoint(road.startId);
     const endPoint = dataService.getRoadPoint(road.endId);
-   
     if (
       Object.keys(startPoint.getParent()).length == 1 &&
       Object.keys(endPoint.getParent()).length == 1
@@ -1095,6 +1101,12 @@ export default class MoveRoad {
 
       roadService.setLanes(roadId);
       roadService.initRoadWidthTipsPos(road)
+      if(leftEdge.roadSide){
+        leftEdge.initRoadSide()
+      }
+      if(rightEdge.roadSide){
+        rightEdge.initRoadSide()
+      }
     }
   }
 
@@ -1299,6 +1311,12 @@ export default class MoveRoad {
       roadService.updateForWidth(parent, newWidth, dir);
     }
     roadService.initRoadWidthTipsPos(road)
+    if(leftEdge.roadSide){
+      leftEdge.initRoadSide()
+    }
+    if(rightEdge.roadSide){
+      rightEdge.initRoadSide()
+    }
   }
 
   moveCurveEdge(curveEdgeId, index, position) {

src/graphic/Controls/UIControl.js

@@ -1,39 +1,39 @@
-import { coordinate } from "../Coordinate.js";
-import LayerEvents from "../enum/LayerEvents.js";
-import UIEvents from "../enum/UIEvents.js";
-import RoadTemplate from "../enum/RoadTemplate.js";
-import VectorType from "../enum/VectorType.js";
-import VectorStyle from "../enum/VectorStyle.js";
-import VectorWeight from "../enum/VectorWeight.js";
-import GeoActions from "../enum/GeoActions.js";
-import VectorEvents from "../enum/VectorEvents.js";
-import SVGType from "../enum/SVGType.js";
-import { stateService } from "../Service/StateService.js";
-import { uiService } from "../Service/UIService.js";
-import { dataService } from "../Service/DataService.js";
-import { historyService } from "../Service/HistoryService.js";
-import { elementService } from "../Service/ElementService";
-import { lineService } from "../Service/LineService.js";
-import { circleService } from "../Service/CircleService.js";
-import { textService } from "../Service/TextService.js";
-import { svgService } from "../Service/SVGService.js";
-import { magnifierService } from "../Service/MagnifierService.js";
-import { mathUtil } from "../Util/MathUtil";
-import Constant from "../Constant";
+import { coordinate } from '../Coordinate.js';
+import LayerEvents from '../enum/LayerEvents.js';
+import UIEvents from '../enum/UIEvents.js';
+import RoadTemplate from '../enum/RoadTemplate.js';
+import VectorType from '../enum/VectorType.js';
+import VectorStyle from '../enum/VectorStyle.js';
+import VectorWeight from '../enum/VectorWeight.js';
+import GeoActions from '../enum/GeoActions.js';
+import VectorEvents from '../enum/VectorEvents.js';
+import SVGType from '../enum/SVGType.js';
+import { stateService } from '../Service/StateService.js';
+import { uiService } from '../Service/UIService.js';
+import { dataService } from '../Service/DataService.js';
+import { historyService } from '../Service/HistoryService.js';
+import { elementService } from '../Service/ElementService';
+import { lineService } from '../Service/LineService.js';
+import { circleService } from '../Service/CircleService.js';
+import { textService } from '../Service/TextService.js';
+import { svgService } from '../Service/SVGService.js';
+import { magnifierService } from '../Service/MagnifierService.js';
+import { mathUtil } from '../Util/MathUtil';
+import Constant from '../Constant';
 // import { roomsUtil } from "../Room/RoomsUtil.js";
-import { addRoad } from "../Controls/AddRoad";
-import { addLine } from "./AddLine.js";
-import VectorCategory from "../enum/VectorCategory.js";
+import { addRoad } from '../Controls/AddRoad';
+import { addLine } from './AddLine.js';
+import VectorCategory from '../enum/VectorCategory.js';
 // import { floorplanData } from "../VectorData.js";
 
-import { pointService } from "../Service/PointService.js";
-import Settings from "../Settings.js";
-import { addPoint } from "./AddPoint.js";
-import { locationModeControl } from "./LocationModeControl.js";
-import { curveRoadPointService } from "../Service/CurveRoadPointService.js";
-import { roadService } from "../Service/RoadService.js";
-import { curveRoadService } from "../Service/CurveRoadService.js";
-import Msg from "../enum/Msg.js";
+import { pointService } from '../Service/PointService.js';
+import Settings from '../Settings.js';
+import { addPoint } from './AddPoint.js';
+import { locationModeControl } from './LocationModeControl.js';
+import { curveRoadPointService } from '../Service/CurveRoadPointService.js';
+import { roadService } from '../Service/RoadService.js';
+import { curveRoadService } from '../Service/CurveRoadService.js';
+import Msg from '../enum/Msg.js';
 
 export default class UIControl {
   constructor(layer, newsletter, graphicStateUI) {
@@ -104,7 +104,7 @@ export default class UIControl {
         uiService.setSelectPointCategory(VectorCategory.Point.NormalPoint);
         uiService.setSelectLineCategory(VectorCategory.Line.NormalLine);
         //执行新的事件
-        if (uiService.isBelongRoad(selectUI) || selectUI == "road") {
+        if (uiService.isBelongRoad(selectUI) || selectUI == 'road') {
           stateService.setEventName(LayerEvents.AddRoad);
         } else if (selectUI == UIEvents.CurveRoad) {
           stateService.setEventName(LayerEvents.AddCurveRoad);
@@ -145,7 +145,7 @@ export default class UIControl {
   }
 
   updateVectorForSelectUI(selectUI) {
-    console.log("selectUI", selectUI);
+    console.log('selectUI', selectUI);
     const focusItem = stateService.getFocusItem();
 
     // if (selectUI == VectorStyle.Bold || selectUI == VectorStyle.Thinning) {
@@ -168,9 +168,9 @@ export default class UIControl {
     if (uiService.isBelongRoadEdgeStyle(selectUI)) {
       let key = null;
       if (VectorStyle[selectUI]) {
-        key = "setStyle";
+        key = 'setStyle';
       } else if (VectorWeight[selectUI]) {
-        key = "setWeight";
+        key = 'setWeight';
       }
       if (focusItem.type == VectorType.Line) {
         let Line = dataService.getLine(focusItem.vectorId);
@@ -182,29 +182,33 @@ export default class UIControl {
         Line[key](selectUI);
       } else {
         let roadEdge = dataService.getRoadEdge(focusItem.vectorId);
-        if(selectUI == VectorStyle.RoadSide){//修改路缘线
-          if (!roadEdge) {
-            roadEdge = dataService.getCurveRoadEdge(focusItem.vectorId);
-          }
-          roadEdge.setRoadSide()
-        }else{
-          if(roadEdge.roadSide){
-            roadEdge.removeRoadSide()
-          }
-          if (roadEdge) {
-            // roadEdge.setStyle(selectUI);
+
+        if (roadEdge) {
+          if (selectUI == VectorStyle.RoadSide) {
+            //修改路缘线
+            roadEdge.initRoadSide();
+          } else {
             roadEdge[key](selectUI);
             let crossPoint = dataService.getCrossPoint4(focusItem.vectorId);
             if (crossPoint) {
               crossPoint[key](selectUI);
             }
+            if (roadEdge.roadSide) {
+              roadEdge.removeRoadSide();
+            }
+          }
+        } else {
+          roadEdge = dataService.getCurveRoadEdge(focusItem.vectorId);
+          if (selectUI == VectorStyle.RoadSide) {
+            //修改路缘线
+            // roadEdge.initRoadSide();
           } else {
-            roadEdge = dataService.getCurveRoadEdge(focusItem.vectorId);
-            // roadEdge.setStyle(selectUI);
             roadEdge[key](selectUI);
+            if (roadEdge.roadSide) {
+              // roadEdge.removeRoadSide();
+            }
           }
         }
-        
       }
 
       this.layer.history.save();
@@ -372,9 +376,9 @@ export default class UIControl {
       case VectorType.Point:
         let point = dataService.getPoint(vectorId);
         let parent = point.getParent();
-        for(let key in parent){
-          if(Settings.baseLineId == key){
-            this.layer.initLocation(); 
+        for (let key in parent) {
+          if (Settings.baseLineId == key) {
+            this.layer.initLocation();
             break;
           }
         }
@@ -398,52 +402,27 @@ export default class UIControl {
           if (endPoint.getCategory() != VectorCategory.Point.BasePoint) {
             pointService.deletePoint(line.endId);
           }
-        } else if (
-          line.getCategory() == VectorCategory.Line.LocationLineByFixPoint
-        ) {
+        } else if (line.getCategory() == VectorCategory.Line.LocationLineByFixPoint) {
           let lines = dataService.getLines();
           for (let key in lines) {
             let _line = dataService.getLine(key);
-            if (
-              _line.getCategory() == VectorCategory.Line.ExtendedPositionLine
-            ) {
-              if (
-                line.startId == _line.startId ||
-                line.startId == _line.endId ||
-                line.endId == _line.startId ||
-                line.endId == _line.endId
-              ) {
+            if (_line.getCategory() == VectorCategory.Line.ExtendedPositionLine) {
+              if (line.startId == _line.startId || line.startId == _line.endId || line.endId == _line.startId || line.endId == _line.endId) {
                 dataService.deleteLine(key);
                 break;
               }
             }
           }
-        } else if (
-          line.getCategory() == VectorCategory.Line.LocationLineByBasePoint
-        ) {
+        } else if (line.getCategory() == VectorCategory.Line.LocationLineByBasePoint) {
           let lines = dataService.getLines();
           for (let key in lines) {
             let _line = dataService.getLine(key);
-            if (
-              _line.getCategory() == VectorCategory.Line.ExtendedPositionLine
-            ) {
-              if (
-                line.startId == _line.startId ||
-                line.startId == _line.endId ||
-                line.endId == _line.startId ||
-                line.endId == _line.endId
-              ) {
+            if (_line.getCategory() == VectorCategory.Line.ExtendedPositionLine) {
+              if (line.startId == _line.startId || line.startId == _line.endId || line.endId == _line.startId || line.endId == _line.endId) {
                 dataService.deleteLine(key);
               }
-            } else if (
-              _line.getCategory() == VectorCategory.Line.GuideLocationLine
-            ) {
-              if (
-                line.startId == _line.startId ||
-                line.startId == _line.endId ||
-                line.endId == _line.startId ||
-                line.endId == _line.endId
-              ) {
+            } else if (_line.getCategory() == VectorCategory.Line.GuideLocationLine) {
+              if (line.startId == _line.startId || line.startId == _line.endId || line.endId == _line.startId || line.endId == _line.endId) {
                 dataService.deleteLine(key);
               }
             }
@@ -456,10 +435,7 @@ export default class UIControl {
         break;
       case VectorType.CurvePoint:
         const curvePoint = dataService.getCurvePoint(vectorId);
-        lineService.deleteCrossPointForCurveLine(
-          vectorId,
-          curvePoint.getParent()
-        );
+        lineService.deleteCrossPointForCurveLine(vectorId, curvePoint.getParent());
         break;
       case VectorType.Circle:
         dataService.deleteCircle(vectorId);
@@ -566,7 +542,7 @@ export default class UIControl {
   }
 
   getCadBlob(canvas) {
-    var type = "jpg";
+    var type = 'jpg';
     return new Promise((resolve) => canvas.toBlob(resolve, `${type}/image`));
   }
 
@@ -585,38 +561,19 @@ export default class UIControl {
   // }
 
   saveFile(data, filename) {
-    var save_link = document.createElementNS(
-      "http://www.w3.org/1999/xhtml",
-      "a"
-    );
+    var save_link = document.createElementNS('http://www.w3.org/1999/xhtml', 'a');
     save_link.href = data;
     save_link.download = filename;
 
-    var event = document.createEvent("MouseEvents");
-    event.initMouseEvent(
-      "click",
-      true,
-      false,
-      window,
-      0,
-      0,
-      0,
-      0,
-      0,
-      false,
-      false,
-      false,
-      false,
-      0,
-      null
-    );
+    var event = document.createEvent('MouseEvents');
+    event.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
     save_link.dispatchEvent(event);
   }
 
   _fixType(type) {
-    type = type.toLowerCase().replace(/jpg/i, "jpeg");
+    type = type.toLowerCase().replace(/jpg/i, 'jpeg');
     var r = type.match(/png|jpeg|bmp|gif/)[0];
-    return "image/" + r;
+    return 'image/' + r;
   }
   /****************************************************************************针对菜单*******************************************************************************/
 
@@ -684,7 +641,7 @@ export default class UIControl {
     this.graphicStateUI.continuedMode = true;
   }
   confirmEntry() {
-    console.log("确认");
+    console.log('确认');
     this.graphicStateUI.continuedMode = false;
     this.layer.exit();
     this.layer.history.save();
@@ -693,7 +650,7 @@ export default class UIControl {
     uiService.setSelectLineCategory(VectorCategory.Line.NormalLine);
   }
   confirmCancel() {
-    console.log("取消");
+    console.log('取消');
     this.graphicStateUI.continuedMode = false;
     this.layer.exit();
     this.layer.history.save();
@@ -705,13 +662,9 @@ export default class UIControl {
 
   // 设置默认设置
   setDefaultSetting(setting) {
-    console.log("获得设置", setting);
-    uiService.setRoadMidDivideWidth(
-      setting.roadQuarantineWidth / coordinate.res
-    );
-    uiService.setCurveRoadMidDivideWidth(
-      setting.roadQuarantineWidth / coordinate.res
-    );
+    console.log('获得设置', setting);
+    uiService.setRoadMidDivideWidth(setting.roadQuarantineWidth / coordinate.res);
+    uiService.setCurveRoadMidDivideWidth(setting.roadQuarantineWidth / coordinate.res);
     Constant.defaultMidDivideWidth = setting.roadQuarantineWidth;
     uiService.setSingleLaneWidth(setting.singleRoadWidth / coordinate.res);
     Constant.defaultSingleLaneWidth = setting.singleRoadWidth;

src/graphic/Geometry/CurveRoadEdge.js

@@ -4,6 +4,7 @@ import VectorType from "../enum/VectorType.js";
 import { mathUtil } from "../Util/MathUtil.js";
 import VectorWight from "../enum/VectorWeight.js";
 import VectorStyle from "../enum/VectorStyle.js";
+import { dataService } from '../Service/DataService.js';
 import Constant from '../Constant';
 export default class CurveRoadEdge extends Geometry {
   constructor(start, end, vectorId, parentId, points) {
@@ -17,7 +18,7 @@ export default class CurveRoadEdge extends Geometry {
     this.points = points || [];
     this.curves = [];
     this.geoType = VectorType.CurveRoadEdge;
-    this.roadSide = null;
+    // this.roadSide = null;
     this.setId(vectorId);
     this.setPositions(start, end);
   }
@@ -47,15 +48,6 @@ export default class CurveRoadEdge extends Geometry {
       return null;
     }
   }
-  // setRoadSide() {
-  //   if (!this.roadSide) {
-  //     this.roadSide = {};
-  //     this.roadSide['width'] = Constant.roadSideWidth;
-  //   }
-  //   this.roadSide['start'] = this.start;
-  //   this.roadSide['end'] = this.end;
-  // }
-  // removeRoadSide() {
-  //   this.roadSide = null;
-  // }
+
+
 }

src/graphic/Geometry/Geometry.js

@@ -108,6 +108,7 @@ export default class Geometry {
     this.weight = weight;
   }
 
+
   getWeight() {
     return this.weight;
   }

src/graphic/Geometry/RoadEdge.js

@@ -56,23 +56,57 @@ export default class RoadEdge extends Geometry {
     let line = mathUtil.createLine1(this.start, this.end);
     return line;
   }
-  setRoadSide() {
-    let line = this.getLine()
-    let startPoint = this.start
-    let endPoint = this.end
-    let lines = mathUtil.getParallelLineForDistance(line, Constant.roadSideWidth);
-    let point1 = mathUtil.getJoinLinePoint(startPoint, lines.line1);
-    let point2 = mathUtil.getJoinLinePoint(endPoint, lines.line1);
+  initRoadSide() {
+    // let line = this.getLine();
+    let startPoint = this.start;
+    let road = dataService.getRoad(this.parent);
+
+    let endPoint = this.end;
+    // let lines = mathUtil.getParallelLineForDistance(line, Constant.roadSideWidth);
+    // let joinPoint = lines.line1;
+
+    let roadSidePoints = mathUtil.RectangleVertex(startPoint, endPoint, Constant.roadSideWidth * 2);
+
+
+    // for (let key in road) {
+    //   if (this.vectorId == road[key]) {
+    //     if (key == 'rightEdgeId') {
+    //       console.error('rightEdgeId')
+    //       joinPoint = lines.line2;
+    //     } else if (key == 'leftEdgeId') {
+    //       console.error('leftEdgeId')
+    //       joinPoint = lines.line1;
+    //     }
+    //   }
+    // }
+    // let point1 = mathUtil.getJoinLinePoint(startPoint, joinPoint);
+    // let point2 = mathUtil.getJoinLinePoint(endPoint, joinPoint);
 
     if (!this.roadSide) {
       this.roadSide = {};
       this.roadSide['width'] = Constant.roadSideWidth;
     }
-    this.roadSide['start'] = point1;
-    this.roadSide['end'] = point2;
+    for (let key in road) {
+      if (this.vectorId == road[key]) {
+        if (key == 'rightEdgeId') {
+          this.roadSide['start'] = roadSidePoints.rightEdgeStart;
+          this.roadSide['end'] = roadSidePoints.rightEdgeEnd;
+        } else if (key == 'leftEdgeId') {
+          this.roadSide['start'] = roadSidePoints.leftEdgeStart;
+          this.roadSide['end'] = roadSidePoints.leftEdgeEnd;
+        }
+      }
+    }
+    // this.roadSide['start'] = point1;
+    // this.roadSide['end'] = point2;
+  }
+  setRoadSideWidth(weight) {
+    this.roadSide.weight = weight;
+  }
+  setRoadSide(roadSide) {
+    this.roadSide = JSON.parse(JSON.stringify(roadSide));
   }
   removeRoadSide() {
     this.roadSide = null;
   }
-
 }

src/graphic/Layer.js

@@ -220,7 +220,7 @@ export default class Layer {
                 selectItem.dir
               );
             }
-           
+            roadService.initRoadWidthTipsPos(road)
           } else {
             road = dataService.getCurveRoad(selectItem.vectorId);
             if (road) {
@@ -241,7 +241,7 @@ export default class Layer {
               }
             }
           }
-          roadService.initRoadWidthTipsPos(road)
+          
           this.history.save();
           this.renderer.autoRedraw();
         }

src/graphic/ListenLayer.js

@@ -638,11 +638,17 @@ export default class ListenLayer {
       let rightLine = mathUtil.createLine1(rightEdge.start, rightEdge.end);
       let rightJoin = mathUtil.getJoinLinePoint(position, rightLine);
 
+      let leftSideLine =leftEdge.roadSide ? mathUtil.createLine1(leftEdge.roadSide.start, leftEdge.roadSide.end) : null;
+      let leftSideJoin = leftSideLine ? mathUtil.getJoinLinePoint(position, leftSideLine) : null;
+      
+      let rightSideLine =rightEdge.roadSide ? mathUtil.createLine1(rightEdge.roadSide.start, rightEdge.roadSide.end) : null;
+      let rightSideJoin = rightSideLine ? mathUtil.getJoinLinePoint(position, rightSideLine) : null;
       let distance = this.getDistance(position, join);
       if (
         mathUtil.isContainForSegment(join, startPoint, endPoint) &&
         (mathUtil.isContainForSegment(position, join, leftJoin) ||
-          mathUtil.isContainForSegment(position, join, rightJoin))
+          mathUtil.isContainForSegment(position, join, rightJoin)
+          )
       ) {
         if (!roadInfo.roadId || distance < roadInfo.distance) {
           roadInfo = {
@@ -672,29 +678,40 @@ export default class ListenLayer {
       }
 
       //检查edge
+ 
       distance = this.getDistance(position, leftJoin);
       if (
-        mathUtil.isContainForSegment(leftJoin, leftEdge.start, leftEdge.end) &&
-        distance < Constant.minAdsorbPix / 2
+        (mathUtil.isContainForSegment(leftJoin, leftEdge.start, leftEdge.end) &&
+        distance < Constant.minAdsorbPix / 2) ||
+        (mathUtil.isContainForSegment(join, startPoint, endPoint) && 
+        leftSideJoin && 
+        mathUtil.isContainForSegment(position, join, leftSideJoin))
+      
       ) {
         if (!edgeInfo.edgeId || distance < edgeInfo.distance) {
+
           edgeInfo = {
             edgeId: road.leftEdgeId,
             type: VectorType.RoadEdge,
             distance: distance,
             dir: "left",
           };
+
         }
       }
 
       distance = this.getDistance(position, rightJoin);
+      // console.error(mathUtil.isContainForSegment(position, join, rightSideJoin))
       if (
-        mathUtil.isContainForSegment(
+        (mathUtil.isContainForSegment(
           rightJoin,
           rightEdge.start,
           rightEdge.end
         ) &&
-        distance < Constant.minAdsorbPix / 2
+        distance < Constant.minAdsorbPix / 2) ||
+        (mathUtil.isContainForSegment(join, startPoint, endPoint) && 
+        rightSideJoin &&
+        mathUtil.isContainForSegment(position, join, rightSideJoin))
       ) {
         if (!edgeInfo.edgeId || distance < edgeInfo.distance) {
           edgeInfo = {
@@ -717,11 +734,13 @@ export default class ListenLayer {
         position,
         linkedRoadLine
       );
+
       roadInfo.x = linkedPosition.x;
       roadInfo.y = linkedPosition.y;
       if (edgeInfo.dir && !roadInfo.dir) {
         roadInfo.dir = edgeInfo.dir;
       }
+
       return roadInfo;
     } else if (edgeInfo.edgeId) {
       if (edgeInfo.dir == "left") {

src/graphic/Load.js

@@ -239,12 +239,13 @@ export default class Load {
         
         }
       }
-
+  
       if (dataLocal.roadEdges) {
         //当roadEdge有样式的时候需要设置
         let roads = []
         for (let edgeKey in dataLocal.roadEdges) {
           let edge = dataLocal.roadEdges[edgeKey];
+      
           if(!roads.includes(edge.parent)){
             roads.push(edge.parent)
           }
@@ -261,6 +262,10 @@ export default class Load {
           if (edge.weight) {
             newEdge.setWeight(edge.weight);
           }
+  
+          if(edge.roadSide){
+            newEdge.setRoadSide(edge.roadSide)
+          }
           newEdge.setLineWidth(edge.lineWidth);
           newEdge.setParent(edge.parent);
           

src/graphic/Service/DataService.js

@@ -81,7 +81,6 @@ export class DataService {
     this.vectorData.basePointIds = [];
     this.vectorData.texts = {};
     this.vectorData.svgs = {};
-    this.vectorData.roadStructures = {};
     this.vectorData.magnifiers = {};
     this.initGrid();
   }
@@ -598,7 +597,6 @@ export class DataService {
     this.vectorData.basePointIds = [];
     this.vectorData.texts = {};
     this.vectorData.svgs = {};
-    this.vectorData.roadStructures = {};
     this.vectorData.magnifiers = {};
   }
 

src/graphic/Service/SVGService.js

@@ -1,17 +1,22 @@
-import SVG from "../Geometry/SVG.js";
-import { dataService } from "./DataService.js";
-import { mathUtil } from "../Util/MathUtil.js";
-import { uiService } from "./UIService.js";
+import SVG from '../Geometry/SVG.js';
+import { dataService } from './DataService.js';
+import { mathUtil } from '../Util/MathUtil.js';
+import { uiService } from './UIService.js';
 export default class SVGService {
   constructor() {}
 
   create(position, type, svgId) {
     let svg = new SVG(position, type, svgId);
+    if (type == 'ZebraCrossing') {
+      this.setZebraCross(svg);
+    }
     dataService.addSVG(svg);
-  
     return svg;
   }
-
+  //设置斑马线属性
+  setZebraCross(svg) {
+    svg.style = { lineWidth: 2, lineSpace: 5 };
+  }
   copy(vectorId) {
     let SVG = dataService.getSVG(vectorId);
     let newCenter = uiService.getNewPositionForPop(SVG.center);

src/graphic/enum/VectorEvents.js

@@ -14,6 +14,8 @@ const VectorEvents = {
   AddLane: "AddLane",
   // 减车道
   DelLane: "DelLane",
+  //设置路缘线宽度
+  SetRoadSideWidth:"SetRoadSideWidth"
 };
 
 export default VectorEvents;

yarn.lock

@@ -957,6 +957,11 @@ klona@^2.0.6:
   resolved "http://192.168.0.47:4873/klona/-/klona-2.0.6.tgz#85bffbf819c03b2f53270412420a4555ef882e22"
   integrity sha512-dhG34DXATL5hSxJbIexCft8FChFXtmskoZYnoPWjXQuebWYCNkVeV3KkGegCK9CP1oswI/vQibS2GY7Em/sJJA==
 
+lodash-es@^4.17.21:
+  version "4.17.21"
+  resolved "http://192.168.0.47:4873/lodash-es/-/lodash-es-4.17.21.tgz#43e626c46e6591b7750beb2b50117390c609e3ee"
+  integrity sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==
+
 magic-string@^0.25.7:
   version "0.25.9"
   resolved "http://192.168.0.47:4873/magic-string/-/magic-string-0.25.9.tgz#de7f9faf91ef8a1c91d02c2e5314c8277dbcdd1c"
@@ -1424,6 +1429,13 @@ vue-tsc@^1.2.0:
     "@volar/vue-language-core" "1.2.0"
     "@volar/vue-typescript" "1.2.0"
 
+vue3-photo-preview@^0.3.0:
+  version "0.3.0"
+  resolved "http://192.168.0.47:4873/vue3-photo-preview/-/vue3-photo-preview-0.3.0.tgz#082941ccbaad8504adcc6bd6a02560eb125d515e"
+  integrity sha512-DeZ076yN85RcfWdhcgSYVEj5Y721mi6rmDoShDb4Bt7z7Q5Rfs4Y8PlP66OIrsyE0x4KVLdE0auJGxrxXRJXjA==
+  dependencies:
+    lodash-es "^4.17.21"
+
 vue@^3.2.47:
   version "3.2.47"
   resolved "http://192.168.0.47:4873/vue/-/vue-3.2.47.tgz#3eb736cbc606fc87038dbba6a154707c8a34cff0"