逻辑区段调整

src/graphics/logicSection/LogicSection.ts

@@ -5,6 +5,9 @@ import {
   JlGraphic,
   JlGraphicTemplate,
   VectorText,
+  calculateLineMidpoint,
+  getNormalVector,
+  movePointAlongNormal,
 } from 'src/jl-graphic';
 
 export interface ILogicSectionData extends GraphicData {
@@ -26,24 +29,29 @@ export interface ILogicSectionData extends GraphicData {
 export const LogicSectionConsts = {
   lineColor: '0xff0000',
   lineWidth: 2,
+  labelColor: '0xFF00FF',
+  divisionColor: '0xFF00FF',
+  divisionWidth: 1,
 };
 
 export class LogicSection extends JlGraphic {
   static Type = 'LogicSection';
   lineGraphic: Graphics;
   labelGraphic: VectorText;
+  divisionGraphic: Graphics = new Graphics();
   constructor() {
     super(LogicSection.Type);
     this.lineGraphic = new Graphics();
     this.labelGraphic = new VectorText();
     this.labelGraphic.setVectorFontSize(14);
     this.labelGraphic.anchor.set(0.5);
-    this.labelGraphic.style.fill = '#0f0';
+    this.labelGraphic.style.fill = LogicSectionConsts.labelColor;
     this.labelGraphic.transformSave = true;
     this.labelGraphic.name = 'label';
     this.transformSave = true;
     this.addChild(this.lineGraphic);
     this.addChild(this.labelGraphic);
+    this.addChild(this.divisionGraphic);
   }
 
   get datas(): ILogicSectionData {
@@ -65,6 +73,46 @@ export class LogicSection extends JlGraphic {
         this.lineGraphic.moveTo(p.x, p.y);
       }
     });
+    let normalVector = getNormalVector(
+      this.datas.points[0],
+      this.datas.points[1]
+    );
+    if (this.datas.points[0].x > this.datas.points[1].x) {
+      normalVector = getNormalVector(
+        this.datas.points[1],
+        this.datas.points[0]
+      );
+    }
+    this.divisionGraphic.clear();
+    this.divisionGraphic.lineStyle(
+      LogicSectionConsts.divisionWidth,
+      LogicSectionConsts.divisionColor
+    );
+    const nextP = movePointAlongNormal(this.datas.points[0], normalVector, 5);
+    const nextP1 = this.datas.points[0];
+    this.divisionGraphic.moveTo(nextP1.x, nextP1.y);
+    this.divisionGraphic.lineTo(nextP.x, nextP.y);
+    let normalVector2 = getNormalVector(
+      this.datas.points[this.datas.points.length - 2],
+      this.datas.points[this.datas.points.length - 1]
+    );
+    if (
+      this.datas.points[this.datas.points.length - 2].x >
+      this.datas.points[this.datas.points.length - 1].x
+    ) {
+      normalVector2 = getNormalVector(
+        this.datas.points[this.datas.points.length - 1],
+        this.datas.points[this.datas.points.length - 2]
+      );
+    }
+    const nextP2 = movePointAlongNormal(
+      this.datas.points[this.datas.points.length - 1],
+      normalVector2,
+      5
+    );
+    const nextP3 = this.datas.points[this.datas.points.length - 1];
+    this.divisionGraphic.moveTo(nextP3.x, nextP3.y);
+    this.divisionGraphic.lineTo(nextP2.x, nextP2.y);
     this.labelGraphic.text = this.datas.code;
     const labelPosition = this.datas.childTransforms?.find(
       (t) => t.name === this.labelGraphic.name
@@ -72,10 +120,11 @@ export class LogicSection extends JlGraphic {
     if (labelPosition) {
       this.labelGraphic.position.set(labelPosition.x, labelPosition.y);
     } else {
-      this.labelGraphic.position.set(
+      const centerPos = calculateLineMidpoint(
-        this.datas.points[0].x,
+        this.datas.points[0],
-        this.datas.points[0].y + 20
+        this.datas.points[this.datas.points.length - 1]
       );
+      this.labelGraphic.position.set(centerPos.x, centerPos.y + 20);
     }
   }
   get linePoints(): IPointData[] {