继续

src/graphic/CanvasStyle/focus.js

@@ -1,64 +1,62 @@
-import def from './default.js'
+import def from "./default.js";
 
 const Road = {
   ...def.Road,
   realLineWidth: 4,
   strokeStyle: "#3290FF",
-}
+};
 
 const CurveRoad = {
   ...def.CurveRoad,
   ...Road,
   lineWidth: 2,
-}
+};
 
-const Tag = {
-  ...def.Tag,
+const Text = {
+  ...def.Text,
   strokeStyle: "#00C8AF",
   fillStyle: "#00C8AF",
-}
+};
 
 const Point = {
   ...def.Point,
   fillStyle: "#3290FF",
-}
+};
 
 const RoadPoint = {
   ...Point,
-}
+};
 
 const CurveRoadPoint = {
   ...def.CurveRoadPoint,
-  ...Point
-}
+  ...Point,
+};
 
 const ControlPoint = {
   ...def.ControlPoint,
   fillStyle: "#3290FF",
-}
-
+};
 
 const RoadEdge = {
   ...def.RoadEdge,
   lineWidth: 2,
   strokeStyle: "#3290FF",
-}
+};
 
 const CurveRoadEdge = {
   ...def.CurveRoadEdge,
   lineWidth: 2,
   strokeStyle: "#3290FF",
-}
-
+};
 
 export default {
   Road,
-  Tag,
+  Text,
   Point,
   RoadPoint,
   CurveRoadPoint,
   ControlPoint,
   CurveRoad,
   RoadEdge,
-  CurveRoadEdge
-}
+  CurveRoadEdge,
+};

src/graphic/CanvasStyle/select.js

@@ -1,62 +1,62 @@
-import def from './default.js'
+import def from "./default.js";
 
 const Road = {
   ...def.Road,
   realLineWidth: 4,
   strokeStyle: "#3290FF",
-}
+};
 
 const CurveRoad = {
   ...def.CurveRoad,
   ...Road,
   lineWidth: 2,
-}
+};
 
-const Tag = {
-  ...def.Tag,
+const Text = {
+  ...def.Text,
   strokeStyle: "#00C8AF",
   fillStyle: "#00C8AF",
-}
+};
 
 const RoadEdge = {
   ...def.RoadEdge,
   lineWidth: 2,
   strokeStyle: "#3290FF",
-}
+};
 
 const CurveRoadEdge = {
   ...def.CurveRoadEdge,
   lineWidth: 2,
   strokeStyle: "#3290FF",
-}
+};
 
 const Point = {
   ...def.Point,
   fillStyle: "#3290FF",
-}
+};
 
 const RoadPoint = {
-  ...Point
-}
+  ...Point,
+};
 
 const CurveRoadPoint = {
   ...def.CurveRoadPoint,
-  ...Point
-}
+  ...Point,
+};
 
 const ControlPoint = {
   ...def.ControlPoint,
   fillStyle: "#3290FF",
-}
+};
 
 export default {
   Road,
-  Tag,
+  Text,
   Point,
   RoadPoint,
   CurveRoadPoint,
   ControlPoint,
   CurveRoad,
   RoadEdge,
-  CurveRoadEdge
-}
+  CurveRoadEdge,
+};

src/graphic/Renderer/Draw.js

@@ -147,15 +147,15 @@ export default class Draw {
         ctx.moveTo(startScreen.x, startScreen.y);
         ctx.lineTo(endScreen.x, endScreen.y);
         ctx.stroke();
-      }
+      };
 
       ctx.save();
       const vectorStyle = help.setVectorStyle(ctx, vector);
-      ctx.lineWidth = vector.midDivideWidth
-      draw()
-      ctx.strokeStyle = Style.bgColor
-      ctx.lineWidth = vector.midDivideWidth - vectorStyle.realLineWidth
-      draw()
+      ctx.lineWidth = vector.midDivideWidth;
+      draw();
+      ctx.strokeStyle = Style.bgColor;
+      ctx.lineWidth = vector.midDivideWidth - vectorStyle.realLineWidth;
+      draw();
       ctx.restore();
     }
 
