@logicflow/core 2.1.8 → 2.1.10

package/es/model/GraphModel.js

@@ -495,7 +495,7 @@ var GraphModel = /** @class */ (function () {
                 edgeDragging = true;
                 break;
             }
-            else {
+            if (!edgeMode.virtual) {
                 edges.push(edgeMode.getHistoryData());
             }
         }

package/es/model/edge/PolylineEdgeModel.d.ts

@@ -12,6 +12,13 @@ export declare class PolylineEdgeModel extends BaseEdgeModel {
     offset?: number;
     dbClickPosition?: Point;
     initEdgeData(data: LogicFlow.EdgeConfig): void;
+    setAttributes(): void;
+    orthogonalizePath(points: Point[]): Point[];
+    /**
+     * 计算默认 offset：箭头与折线重叠长度 + 5
+     * 重叠长度采用箭头样式中的 offset（沿边方向的长度）
+     */
+    private getDefaultOffset;
     getEdgeStyle(): {
         [x: string]: unknown;
         fill?: string | undefined;

package/es/model/edge/PolylineEdgeModel.js

@@ -69,12 +69,139 @@ var PolylineEdgeModel = /** @class */ (function (_super) {
         return _this;
     }
     PolylineEdgeModel.prototype.initEdgeData = function (data) {
-        this.offset = get(data, 'properties.offset', 30);
+        var providedOffset = get(data, 'properties.offset');
+        // 当用户未传入 offset 时，按“箭头与折线重叠长度 + 5”作为默认值
+        // 其中“重叠长度”采用箭头样式中的 offset（沿边方向的长度）
+        this.offset =
+            typeof providedOffset === 'number'
+                ? providedOffset
+                : this.getDefaultOffset();
         if (data.pointsList) {
-            this.pointsList = data.pointsList;
+            var corrected = this.orthogonalizePath(data.pointsList);
+            data.pointsList = corrected;
+            this.pointsList = corrected;
         }
         _super.prototype.initEdgeData.call(this, data);
     };
+    PolylineEdgeModel.prototype.setAttributes = function () {
+        var newOffset = this.properties.offset;
+        if (newOffset && newOffset !== this.offset) {
+            this.offset = newOffset;
+            this.updatePoints();
+        }
+    };
+    PolylineEdgeModel.prototype.orthogonalizePath = function (points) {
+        // 输入非法或不足两点时直接返回副本
+        if (!Array.isArray(points) || points.length < 2) {
+            return points;
+        }
+        // pushUnique: 向数组中添加唯一点，避免重复
+        var pushUnique = function (arr, p) {
+            var last = arr[arr.length - 1];
+            if (!last || last.x !== p.x || last.y !== p.y) {
+                arr.push({ x: p.x, y: p.y });
+            }
+        };
+        // isAxisAligned: 检查两点是否在同一条轴上
+        var isAxisAligned = function (a, b) { return a.x === b.x || a.y === b.y; };
+        // manhattanDistance: 计算两点在曼哈顿距离上的距离
+        var manhattanDistance = function (a, b) {
+            return Math.abs(a.x - b.x) + Math.abs(a.y - b.y);
+        };
+        // 1) 生成严格正交路径，尽量延续前一段方向以减少折点
+        var orthogonal = [];
+        pushUnique(orthogonal, points[0]);
+        // previousDirection: 记录前一段的方向，用于判断当前段的PreferredCorner
+        var previousDirection;
+        // 遍历所有点对，生成正交路径
+        for (var i = 0; i < points.length - 1; i++) {
+            var current = orthogonal[orthogonal.length - 1];
+            var next = points[i + 1];
+            if (!current || !next)
+                continue;
+            if (isAxisAligned(current, next)) {
+                pushUnique(orthogonal, next);
+                previousDirection =
+                    current.x === next.x
+                        ? SegmentDirection.VERTICAL
+                        : SegmentDirection.HORIZONTAL;
+                continue;
+            }
+            var cornerHV = { x: next.x, y: current.y };
+            var cornerVH = { x: current.x, y: next.y };
+            // 根据前一段的方向，优先选择能延续该方向的拐角点，以减少折点数量；
+            // 若前一段为垂直方向，则优先选择垂直-水平拐角(cornerVH)；
+            // 若前一段为水平方向，则优先选择水平-垂直拐角(cornerHV)；
+            // 若前一段无方向（初始情况），则比较两个拐角的曼哈顿距离，选更近者。
+            var preferredCorner = previousDirection === SegmentDirection.VERTICAL
+                ? cornerVH
+                : previousDirection === SegmentDirection.HORIZONTAL
+                    ? cornerHV
+                    : manhattanDistance(current, cornerHV) <=
+                        manhattanDistance(current, cornerVH)
+                        ? cornerHV
+                        : cornerVH;
+            if (preferredCorner.x !== current.x || preferredCorner.y !== current.y) {
+                pushUnique(orthogonal, preferredCorner);
+            }
+            pushUnique(orthogonal, next);
+            var a = orthogonal[orthogonal.length - 2];
+            var b = orthogonal[orthogonal.length - 1];
+            previousDirection =
+                a && b
+                    ? a.x === b.x
+                        ? SegmentDirection.VERTICAL
+                        : SegmentDirection.HORIZONTAL
+                    : previousDirection;
+        }
+        // 2) 去除冗余共线中间点
+        var simplified = [];
+        for (var i = 0; i < orthogonal.length; i++) {
+            var prev = orthogonal[i - 1];
+            var curr = orthogonal[i];
+            var next = orthogonal[i + 1];
+            // 如果当前点与前一个点和后一个点在同一条水平线或垂直线上，则跳过该点，去除冗余的共线中间点
+            if (prev &&
+                curr &&
+                next &&
+                ((prev.x === curr.x && curr.x === next.x) || // 水平共线
+                    (prev.y === curr.y && curr.y === next.y)) // 垂直共线
+            ) {
+                continue;
+            }
+            pushUnique(simplified, curr);
+        }
+        // 3) 保留原始起点与终点位置
+        if (simplified.length >= 2) {
+            simplified[0] = { x: points[0].x, y: points[0].y };
+            simplified[simplified.length - 1] = {
+                x: points[points.length - 1].x,
+                y: points[points.length - 1].y,
+            };
+        }
+        // 4) 结果校验：任意相邻段都必须为水平/垂直；失败则退化为起止两点
+        var isOrthogonal = simplified.length < 2 ||
+            simplified.every(function (_, idx, arr) {
+                if (idx === 0)
+                    return true;
+                return isAxisAligned(arr[idx - 1], arr[idx]);
+            });
+        return isOrthogonal
+            ? simplified
+            : [
+                { x: points[0].x, y: points[0].y },
+                { x: points[points.length - 1].x, y: points[points.length - 1].y },
+            ];
+    };
+    /**
+     * 计算默认 offset：箭头与折线重叠长度 + 5
+     * 重叠长度采用箭头样式中的 offset（沿边方向的长度）
+     */
+    PolylineEdgeModel.prototype.getDefaultOffset = function () {
+        var arrowStyle = this.getArrowStyle();
+        var arrowOverlap = typeof arrowStyle.offset === 'number' ? arrowStyle.offset : 0;
+        return arrowOverlap + 5;
+    };
     PolylineEdgeModel.prototype.getEdgeStyle = function () {
         var polyline = this.graphModel.theme.polyline;
         var style = _super.prototype.getEdgeStyle.call(this);
@@ -286,7 +413,7 @@ var PolylineEdgeModel = /** @class */ (function (_super) {
         return list;
     };
     PolylineEdgeModel.prototype.updatePath = function (pointList) {
-        this.pointsList = pointList;
+        this.pointsList = this.orthogonalizePath(pointList);
         this.points = this.getPath(this.pointsList);
     };
     PolylineEdgeModel.prototype.getData = function () {
@@ -321,7 +448,7 @@ var PolylineEdgeModel = /** @class */ (function (_super) {
             x: this.endPoint.x,
             y: this.endPoint.y,
         }, this.sourceNode, this.targetNode, this.offset || 0);
-        this.pointsList = pointsList;
+        this.pointsList = this.orthogonalizePath(pointsList);
         this.points = pointsList.map(function (point) { return "".concat(point.x, ",").concat(point.y); }).join(' ');
     };
     PolylineEdgeModel.prototype.updateStartPoint = function (anchor) {
@@ -544,13 +671,13 @@ var PolylineEdgeModel = /** @class */ (function (_super) {
     // 起终点拖拽调整过程中，进行折线路径更新
     PolylineEdgeModel.prototype.updateAfterAdjustStartAndEnd = function (_a) {
         var startPoint = _a.startPoint, endPoint = _a.endPoint, sourceNode = _a.sourceNode, targetNode = _a.targetNode;
-        this.pointsList = getPolylinePoints({
+        this.pointsList = this.orthogonalizePath(getPolylinePoints({
             x: startPoint.x,
             y: startPoint.y,
         }, {
             x: endPoint.x,
             y: endPoint.y,
-        }, sourceNode, targetNode, this.offset || 0);
+        }, sourceNode, targetNode, this.offset || 0));
         this.initPoints();
     };
     __decorate([

package/es/tool/MultipleSelectTool.js

@@ -55,6 +55,10 @@ var MultipleSelect = /** @class */ (function (_super) {
     function MultipleSelect(props) {
         var _this = _super.call(this, props) || this;
         _this.handleMouseDown = function (ev) {
+            // 多选区域的拖拽步长随缩放变化
+            var _a = _this.props, gridSize = _a.graphModel.gridSize, lf = _a.lf;
+            var SCALE_X = lf.getTransform().SCALE_X;
+            _this.stepDrag.setStep(gridSize * SCALE_X);
             _this.stepDrag.handleMouseDown(ev);
         };
         // 使多选区域的滚轮事件可以触发画布的滚轮事件

package/es/view/overlay/CanvasOverlay.js

@@ -103,6 +103,9 @@ var CanvasOverlay = /** @class */ (function (_super) {
                 if (selectElements.size > 0) {
                     graphModel.clearSelectElements();
                 }
+                // 如果是拖拽状态，不触发点击事件
+                if (_this.state.isDragging)
+                    return;
                 graphModel.eventCenter.emit(EventType.BLANK_CLICK, { e: ev });
             }
         };

package/lib/model/GraphModel.js

@@ -501,7 +501,7 @@ var GraphModel = /** @class */ (function () {
                 edgeDragging = true;
                 break;
             }
-            else {
+            if (!edgeMode.virtual) {
                 edges.push(edgeMode.getHistoryData());
             }
         }

package/lib/model/edge/PolylineEdgeModel.d.ts

@@ -12,6 +12,13 @@ export declare class PolylineEdgeModel extends BaseEdgeModel {
     offset?: number;
     dbClickPosition?: Point;
     initEdgeData(data: LogicFlow.EdgeConfig): void;
+    setAttributes(): void;
+    orthogonalizePath(points: Point[]): Point[];
+    /**
+     * 计算默认 offset：箭头与折线重叠长度 + 5
+     * 重叠长度采用箭头样式中的 offset（沿边方向的长度）
+     */
+    private getDefaultOffset;
     getEdgeStyle(): {
         [x: string]: unknown;
         fill?: string | undefined;

package/lib/model/edge/PolylineEdgeModel.js

@@ -72,12 +72,139 @@ var PolylineEdgeModel = /** @class */ (function (_super) {
         return _this;
     }
     PolylineEdgeModel.prototype.initEdgeData = function (data) {
-        this.offset = (0, lodash_es_1.get)(data, 'properties.offset', 30);
+        var providedOffset = (0, lodash_es_1.get)(data, 'properties.offset');
+        // 当用户未传入 offset 时，按“箭头与折线重叠长度 + 5”作为默认值
+        // 其中“重叠长度”采用箭头样式中的 offset（沿边方向的长度）
+        this.offset =
+            typeof providedOffset === 'number'
+                ? providedOffset
+                : this.getDefaultOffset();
         if (data.pointsList) {
-            this.pointsList = data.pointsList;
+            var corrected = this.orthogonalizePath(data.pointsList);
+            data.pointsList = corrected;
+            this.pointsList = corrected;
         }
         _super.prototype.initEdgeData.call(this, data);
     };
+    PolylineEdgeModel.prototype.setAttributes = function () {
+        var newOffset = this.properties.offset;
+        if (newOffset && newOffset !== this.offset) {
+            this.offset = newOffset;
+            this.updatePoints();
+        }
+    };
+    PolylineEdgeModel.prototype.orthogonalizePath = function (points) {
+        // 输入非法或不足两点时直接返回副本
+        if (!Array.isArray(points) || points.length < 2) {
+            return points;
+        }
+        // pushUnique: 向数组中添加唯一点，避免重复
+        var pushUnique = function (arr, p) {
+            var last = arr[arr.length - 1];
+            if (!last || last.x !== p.x || last.y !== p.y) {
+                arr.push({ x: p.x, y: p.y });
+            }
+        };
+        // isAxisAligned: 检查两点是否在同一条轴上
+        var isAxisAligned = function (a, b) { return a.x === b.x || a.y === b.y; };
+        // manhattanDistance: 计算两点在曼哈顿距离上的距离
+        var manhattanDistance = function (a, b) {
+            return Math.abs(a.x - b.x) + Math.abs(a.y - b.y);
+        };
+        // 1) 生成严格正交路径，尽量延续前一段方向以减少折点
+        var orthogonal = [];
+        pushUnique(orthogonal, points[0]);
+        // previousDirection: 记录前一段的方向，用于判断当前段的PreferredCorner
+        var previousDirection;
+        // 遍历所有点对，生成正交路径
+        for (var i = 0; i < points.length - 1; i++) {
+            var current = orthogonal[orthogonal.length - 1];
+            var next = points[i + 1];
+            if (!current || !next)
+                continue;
+            if (isAxisAligned(current, next)) {
+                pushUnique(orthogonal, next);
+                previousDirection =
+                    current.x === next.x
+                        ? constant_1.SegmentDirection.VERTICAL
+                        : constant_1.SegmentDirection.HORIZONTAL;
+                continue;
+            }
+            var cornerHV = { x: next.x, y: current.y };
+            var cornerVH = { x: current.x, y: next.y };
+            // 根据前一段的方向，优先选择能延续该方向的拐角点，以减少折点数量；
+            // 若前一段为垂直方向，则优先选择垂直-水平拐角(cornerVH)；
+            // 若前一段为水平方向，则优先选择水平-垂直拐角(cornerHV)；
+            // 若前一段无方向（初始情况），则比较两个拐角的曼哈顿距离，选更近者。
+            var preferredCorner = previousDirection === constant_1.SegmentDirection.VERTICAL
+                ? cornerVH
+                : previousDirection === constant_1.SegmentDirection.HORIZONTAL
+                    ? cornerHV
+                    : manhattanDistance(current, cornerHV) <=
+                        manhattanDistance(current, cornerVH)
+                        ? cornerHV
+                        : cornerVH;
+            if (preferredCorner.x !== current.x || preferredCorner.y !== current.y) {
+                pushUnique(orthogonal, preferredCorner);
+            }
+            pushUnique(orthogonal, next);
+            var a = orthogonal[orthogonal.length - 2];
+            var b = orthogonal[orthogonal.length - 1];
+            previousDirection =
+                a && b
+                    ? a.x === b.x
+                        ? constant_1.SegmentDirection.VERTICAL
+                        : constant_1.SegmentDirection.HORIZONTAL
+                    : previousDirection;
+        }
+        // 2) 去除冗余共线中间点
+        var simplified = [];
+        for (var i = 0; i < orthogonal.length; i++) {
+            var prev = orthogonal[i - 1];
+            var curr = orthogonal[i];
+            var next = orthogonal[i + 1];
+            // 如果当前点与前一个点和后一个点在同一条水平线或垂直线上，则跳过该点，去除冗余的共线中间点
+            if (prev &&
+                curr &&
+                next &&
+                ((prev.x === curr.x && curr.x === next.x) || // 水平共线
+                    (prev.y === curr.y && curr.y === next.y)) // 垂直共线
+            ) {
+                continue;
+            }
+            pushUnique(simplified, curr);
+        }
+        // 3) 保留原始起点与终点位置
+        if (simplified.length >= 2) {
+            simplified[0] = { x: points[0].x, y: points[0].y };
+            simplified[simplified.length - 1] = {
+                x: points[points.length - 1].x,
+                y: points[points.length - 1].y,
+            };
+        }
+        // 4) 结果校验：任意相邻段都必须为水平/垂直；失败则退化为起止两点
+        var isOrthogonal = simplified.length < 2 ||
+            simplified.every(function (_, idx, arr) {
+                if (idx === 0)
+                    return true;
+                return isAxisAligned(arr[idx - 1], arr[idx]);
+            });
+        return isOrthogonal
+            ? simplified
+            : [
+                { x: points[0].x, y: points[0].y },
+                { x: points[points.length - 1].x, y: points[points.length - 1].y },
+            ];
+    };
+    /**
+     * 计算默认 offset：箭头与折线重叠长度 + 5
+     * 重叠长度采用箭头样式中的 offset（沿边方向的长度）
+     */
+    PolylineEdgeModel.prototype.getDefaultOffset = function () {
+        var arrowStyle = this.getArrowStyle();
+        var arrowOverlap = typeof arrowStyle.offset === 'number' ? arrowStyle.offset : 0;
+        return arrowOverlap + 5;
+    };
     PolylineEdgeModel.prototype.getEdgeStyle = function () {
         var polyline = this.graphModel.theme.polyline;
         var style = _super.prototype.getEdgeStyle.call(this);
@@ -289,7 +416,7 @@ var PolylineEdgeModel = /** @class */ (function (_super) {
         return list;
     };
     PolylineEdgeModel.prototype.updatePath = function (pointList) {
-        this.pointsList = pointList;
+        this.pointsList = this.orthogonalizePath(pointList);
         this.points = this.getPath(this.pointsList);
     };
     PolylineEdgeModel.prototype.getData = function () {
@@ -324,7 +451,7 @@ var PolylineEdgeModel = /** @class */ (function (_super) {
             x: this.endPoint.x,
             y: this.endPoint.y,
         }, this.sourceNode, this.targetNode, this.offset || 0);
-        this.pointsList = pointsList;
+        this.pointsList = this.orthogonalizePath(pointsList);
         this.points = pointsList.map(function (point) { return "".concat(point.x, ",").concat(point.y); }).join(' ');
     };
     PolylineEdgeModel.prototype.updateStartPoint = function (anchor) {
@@ -547,13 +674,13 @@ var PolylineEdgeModel = /** @class */ (function (_super) {
     // 起终点拖拽调整过程中，进行折线路径更新
     PolylineEdgeModel.prototype.updateAfterAdjustStartAndEnd = function (_a) {
         var startPoint = _a.startPoint, endPoint = _a.endPoint, sourceNode = _a.sourceNode, targetNode = _a.targetNode;
-        this.pointsList = (0, util_1.getPolylinePoints)({
+        this.pointsList = this.orthogonalizePath((0, util_1.getPolylinePoints)({
             x: startPoint.x,
             y: startPoint.y,
         }, {
             x: endPoint.x,
             y: endPoint.y,
-        }, sourceNode, targetNode, this.offset || 0);
+        }, sourceNode, targetNode, this.offset || 0));
         this.initPoints();
     };
     __decorate([

package/lib/tool/MultipleSelectTool.js

@@ -57,6 +57,10 @@ var MultipleSelect = /** @class */ (function (_super) {
     function MultipleSelect(props) {
         var _this = _super.call(this, props) || this;
         _this.handleMouseDown = function (ev) {
+            // 多选区域的拖拽步长随缩放变化
+            var _a = _this.props, gridSize = _a.graphModel.gridSize, lf = _a.lf;
+            var SCALE_X = lf.getTransform().SCALE_X;
+            _this.stepDrag.setStep(gridSize * SCALE_X);
             _this.stepDrag.handleMouseDown(ev);
         };
         // 使多选区域的滚轮事件可以触发画布的滚轮事件

package/lib/view/overlay/CanvasOverlay.js

@@ -106,6 +106,9 @@ var CanvasOverlay = /** @class */ (function (_super) {
                 if (selectElements.size > 0) {
                     graphModel.clearSelectElements();
                 }
+                // 如果是拖拽状态，不触发点击事件
+                if (_this.state.isDragging)
+                    return;
                 graphModel.eventCenter.emit(constant_1.EventType.BLANK_CLICK, { e: ev });
             }
         };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@logicflow/core",
-  "version": "2.1.8",
+  "version": "2.1.10",
   "description": "LogicFlow, help you quickly create flowcharts",
   "main": "lib/index.js",
   "module": "es/index.js",

package/src/model/GraphModel.ts

@@ -561,7 +561,8 @@ export class GraphModel {
       if (edgeMode.isDragging) {
         edgeDragging = true
         break
-      } else {
+      }
+      if (!edgeMode.virtual) {
         edges.push(edgeMode.getHistoryData())
       }
     }

package/src/model/edge/PolylineEdgeModel.ts

@@ -34,13 +34,154 @@ export class PolylineEdgeModel extends BaseEdgeModel {
   @observable dbClickPosition?: Point
 
   initEdgeData(data: LogicFlow.EdgeConfig): void {
-    this.offset = get(data, 'properties.offset', 30)
+    const providedOffset = get(data, 'properties.offset')
+    // 当用户未传入 offset 时，按“箭头与折线重叠长度 + 5”作为默认值
+    // 其中“重叠长度”采用箭头样式中的 offset（沿边方向的长度）
+    this.offset =
+      typeof providedOffset === 'number'
+        ? providedOffset
+        : this.getDefaultOffset()
     if (data.pointsList) {
-      this.pointsList = data.pointsList
+      const corrected = this.orthogonalizePath(data.pointsList)
+      ;(data as any).pointsList = corrected
+      this.pointsList = corrected
     }
     super.initEdgeData(data)
   }
 
+  setAttributes() {
+    const { offset: newOffset } = this.properties
+    if (newOffset && newOffset !== this.offset) {
+      this.offset = newOffset
+      this.updatePoints()
+    }
+  }
+
+  orthogonalizePath(points: Point[]): Point[] {
+    // 输入非法或不足两点时直接返回副本
+    if (!Array.isArray(points) || points.length < 2) {
+      return points
+    }
+    // pushUnique: 向数组中添加唯一点，避免重复
+    const pushUnique = (arr: Point[], p: Point) => {
+      const last = arr[arr.length - 1]
+      if (!last || last.x !== p.x || last.y !== p.y) {
+        arr.push({ x: p.x, y: p.y })
+      }
+    }
+    // isAxisAligned: 检查两点是否在同一条轴上
+    const isAxisAligned = (a: Point, b: Point) => a.x === b.x || a.y === b.y
+    // manhattanDistance: 计算两点在曼哈顿距离上的距离
+    const manhattanDistance = (a: Point, b: Point) =>
+      Math.abs(a.x - b.x) + Math.abs(a.y - b.y)
+
+    // 1) 生成严格正交路径，尽量延续前一段方向以减少折点
+    const orthogonal: Point[] = []
+    pushUnique(orthogonal, points[0])
+    // previousDirection: 记录前一段的方向，用于判断当前段的PreferredCorner
+    let previousDirection: SegmentDirection | undefined
+    // 遍历所有点对，生成正交路径
+    for (let i = 0; i < points.length - 1; i++) {
+      const current = orthogonal[orthogonal.length - 1]
+      const next = points[i + 1]
+      if (!current || !next) continue
+
+      if (isAxisAligned(current, next)) {
+        pushUnique(orthogonal, next)
+        previousDirection =
+          current.x === next.x
+            ? SegmentDirection.VERTICAL
+            : SegmentDirection.HORIZONTAL
+        continue
+      }
+
+      const cornerHV: Point = { x: next.x, y: current.y }
+      const cornerVH: Point = { x: current.x, y: next.y }
+
+      // 根据前一段的方向，优先选择能延续该方向的拐角点，以减少折点数量；
+      // 若前一段为垂直方向，则优先选择垂直-水平拐角(cornerVH)；
+      // 若前一段为水平方向，则优先选择水平-垂直拐角(cornerHV)；
+      // 若前一段无方向（初始情况），则比较两个拐角的曼哈顿距离，选更近者。
+      const preferredCorner =
+        previousDirection === SegmentDirection.VERTICAL
+          ? cornerVH
+          : previousDirection === SegmentDirection.HORIZONTAL
+            ? cornerHV
+            : manhattanDistance(current, cornerHV) <=
+                manhattanDistance(current, cornerVH)
+              ? cornerHV
+              : cornerVH
+
+      if (preferredCorner.x !== current.x || preferredCorner.y !== current.y) {
+        pushUnique(orthogonal, preferredCorner)
+      }
+      pushUnique(orthogonal, next)
+
+      const a = orthogonal[orthogonal.length - 2]
+      const b = orthogonal[orthogonal.length - 1]
+      previousDirection =
+        a && b
+          ? a.x === b.x
+            ? SegmentDirection.VERTICAL
+            : SegmentDirection.HORIZONTAL
+          : previousDirection
+    }
+
+    // 2) 去除冗余共线中间点
+    const simplified: Point[] = []
+    for (let i = 0; i < orthogonal.length; i++) {
+      const prev = orthogonal[i - 1]
+      const curr = orthogonal[i]
+      const next = orthogonal[i + 1]
+      // 如果当前点与前一个点和后一个点在同一条水平线或垂直线上，则跳过该点，去除冗余的共线中间点
+      if (
+        prev &&
+        curr &&
+        next &&
+        ((prev.x === curr.x && curr.x === next.x) || // 水平共线
+          (prev.y === curr.y && curr.y === next.y)) // 垂直共线
+      ) {
+        continue
+      }
+      pushUnique(simplified, curr)
+    }
+
+    // 3) 保留原始起点与终点位置
+    if (simplified.length >= 2) {
+      simplified[0] = { x: points[0].x, y: points[0].y }
+      simplified[simplified.length - 1] = {
+        x: points[points.length - 1].x,
+        y: points[points.length - 1].y,
+      }
+    }
+
+    // 4) 结果校验：任意相邻段都必须为水平/垂直；失败则退化为起止两点
+    const isOrthogonal =
+      simplified.length < 2 ||
+      simplified.every((_, idx, arr) => {
+        if (idx === 0) return true
+        return isAxisAligned(arr[idx - 1], arr[idx])
+      })
+
+    return isOrthogonal
+      ? simplified
+      : [
+          { x: points[0].x, y: points[0].y },
+          { x: points[points.length - 1].x, y: points[points.length - 1].y },
+        ]
+  }
+
+  /**
+   * 计算默认 offset：箭头与折线重叠长度 + 5
+   * 重叠长度采用箭头样式中的 offset（沿边方向的长度）
+   */
+  private getDefaultOffset(): number {
+    const arrowStyle = this.getArrowStyle()
+    const arrowOverlap =
+      typeof arrowStyle.offset === 'number' ? arrowStyle.offset : 0
+    return arrowOverlap + 5
+  }
+
   getEdgeStyle() {
     const { polyline } = this.graphModel.theme
     const style = super.getEdgeStyle()
@@ -319,7 +460,7 @@ export class PolylineEdgeModel extends BaseEdgeModel {
   }
 
   updatePath(pointList: Point[]) {
-    this.pointsList = pointList
+    this.pointsList = this.orthogonalizePath(pointList)
     this.points = this.getPath(this.pointsList)
   }
 
@@ -362,7 +503,7 @@ export class PolylineEdgeModel extends BaseEdgeModel {
       this.targetNode,
       this.offset || 0,
     )
-    this.pointsList = pointsList
+    this.pointsList = this.orthogonalizePath(pointsList)
     this.points = pointsList.map((point) => `${point.x},${point.y}`).join(' ')
   }
 
@@ -651,18 +792,20 @@ export class PolylineEdgeModel extends BaseEdgeModel {
     sourceNode: BaseNodeModel
     targetNode: BaseNodeModel
   }) {
-    this.pointsList = getPolylinePoints(
-      {
-        x: startPoint.x,
-        y: startPoint.y,
-      },
-      {
-        x: endPoint.x,
-        y: endPoint.y,
-      },
-      sourceNode,
-      targetNode,
-      this.offset || 0,
+    this.pointsList = this.orthogonalizePath(
+      getPolylinePoints(
+        {
+          x: startPoint.x,
+          y: startPoint.y,
+        },
+        {
+          x: endPoint.x,
+          y: endPoint.y,
+        },
+        sourceNode,
+        targetNode,
+        this.offset || 0,
+      ),
     )
 
     this.initPoints()