区段限速

graphic-pixi

@@ -1 +1 @@
-Subproject commit 91eb4a1d0835a8bc007febaf9054291c27d065ff
+Subproject commit 6cb5d39e4337a9e205447810fc6d1fb13c604967

src/drawApp/graphics/LogicSectionInteraction.ts

@@ -19,6 +19,7 @@ import { MenuItemOptions } from 'src/jl-graphic/ui/Menu';
 import { ContextMenu } from 'src/jl-graphic/ui/ContextMenu';
 import { useLineStore } from 'src/stores/line-store';
 import { setTrackStatus } from 'src/api/TurnoutApi';
+import { successNotify } from 'src/utils/CommonNotify';
 
 let menuItemHandler: (propName: keyof ILogicSectionState) => void;
 
@@ -54,6 +55,10 @@ const blocked: MenuItemOptions = {
   name: '轨道区段封锁 - blocked',
   handler: () => menuItemHandler('blocked'),
 };
+const speedLimit: MenuItemOptions = {
+  name: '限速 - speedLimit',
+  handler: () => menuItemHandler('speedLimit'),
+};
 
 const LogicSectionMenu = ContextMenu.init({
   name: 'LogicSection菜单',
@@ -68,6 +73,7 @@ const LogicSectionMenu = ContextMenu.init({
         atcInvalid,
         overlap,
         blocked,
+        speedLimit,
       ],
     },
   ],
@@ -141,10 +147,16 @@ export class LogicSectionOperationPlugin extends GraphicInteractionPlugin<LogicS
     menuItemHandler = (propName) => {
       const lineId = useLineStore().lineId?.toString();
       if (!lineId) return;
-      console.log({ ...section.states });
+      let val: boolean | number;
+      if (propName !== 'speedLimit') {
+        val = !section.states[propName];
+      } else {
+        val = section.states[propName] > 0 ? 0 : 20;
+        successNotify(`限速设为${val}`);
+      }
       setTrackStatus(lineId, {
         ...state,
-        [propName]: !section.states[propName],
+        [propName]: val,
       });
     };
     LogicSectionMenu.open(e.global);

src/graphics/logicSection/LogicSection.ts

@@ -6,6 +6,7 @@ import {
   JlGraphic,
   JlGraphicTemplate,
   VectorText,
+  getParallelOfPolyline,
 } from 'src/jl-graphic';
 import { ILineGraphic } from 'src/jl-graphic/plugins/GraphicEditPlugin';
 import { SectionConsts } from '../section/Section';
@@ -49,6 +50,7 @@ export class LogicSection extends JlGraphic implements ILineGraphic {
   static Type = 'LogicSection';
   lineGraphic: Graphics;
   labelGraphic: VectorText;
+  speedLimitGraphic: Graphics;
   dt = 0;
 
   constructor() {
@@ -61,8 +63,10 @@ export class LogicSection extends JlGraphic implements ILineGraphic {
     this.labelGraphic.transformSave = true;
     this.labelGraphic.name = 'label';
     this.transformSave = true;
+    this.speedLimitGraphic = new Graphics();
     this.addChild(this.lineGraphic);
     this.addChild(this.labelGraphic);
+    this.addChild(this.speedLimitGraphic);
   }
 
   get code(): string {
@@ -106,7 +110,6 @@ export class LogicSection extends JlGraphic implements ILineGraphic {
       lineColor = SectionConsts.blockedColor;
     } else if (this.states.overlap) {
       lineColor = SectionConsts.overlapColor;
-    } else if (this.states.failLocked) {
     }
     if (this.states.cut) {
       this.bindFlashAnimation(this.lineGraphic);
@@ -125,6 +128,19 @@ export class LogicSection extends JlGraphic implements ILineGraphic {
       }
     });
 
+    if (this.states.speedLimit > 0) {
+      console.log(this.states.speedLimit);
+      this.speedLimitGraphic.lineStyle(1, SectionConsts.speedLimitLineColor);
+      const [pointsL, pointsR] = this.getSpeedLimitPoints();
+      this.speedLimitGraphic.moveTo(pointsL[0].x, pointsL[0].y);
+      for (let i = 1; i < pointsL.length; i++) {
+        this.speedLimitGraphic.lineTo(pointsL[i].x, pointsL[i].y);
+      }
+      this.speedLimitGraphic.moveTo(pointsR[0].x, pointsR[0].y);
+      for (let i = 1; i < pointsR.length; i++) {
+        this.speedLimitGraphic.lineTo(pointsR[i].x, pointsR[i].y);
+      }
+    }
     this.labelGraphic.text = this.datas.code.split('-')[1];
     const labelPosition = this.datas.childTransforms?.find(
       (t) => t.name === this.labelGraphic.name
@@ -138,6 +154,12 @@ export class LogicSection extends JlGraphic implements ILineGraphic {
       );
     }
   }
+  getSpeedLimitPoints() {
+    return [
+      getParallelOfPolyline(this.datas.points, 'L', 12),
+      getParallelOfPolyline(this.datas.points, 'R', 12),
+    ];
+  }
   bindFlashAnimation(g: Graphics) {
     const flashAnimation = GraphicAnimation.init({
       name: 'flash',

src/graphics/section/Section.ts

@@ -60,6 +60,7 @@ export const SectionConsts = {
   atcInvalidColor: '#954', //atc报告失效
   blockedColor: '#606', //封锁
   overlapColor: '#ff0', //overlap
+  speedLimitLineColor: '#ff0', //限速线色
   lineWidth: 5,
 };
 

src/jl-graphic/utils/GraphicUtils.ts

@@ -2,6 +2,7 @@ import {
   Container,
   DisplayObject,
   IPointData,
+  Matrix,
   Point,
   Rectangle,
 } from 'pixi.js';
@@ -693,3 +694,37 @@ export function splitLineEvenly(
       ];
     });
 }
+
+/** 计算折线的平行线 */
+export function getParallelOfPolyline(
+  points: IPointData[],
+  direction: 'L' | 'R',
+  offset: number
+) {
+  if (points.length < 2) throw Error('折线点不能少于2个');
+  const normalVecs = points.map((p, i) => {
+    if (points[i - 1] && points[i + 1]) {
+    } else {
+      let point;
+      if (points[i + 1]) {
+        point = new Vector2([
+          points[i + 1].x - p.x,
+          points[i + 1].y - p.y,
+        ]).normalize();
+      } else {
+        point = new Vector2([
+          p.x - points[i - 1].x,
+          p.y - points[i - 1].y,
+        ]).normalize();
+      }
+      const rotate = new Matrix().rotate(
+        (direction === 'L' ? Math.PI : -Math.PI) / 2
+      );
+      return rotate.apply(point);
+    }
+  });
+  return points.map((p, i) => ({
+    x: p.x + offset * normalVecs[i]?.x,
+    y: p.y + offset * normalVecs[i]?.y,
+  }));
+}