@@ -252,10 +252,14 @@ export default class Draw {
 
   drawControlPoint(vector) {
     const start = coordinate.getScreenXY(
-      dataService.getRoadEdge(vector.edgeInfo1.id).getPosition(vector.edgeInfo1.dir)
+      dataService
+        .getRoadEdge(vector.edgeInfo1.id)
+        .getPosition(vector.edgeInfo1.dir)
     );
     const end = coordinate.getScreenXY(
-      dataService.getRoadEdge(vector.edgeInfo2.id).getPosition(vector.edgeInfo2.dir)
+      dataService
+        .getRoadEdge(vector.edgeInfo2.id)
+        .getPosition(vector.edgeInfo2.dir)
     );
     const pt2 = this.twoOrderBezier(
       0.5,
@@ -288,14 +292,13 @@ export default class Draw {
     ctx.quadraticCurveTo(pt.x, pt.y, end.x, end.y);
     ctx.stroke();
     ctx.restore();
-
   }
 
   drawCurveRoad(vector) {
     if (vector.display && vector.midDivide) {
       const covesArray = help.transformCoves([
         vector.midDivide.leftMidDivideCurves,
-        vector.midDivide.rightMidDivideCurves
+        vector.midDivide.rightMidDivideCurves,
       ]);
       const ctx = this.context;
       ctx.save();
@@ -350,14 +353,12 @@ export default class Draw {
   }
 
   drawRoadPoint(vector) {
-    this.drawPoint(vector)
+    this.drawPoint(vector);
   }
   drawPoint(vector) {
     const pt = coordinate.getScreenXY({ x: vector.x, y: vector.y });
     const ctx = this.context;
-    const draw = () => {
-
-    }
+    const draw = () => {};
 
     help.setVectorStyle(ctx, vector, vector.geoType || "Point");
     ctx.beginPath();
@@ -421,7 +422,7 @@ export default class Draw {
   drawText(position, txt, angle) {
     const ctx = this.context;
     ctx.save();
-    help.setVectorStyle(ctx, null,"Text");
+    help.setVectorStyle(ctx, null, "Text");
 
     const pt = coordinate.getScreenXY(position);
     if (angle) {
@@ -434,56 +435,56 @@ export default class Draw {
     ctx.restore();
   }
 
-  drawTag(geometry, styleType, hide) {
+  drawText(geometry, styleType, hide) {
     this.context.save();
 
-    this.context.lineWidth = Style.Tag.lineWidth * coordinate.ratio;
-    this.context.strokeStyle = Style.Tag.strokeStyle;
-    this.context.fillStyle = Style.Tag.fillStyle;
+    this.context.lineWidth = Style.Text.lineWidth * coordinate.ratio;
+    this.context.strokeStyle = Style.Text.strokeStyle;
+    this.context.fillStyle = Style.Text.fillStyle;
 
     if (styleType) {
       if (styleType == "style-1") {
         this.context.lineWidth =
-          Style.DownLoad.style1.Tag.lineWidth * coordinate.ratio;
-        this.context.strokeStyle = Style.DownLoad.style1.Tag.strokeStyle;
-        this.context.fillStyle = Style.DownLoad.style1.Tag.fillStyle;
+          Style.DownLoad.style1.Text.lineWidth * coordinate.ratio;
+        this.context.strokeStyle = Style.DownLoad.style1.Text.strokeStyle;
+        this.context.fillStyle = Style.DownLoad.style1.Text.fillStyle;
       } else if (styleType == "style-2") {
         this.context.lineWidth =
-          Style.DownLoad.style2.Tag.lineWidth * coordinate.ratio;
-        this.context.strokeStyle = Style.DownLoad.style2.Tag.strokeStyle;
-        this.context.fillStyle = Style.DownLoad.style2.Tag.fillStyle;
+          Style.DownLoad.style2.Text.lineWidth * coordinate.ratio;
+        this.context.strokeStyle = Style.DownLoad.style2.Text.strokeStyle;
+        this.context.fillStyle = Style.DownLoad.style2.Text.fillStyle;
       } else if (styleType == "style-3") {
         this.context.lineWidth =
-          Style.DownLoad.style3.Tag.lineWidth * coordinate.ratio;
-        this.context.strokeStyle = Style.DownLoad.style3.Tag.strokeStyle;
-        this.context.fillStyle = Style.DownLoad.style3.Tag.fillStyle;
+          Style.DownLoad.style3.Text.lineWidth * coordinate.ratio;
+        this.context.strokeStyle = Style.DownLoad.style3.Text.strokeStyle;
+        this.context.fillStyle = Style.DownLoad.style3.Text.fillStyle;
       } else if (styleType == "style-4") {
         this.context.lineWidth =
-          Style.DownLoad.style4.Tag.lineWidth * coordinate.ratio;
-        this.context.strokeStyle = Style.DownLoad.style4.Tag.strokeStyle;
-        this.context.fillStyle = Style.DownLoad.style4.Tag.fillStyle;
+          Style.DownLoad.style4.Text.lineWidth * coordinate.ratio;
+        this.context.strokeStyle = Style.DownLoad.style4.Text.strokeStyle;
+        this.context.fillStyle = Style.DownLoad.style4.Text.fillStyle;
       }
     } else {
       const selectItem = stateService.getSelectItem();
       const draggingItem = stateService.getDraggingItem();
       const focusItem = stateService.getFocusItem();
 
-      if (selectItem && selectItem.type == VectorType.Tag) {
+      if (selectItem && selectItem.type == VectorType.Text) {
         if (geometry.vectorId == selectItem.vectorId) {
-          this.context.strokeStyle = Style.Select.Tag.strokeStyle;
-          this.context.fillStyle = Style.Select.Tag.fillStyle;
+          this.context.strokeStyle = Style.Select.Text.strokeStyle;
+          this.context.fillStyle = Style.Select.Text.fillStyle;
         }
-      } else if (draggingItem && draggingItem.type == VectorType.Tag) {
+      } else if (draggingItem && draggingItem.type == VectorType.Text) {
         if (geometry.vectorId == draggingItem.vectorId) {
-          this.context.strokeStyle = Style.Select.Tag.strokeStyle;
-          this.context.fillStyle = Style.Select.Tag.fillStyle;
+          this.context.strokeStyle = Style.Select.Text.strokeStyle;
+          this.context.fillStyle = Style.Select.Text.fillStyle;
         }
       }
 
-      if (focusItem && focusItem.type == VectorType.Tag) {
+      if (focusItem && focusItem.type == VectorType.Text) {
         if (geometry.vectorId == focusItem.vectorId) {
-          this.context.strokeStyle = Style.Focus.Tag.strokeStyle;
-          this.context.fillStyle = Style.Focus.Tag.fillStyle;
+          this.context.strokeStyle = Style.Focus.Text.strokeStyle;
+          this.context.fillStyle = Style.Focus.Text.fillStyle;
         }
       }
     }
@@ -499,8 +500,8 @@ export default class Draw {
         });
       }
 
-      this.context.strokeStyle = Style.Tag.strokeStyle_adding;
-      this.context.fillStyle = Style.Tag.fillStyle_adding;
+      this.context.strokeStyle = Style.Text.strokeStyle_adding;
+      this.context.fillStyle = Style.Text.fillStyle_adding;
       this.context.beginPath();
       this.context.moveTo(points[0].x, points[0].y);
       this.context.lineTo(points[1].x, points[1].y);