@logicflow/core - npm Package Compare versions

Comparing version 2.0.5 to 2.0.6

es/model/BaseModel.d.ts

@@ -45,2 +45,11 @@ import GraphModel from './GraphModel';
     type NodeMoveRule = (model: BaseNodeModel, deltaX: number, deltaY: number) => boolean | IsAllowMove;
+    /**
+     * 限制节点resize规则
+     * model: 移动节点的 model
+     * deltaX: 中心点移动的 X 轴距离
+     * deltaY: 中心点移动的 Y 轴距离
+     * width: 中心点新的width
+     * height: 中心点新的height
+     */
+    type NodeResizeRule = (model: BaseNodeModel, deltaX: number, deltaY: number, width: number, height: number) => boolean;
     type AdjustEdgeStartAndEndParams = {
@@ -47,0 +56,0 @@ startPoint: LogicFlow.Point;

es/model/GraphModel.d.ts

@@ -35,6 +35,11 @@ import { BaseEdgeModel, BaseNodeModel, EditConfigModel, Model, TransformModel } from '.';
      * 节点移动规则判断
-     * 在节点移动的时候，会出发此数组中的所有规则判断
+     * 在节点移动的时候，会触发此数组中的所有规则判断
      */
     nodeMoveRules: Model.NodeMoveRule[];
     /**
+     * 节点resize规则判断
+     * 在节点resize的时候，会触发此数组中的所有规则判断
+     */
+    nodeResizeRules: Model.NodeResizeRule[];
+    /**
      * 获取自定义连线轨迹
@@ -334,2 +339,3 @@ */
     addNodeMoveRules(fn: Model.NodeMoveRule): void;
+    addNodeResizeRules(fn: Model.NodeResizeRule): void;
     /**
@@ -336,0 +342,0 @@ * 设置默认的边类型

es/model/GraphModel.js

@@ -61,5 +61,10 @@ var __assign = (this && this.__assign) || function () {
          * 节点移动规则判断
-         * 在节点移动的时候，会出发此数组中的所有规则判断
+         * 在节点移动的时候，会触发此数组中的所有规则判断
          */
         this.nodeMoveRules = [];
+        /**
+         * 节点resize规则判断
+         * 在节点resize的时候，会触发此数组中的所有规则判断
+         */
+        this.nodeResizeRules = [];
         // 当前图上所有节点的model
@@ -1085,2 +1090,7 @@ this.nodes = [];
     };
+    GraphModel.prototype.addNodeResizeRules = function (fn) {
+        if (!this.nodeResizeRules.includes(fn)) {
+            this.nodeResizeRules.push(fn);
+        }
+    };
     /**
@@ -1087,0 +1097,0 @@ * 设置默认的边类型

es/model/node/BaseNodeModel.d.ts

@@ -75,2 +75,3 @@ import { GraphModel, Model } from '..';
     moveRules: Model.NodeMoveRule[];
+    resizeRules: Model.NodeResizeRule[];
     hasSetTargetRules: boolean;
@@ -268,2 +269,8 @@ hasSetSourceRules: boolean;
     updateText(value: string): void;
+    addNodeResizeRules(fn: Model.NodeResizeRule): void;
+    /**
+     * 内部方法
+     * 是否允许resize节点到新的位置
+     */
+    isAllowResizeNode(deltaX: number, deltaY: number, width: number, height: number): boolean;
     setSelected(flag?: boolean): void;
@@ -270,0 +277,0 @@ setHovered(flag?: boolean): void;

es/model/node/BaseNodeModel.js

@@ -98,2 +98,3 @@ var __assign = (this && this.__assign) || function () {
         this.moveRules = []; // 节点移动之前的hook
+        this.resizeRules = []; // 节点resize之前的hook
         this.hasSetTargetRules = false; // 用来限制rules的重复值
@@ -244,3 +245,3 @@ this.hasSetSourceRules = false; // 用来限制rules的重复值
                 if (!isUndefined(text.editable)) {
-                    textConfig.draggable = text.draggable;
+                    textConfig.editable = text.editable;
                 }
@@ -257,2 +258,6 @@ }
         var width = resizeInfo.width, height = resizeInfo.height, deltaX = resizeInfo.deltaX, deltaY = resizeInfo.deltaY;
+        var isAllowResize = this.isAllowResizeNode(deltaX, deltaY, width, height);
+        if (!isAllowResize) {
+            return this.getData();
+        }
         // 移动节点以及文本内容
@@ -280,2 +285,14 @@ this.move(deltaX / 2, deltaY / 2);
         }
+        if (isNil(properties.width)) {
+            // resize()的时候会触发this.setProperties({width,height})
+            // 然后返回getData()，可以从properties拿到width
+            // 但是初始化如果没有在properties传入width，那么getData()就一直无法从properties拿到width
+            properties.width = this.width;
+        }
+        if (isNil(properties.height)) {
+            // resize()的时候会触发this.setProperties({width,height})
+            // 然后返回getData()，可以从properties拿到height
+            // 但是初始化如果没有在properties传入height，那么getData()就一直无法从properties拿到width
+            properties.height = this.height;
+        }
         var data = {
@@ -613,2 +630,6 @@ id: this.id,
         }
+        if (isAllowMoveX || isAllowMoveY) {
+            // 更新x和y的同时也要更新对应的transform旋转矩阵（依赖x、y)
+            this.rotate = this._rotate;
+        }
         return isAllowMoveX || isAllowMoveY;
@@ -657,2 +678,31 @@ };
     };
+    BaseNodeModel.prototype.addNodeResizeRules = function (fn) {
+        if (!this.resizeRules.includes(fn)) {
+            this.resizeRules.push(fn);
+        }
+    };
+    /**
+     * 内部方法
+     * 是否允许resize节点到新的位置
+     */
+    BaseNodeModel.prototype.isAllowResizeNode = function (deltaX, deltaY, width, height) {
+        var e_2, _a;
+        var rules = this.resizeRules.concat(this.graphModel.nodeResizeRules);
+        try {
+            for (var rules_2 = __values(rules), rules_2_1 = rules_2.next(); !rules_2_1.done; rules_2_1 = rules_2.next()) {
+                var rule = rules_2_1.value;
+                var r = rule(this, deltaX, deltaY, width, height);
+                if (!r)
+                    return false;
+            }
+        }
+        catch (e_2_1) { e_2 = { error: e_2_1 }; }
+        finally {
+            try {
+                if (rules_2_1 && !rules_2_1.done && (_a = rules_2.return)) _a.call(rules_2);
+            }
+            finally { if (e_2) throw e_2.error; }
+        }
+        return true;
+    };
     BaseNodeModel.prototype.setSelected = function (flag) {
@@ -850,2 +900,5 @@ if (flag === void 0) { flag = true; }
         action
+    ], BaseNodeModel.prototype, "addNodeResizeRules", null);
+    __decorate([
+        action
     ], BaseNodeModel.prototype, "setSelected", null);
@@ -852,0 +905,0 @@ __decorate([

es/util/graph.d.ts

 import LogicFlow from '..';
-import { EditConfigModel } from 'src/model';
+import { EditConfigModel } from '..';
 /**
@@ -4,0 +4,0 @@ * 判断一个点是否在指定区域

es/util/resize.d.ts

@@ -5,2 +5,3 @@ import { ResizeControl, ResizeControlIndex } from '../view/Control';
 import ResizeNodeData = ResizeControl.ResizeNodeData;
+import type { SimplePoint } from '../algorithm/rotate';
 /**
@@ -14,7 +15,19 @@ * 计算 Control 拖动后，节点的高度信息
  */
-export declare const recalcResizeInfo: (index: ResizeControlIndex, resizeInfo: ResizeInfo, pct?: number, freezeWidth?: boolean, freezeHeight?: boolean) => ResizeInfo;
+export declare const recalcResizeInfo: (index: ResizeControlIndex, resizeInfo: ResizeInfo, pct: number | undefined, freezeWidth: boolean | undefined, freezeHeight: boolean | undefined, rotate: number | undefined, controlX: number | undefined, controlY: number | undefined, oldCenterX: number, oldCenterY: number) => ResizeInfo;
 export declare const updateEdgePointByAnchors: (nodeModel: BaseNodeModel, graphModel: GraphModel) => void;
 export declare const triggerResizeEvent: (preNodeData: ResizeNodeData, curNodeData: ResizeNodeData, deltaX: number, deltaY: number, index: number, nodeModel: BaseNodeModel, graphModel: GraphModel) => void;
+export type IHandleResizeParams = {
+    x?: number;
+    y?: number;
+    deltaX: number;
+    deltaY: number;
+    index: ResizeControlIndex;
+    nodeModel: BaseNodeModel;
+    graphModel: GraphModel;
+    cancelCallback?: () => void;
+};
 /**
  * 处理节点的 resize 事件，提出来放到 utils 中，方便在外面（extension）中使用
+ * @param x
+ * @param y
  * @param deltaX
@@ -27,9 +40,10 @@ * @param deltaY
  */
-export declare const handleResize: ({ deltaX, deltaY, index, nodeModel, graphModel, cancelCallback, }: {
-    deltaX: any;
-    deltaY: any;
-    index: any;
-    nodeModel: any;
-    graphModel: any;
-    cancelCallback: any;
-}) => void;
+export declare const handleResize: ({ x, y, deltaX, deltaY, index, nodeModel, graphModel, cancelCallback, }: IHandleResizeParams) => void;
+export declare function calculateWidthAndHeight(startRotatedTouchControlPoint: SimplePoint, endRotatedTouchControlPoint: SimplePoint, oldCenter: SimplePoint, angle: number, freezeWidth: boolean | undefined, freezeHeight: boolean | undefined, oldWidth: number, oldHeight: number): {
+    width: number;
+    height: number;
+    center: {
+        x: number;
+        y: number;
+    };
+};

es/util/resize.js

 import { ResizeControlIndex } from '../view/Control';
 import { cloneDeep, find, forEach } from 'lodash-es';
 import { EventType } from '../constant';
+import { calculatePointAfterRotateAngle, getNewCenter, radianToAngle, } from '../algorithm/rotate';
+function recalcRotatedResizeInfo(pct, resizeInfo, rotate, controlX, controlY, oldCenterX, oldCenterY, freezeWidth, freezeHeight) {
+    if (freezeWidth === void 0) { freezeWidth = false; }
+    if (freezeHeight === void 0) { freezeHeight = false; }
+    // 假设我们触摸的点是右下角的control
+    var deltaX = resizeInfo.deltaX, deltaY = resizeInfo.deltaY, oldWidth = resizeInfo.width, oldHeight = resizeInfo.height;
+    var angle = radianToAngle(rotate);
+    // 右下角的control
+    var startZeroTouchControlPoint = {
+        x: controlX, // control锚点的坐标x
+        y: controlY, // control锚点的坐标y
+    };
+    var oldCenter = { x: oldCenterX, y: oldCenterY };
+    // 右下角的control坐标（transform后的-touchStartPoint）
+    var startRotatedTouchControlPoint = calculatePointAfterRotateAngle(startZeroTouchControlPoint, oldCenter, angle);
+    // 右下角的control坐标（transform后的-touchEndPoint）
+    var endRotatedTouchControlPoint = {
+        x: startRotatedTouchControlPoint.x + deltaX,
+        y: startRotatedTouchControlPoint.y + deltaY,
+    };
+    // 计算出新的宽度和高度以及新的中心点
+    var _a = calculateWidthAndHeight(startRotatedTouchControlPoint, endRotatedTouchControlPoint, oldCenter, angle, freezeWidth, freezeHeight, oldWidth, oldHeight), newWidth = _a.width, newHeight = _a.height, newCenter = _a.center;
+    // calculateWidthAndHeight()得到的是整个宽度，比如圆pct=0.5,此时newWidth等于整个圆直径
+    resizeInfo.width = newWidth * pct;
+    resizeInfo.height = newHeight * pct;
+    // BaseNodeModel.resize(deltaX/2, deltaY/2)，因此这里要*2
+    resizeInfo.deltaX = (newCenter.x - oldCenter.x) * 2;
+    resizeInfo.deltaY = (newCenter.y - oldCenter.y) * 2;
+    return resizeInfo;
+}
 /**
@@ -12,6 +42,7 @@ * 计算 Control 拖动后，节点的高度信息
  */
-export var recalcResizeInfo = function (index, resizeInfo, pct, freezeWidth, freezeHeight) {
+export var recalcResizeInfo = function (index, resizeInfo, pct, freezeWidth, freezeHeight, rotate, controlX, controlY, oldCenterX, oldCenterY) {
     if (pct === void 0) { pct = 1; }
     if (freezeWidth === void 0) { freezeWidth = false; }
     if (freezeHeight === void 0) { freezeHeight = false; }
+    if (rotate === void 0) { rotate = 0; }
     var nextResizeInfo = cloneDeep(resizeInfo);
@@ -74,2 +105,10 @@ var deltaX = nextResizeInfo.deltaX, deltaY = nextResizeInfo.deltaY;
     }
+    if (rotate % (2 * Math.PI) !== 0 &&
+        controlX !== undefined &&
+        controlY !== undefined) {
+        // 角度rotate不为0，则触发另外的计算修正resize的deltaX和deltaY
+        // 因为rotate不为0的时候，左上角的坐标一直在变化
+        // 角度rotate不为0得到的resizeInfo.deltaX仅仅代表中心点的变化，而不是宽度的变化
+        return recalcRotatedResizeInfo(pct, nextResizeInfo, rotate, controlX, controlY, oldCenterX, oldCenterY, freezeWidth, freezeHeight);
+    }
     // 如果限制了宽/高不变，对应的 width/height 保持一致
@@ -145,13 +184,6 @@ switch (index) {
 };
-// TODO：确认 handleResize 函数的类型定义
-// export type IHandleResizeParams = {
-//   deltaX: number
-//   deltaY: number
-//   index: ResizeControlIndex
-//   nodeModel: BaseNodeModel
-//   graphModel: GraphModel
-//   cancelCallback?: () => void
-// }
 /**
  * 处理节点的 resize 事件，提出来放到 utils 中，方便在外面（extension）中使用
+ * @param x
+ * @param y
  * @param deltaX
@@ -165,7 +197,7 @@ * @param deltaY
 export var handleResize = function (_a) {
-    var deltaX = _a.deltaX, deltaY = _a.deltaY, index = _a.index, nodeModel = _a.nodeModel, graphModel = _a.graphModel, cancelCallback = _a.cancelCallback;
+    var x = _a.x, y = _a.y, deltaX = _a.deltaX, deltaY = _a.deltaY, index = _a.index, nodeModel = _a.nodeModel, graphModel = _a.graphModel, cancelCallback = _a.cancelCallback;
     var r = nodeModel.r, // circle
     rx = nodeModel.rx, // ellipse/diamond
     ry = nodeModel.ry, width = nodeModel.width, // rect/html
-    height = nodeModel.height, PCTResizeInfo = nodeModel.PCTResizeInfo, minWidth = nodeModel.minWidth, minHeight = nodeModel.minHeight, maxWidth = nodeModel.maxWidth, maxHeight = nodeModel.maxHeight;
+    height = nodeModel.height, PCTResizeInfo = nodeModel.PCTResizeInfo, minWidth = nodeModel.minWidth, minHeight = nodeModel.minHeight, maxWidth = nodeModel.maxWidth, maxHeight = nodeModel.maxHeight, rotate = nodeModel.rotate, oldCenterX = nodeModel.x, oldCenterY = nodeModel.y;
     var isFreezeWidth = minWidth === maxWidth;
@@ -181,3 +213,5 @@ var isFreezeHeight = minHeight === maxHeight;
     var pct = r || (rx && ry) ? 1 / 2 : 1;
-    var nextSize = recalcResizeInfo(index, resizeInfo, pct, isFreezeWidth, isFreezeHeight);
+    var controlX = x;
+    var controlY = y;
+    var nextSize = recalcResizeInfo(index, resizeInfo, pct, isFreezeWidth, isFreezeHeight, rotate, controlX, controlY, oldCenterX, oldCenterY);
     // 限制放大缩小的最大最小范围
@@ -192,7 +226,19 @@ if (nextSize.width < minWidth ||
     }
-    // 如果限制了宽高不变，对应的 x/y 不产生位移
-    nextSize.deltaX = isFreezeWidth ? 0 : nextSize.deltaX;
-    nextSize.deltaY = isFreezeWidth ? 0 : nextSize.deltaY;
+    if (rotate % (2 * Math.PI) == 0 ||
+        PCTResizeInfo ||
+        controlX === undefined ||
+        controlY === undefined) {
+        // rotate!==0并且不是PCTResizeInfo时，即使是isFreezeWidth||isFreezeHeight
+        // recalcRotatedResizeInfo()计算出来的中心点会发生变化
+        // 如果限制了宽高不变，对应的 x/y 不产生位移
+        nextSize.deltaX = isFreezeWidth ? 0 : nextSize.deltaX;
+        nextSize.deltaY = isFreezeHeight ? 0 : nextSize.deltaY;
+    }
     var preNodeData = nodeModel.getData();
     var curNodeData = nodeModel.resize(nextSize);
+    // 检测preNodeData和curNodeData是否没变化
+    if (preNodeData.x === curNodeData.x && preNodeData.y === curNodeData.y) {
+        // 中心点x和y都没有变化，说明无法resize，阻止下面边的更新以及resize事件的emit
+        return;
+    }
     // 更新边
@@ -203,1 +249,78 @@ updateEdgePointByAnchors(nodeModel, graphModel);
 };
+export function calculateWidthAndHeight(startRotatedTouchControlPoint, endRotatedTouchControlPoint, oldCenter, angle, freezeWidth, freezeHeight, oldWidth, oldHeight) {
+    if (freezeWidth === void 0) { freezeWidth = false; }
+    if (freezeHeight === void 0) { freezeHeight = false; }
+    // 假设目前触摸的是右下角的control点
+    // 计算出来左上角的control坐标，resize过程左上角的control坐标保持不变
+    var freezePoint = {
+        x: oldCenter.x - (startRotatedTouchControlPoint.x - oldCenter.x),
+        y: oldCenter.y - (startRotatedTouchControlPoint.y - oldCenter.y),
+    };
+    // 【touchEndPoint】右下角 + freezePoint左上角 计算出新的中心点
+    var newCenter = getNewCenter(freezePoint, endRotatedTouchControlPoint);
+    // 得到【touchEndPoint】右下角-没有transform的坐标
+    var endZeroTouchControlPoint = calculatePointAfterRotateAngle(endRotatedTouchControlPoint, newCenter, -angle);
+    // ---------- 使用transform之前的坐标计算出新的width和height ----------
+    // 得到左上角---没有transform的坐标
+    var zeroFreezePoint = calculatePointAfterRotateAngle(freezePoint, newCenter, -angle);
+    if (freezeWidth) {
+        // 如果固定width，那么不能单纯使用endZeroTouchControlPoint.x=startZeroTouchControlPoint.x
+        // 因为去掉transform的左上角不一定是重合的，我们要保证的是transform后的左上角重合
+        var newWidth = Math.abs(endZeroTouchControlPoint.x - zeroFreezePoint.x);
+        var widthDx = newWidth - oldWidth;
+        // 点击的是左边锚点，是+widthDx/2，点击是右边锚点，是-widthDx/2
+        if (newCenter.x > endZeroTouchControlPoint.x) {
+            // 当前触摸的是左边锚点
+            newCenter.x = newCenter.x + widthDx / 2;
+        }
+        else {
+            // 当前触摸的是右边锚点
+            newCenter.x = newCenter.x - widthDx / 2;
+        }
+    }
+    if (freezeHeight) {
+        var newHeight = Math.abs(endZeroTouchControlPoint.y - zeroFreezePoint.y);
+        var heightDy = newHeight - oldHeight;
+        if (newCenter.y > endZeroTouchControlPoint.y) {
+            // 当前触摸的是上边锚点
+            newCenter.y = newCenter.y + heightDy / 2;
+        }
+        else {
+            newCenter.y = newCenter.y - heightDy / 2;
+        }
+    }
+    if (freezeWidth || freezeHeight) {
+        // 如果调整过transform之前的坐标，那么transform后的坐标也会改变，那么算出来的newCenter也得调整
+        // 由于无论如何rotate，中心点都是不变的，因此我们可以使用transform之前的坐标算出新的中心点
+        var nowFreezePoint = calculatePointAfterRotateAngle(zeroFreezePoint, newCenter, angle);
+        // 得到当前新rect的左上角与实际上transform后的左上角的偏移量
+        var dx = nowFreezePoint.x - freezePoint.x;
+        var dy = nowFreezePoint.y - freezePoint.y;
+        // 修正不使用transform的坐标: 左上角、右下角、center
+        newCenter.x = newCenter.x - dx;
+        newCenter.y = newCenter.y - dy;
+        zeroFreezePoint = calculatePointAfterRotateAngle(freezePoint, newCenter, -angle);
+        endZeroTouchControlPoint = {
+            x: newCenter.x - (zeroFreezePoint.x - newCenter.x),
+            y: newCenter.y - (zeroFreezePoint.y - newCenter.y),
+        };
+    }
+    // transform之前的坐标的左上角+右下角计算出宽度和高度
+    var width = Math.abs(endZeroTouchControlPoint.x - zeroFreezePoint.x);
+    var height = Math.abs(endZeroTouchControlPoint.y - zeroFreezePoint.y);
+    // ---------- 使用transform之前的坐标计算出新的width和height ----------
+    if (freezeWidth) {
+        // 理论计算出来的width应该等于oldWidth
+        // 但是有误差，比如oldWidth = 100; newWidth=100.000000000001
+        // 会在handleResize()限制放大缩小的最大最小范围中被阻止滑动
+        width = oldWidth;
+    }
+    if (freezeHeight) {
+        height = oldHeight;
+    }
+    return {
+        width: width,
+        height: height,
+        center: newCenter,
+    };
+}

es/view/Control.d.ts

@@ -33,2 +33,3 @@ import { createElement as h, Component } from 'preact/compat';
     constructor(props: IResizeControlProps);
+    componentWillUnmount(): void;
     updateEdgePointByAnchors: () => void;
@@ -35,0 +36,0 @@ triggerResizeEvent: (preNodeData: ResizeNodeData, curNodeData: ResizeNodeData, deltaX: any, deltaY: any, index: any, nodeModel: BaseNodeModel) => void;

es/view/Control.js

@@ -213,5 +213,7 @@ var __extends = (this && this.__extends) || (function () {
             var index = _this.index;
-            var _b = _this.props, model = _b.model, graphModel = _b.graphModel;
+            var _b = _this.props, model = _b.model, graphModel = _b.graphModel, x = _b.x, y = _b.y;
             // DONE: 调用每个节点中更新缩放时的方法 updateNode 函数，用来各节点缩放的方法
             handleResize({
+                x: x,
+                y: y,
                 deltaX: deltaX,
@@ -317,2 +319,5 @@ deltaY: deltaY,
     }
+    ResizeControl.prototype.componentWillUnmount = function () {
+        this.dragHandler.cancelDrag();
+    };
     ResizeControl.prototype.render = function () {
@@ -319,0 +324,0 @@ var _a = this.props, x = _a.x, y = _a.y, direction = _a.direction, model = _a.model;

lib/model/BaseModel.d.ts

@@ -45,2 +45,11 @@ import GraphModel from './GraphModel';
     type NodeMoveRule = (model: BaseNodeModel, deltaX: number, deltaY: number) => boolean | IsAllowMove;
+    /**
+     * 限制节点resize规则
+     * model: 移动节点的 model
+     * deltaX: 中心点移动的 X 轴距离
+     * deltaY: 中心点移动的 Y 轴距离
+     * width: 中心点新的width
+     * height: 中心点新的height
+     */
+    type NodeResizeRule = (model: BaseNodeModel, deltaX: number, deltaY: number, width: number, height: number) => boolean;
     type AdjustEdgeStartAndEndParams = {
@@ -47,0 +56,0 @@ startPoint: LogicFlow.Point;

lib/model/GraphModel.d.ts

@@ -35,6 +35,11 @@ import { BaseEdgeModel, BaseNodeModel, EditConfigModel, Model, TransformModel } from '.';
      * 节点移动规则判断
-     * 在节点移动的时候，会出发此数组中的所有规则判断
+     * 在节点移动的时候，会触发此数组中的所有规则判断
      */
     nodeMoveRules: Model.NodeMoveRule[];
     /**
+     * 节点resize规则判断
+     * 在节点resize的时候，会触发此数组中的所有规则判断
+     */
+    nodeResizeRules: Model.NodeResizeRule[];
+    /**
      * 获取自定义连线轨迹
@@ -334,2 +339,3 @@ */
     addNodeMoveRules(fn: Model.NodeMoveRule): void;
+    addNodeResizeRules(fn: Model.NodeResizeRule): void;
     /**
@@ -336,0 +342,0 @@ * 设置默认的边类型

lib/model/GraphModel.js

@@ -67,5 +67,10 @@ "use strict";
          * 节点移动规则判断
-         * 在节点移动的时候，会出发此数组中的所有规则判断
+         * 在节点移动的时候，会触发此数组中的所有规则判断
          */
         this.nodeMoveRules = [];
+        /**
+         * 节点resize规则判断
+         * 在节点resize的时候，会触发此数组中的所有规则判断
+         */
+        this.nodeResizeRules = [];
         // 当前图上所有节点的model
@@ -1091,2 +1096,7 @@ this.nodes = [];
     };
+    GraphModel.prototype.addNodeResizeRules = function (fn) {
+        if (!this.nodeResizeRules.includes(fn)) {
+            this.nodeResizeRules.push(fn);
+        }
+    };
     /**
@@ -1093,0 +1103,0 @@ * 设置默认的边类型

lib/model/node/BaseNodeModel.d.ts

@@ -75,2 +75,3 @@ import { GraphModel, Model } from '..';
     moveRules: Model.NodeMoveRule[];
+    resizeRules: Model.NodeResizeRule[];
     hasSetTargetRules: boolean;
@@ -268,2 +269,8 @@ hasSetSourceRules: boolean;
     updateText(value: string): void;
+    addNodeResizeRules(fn: Model.NodeResizeRule): void;
+    /**
+     * 内部方法
+     * 是否允许resize节点到新的位置
+     */
+    isAllowResizeNode(deltaX: number, deltaY: number, width: number, height: number): boolean;
     setSelected(flag?: boolean): void;
@@ -270,0 +277,0 @@ setHovered(flag?: boolean): void;

lib/model/node/BaseNodeModel.js

@@ -101,2 +101,3 @@ "use strict";
         this.moveRules = []; // 节点移动之前的hook
+        this.resizeRules = []; // 节点resize之前的hook
         this.hasSetTargetRules = false; // 用来限制rules的重复值
@@ -247,3 +248,3 @@ this.hasSetSourceRules = false; // 用来限制rules的重复值
                 if (!(0, lodash_es_1.isUndefined)(text.editable)) {
-                    textConfig.draggable = text.draggable;
+                    textConfig.editable = text.editable;
                 }
@@ -260,2 +261,6 @@ }
         var width = resizeInfo.width, height = resizeInfo.height, deltaX = resizeInfo.deltaX, deltaY = resizeInfo.deltaY;
+        var isAllowResize = this.isAllowResizeNode(deltaX, deltaY, width, height);
+        if (!isAllowResize) {
+            return this.getData();
+        }
         // 移动节点以及文本内容
@@ -283,2 +288,14 @@ this.move(deltaX / 2, deltaY / 2);
         }
+        if ((0, lodash_es_1.isNil)(properties.width)) {
+            // resize()的时候会触发this.setProperties({width,height})
+            // 然后返回getData()，可以从properties拿到width
+            // 但是初始化如果没有在properties传入width，那么getData()就一直无法从properties拿到width
+            properties.width = this.width;
+        }
+        if ((0, lodash_es_1.isNil)(properties.height)) {
+            // resize()的时候会触发this.setProperties({width,height})
+            // 然后返回getData()，可以从properties拿到height
+            // 但是初始化如果没有在properties传入height，那么getData()就一直无法从properties拿到width
+            properties.height = this.height;
+        }
         var data = {
@@ -616,2 +633,6 @@ id: this.id,
         }
+        if (isAllowMoveX || isAllowMoveY) {
+            // 更新x和y的同时也要更新对应的transform旋转矩阵（依赖x、y)
+            this.rotate = this._rotate;
+        }
         return isAllowMoveX || isAllowMoveY;
@@ -660,2 +681,31 @@ };
     };
+    BaseNodeModel.prototype.addNodeResizeRules = function (fn) {
+        if (!this.resizeRules.includes(fn)) {
+            this.resizeRules.push(fn);
+        }
+    };
+    /**
+     * 内部方法
+     * 是否允许resize节点到新的位置
+     */
+    BaseNodeModel.prototype.isAllowResizeNode = function (deltaX, deltaY, width, height) {
+        var e_2, _a;
+        var rules = this.resizeRules.concat(this.graphModel.nodeResizeRules);
+        try {
+            for (var rules_2 = __values(rules), rules_2_1 = rules_2.next(); !rules_2_1.done; rules_2_1 = rules_2.next()) {
+                var rule = rules_2_1.value;
+                var r = rule(this, deltaX, deltaY, width, height);
+                if (!r)
+                    return false;
+            }
+        }
+        catch (e_2_1) { e_2 = { error: e_2_1 }; }
+        finally {
+            try {
+                if (rules_2_1 && !rules_2_1.done && (_a = rules_2.return)) _a.call(rules_2);
+            }
+            finally { if (e_2) throw e_2.error; }
+        }
+        return true;
+    };
     BaseNodeModel.prototype.setSelected = function (flag) {
@@ -853,2 +903,5 @@ if (flag === void 0) { flag = true; }
         mobx_1.action
+    ], BaseNodeModel.prototype, "addNodeResizeRules", null);
+    __decorate([
+        mobx_1.action
     ], BaseNodeModel.prototype, "setSelected", null);
@@ -855,0 +908,0 @@ __decorate([

lib/util/graph.d.ts

 import LogicFlow from '..';
-import { EditConfigModel } from 'src/model';
+import { EditConfigModel } from '..';
 /**
@@ -4,0 +4,0 @@ * 判断一个点是否在指定区域

lib/util/resize.d.ts

@@ -5,2 +5,3 @@ import { ResizeControl, ResizeControlIndex } from '../view/Control';
 import ResizeNodeData = ResizeControl.ResizeNodeData;
+import type { SimplePoint } from '../algorithm/rotate';
 /**
@@ -14,7 +15,19 @@ * 计算 Control 拖动后，节点的高度信息
  */
-export declare const recalcResizeInfo: (index: ResizeControlIndex, resizeInfo: ResizeInfo, pct?: number, freezeWidth?: boolean, freezeHeight?: boolean) => ResizeInfo;
+export declare const recalcResizeInfo: (index: ResizeControlIndex, resizeInfo: ResizeInfo, pct: number | undefined, freezeWidth: boolean | undefined, freezeHeight: boolean | undefined, rotate: number | undefined, controlX: number | undefined, controlY: number | undefined, oldCenterX: number, oldCenterY: number) => ResizeInfo;
 export declare const updateEdgePointByAnchors: (nodeModel: BaseNodeModel, graphModel: GraphModel) => void;
 export declare const triggerResizeEvent: (preNodeData: ResizeNodeData, curNodeData: ResizeNodeData, deltaX: number, deltaY: number, index: number, nodeModel: BaseNodeModel, graphModel: GraphModel) => void;
+export type IHandleResizeParams = {
+    x?: number;
+    y?: number;
+    deltaX: number;
+    deltaY: number;
+    index: ResizeControlIndex;
+    nodeModel: BaseNodeModel;
+    graphModel: GraphModel;
+    cancelCallback?: () => void;
+};
 /**
  * 处理节点的 resize 事件，提出来放到 utils 中，方便在外面（extension）中使用
+ * @param x
+ * @param y
  * @param deltaX
@@ -27,9 +40,10 @@ * @param deltaY
  */
-export declare const handleResize: ({ deltaX, deltaY, index, nodeModel, graphModel, cancelCallback, }: {
-    deltaX: any;
-    deltaY: any;
-    index: any;
-    nodeModel: any;
-    graphModel: any;
-    cancelCallback: any;
-}) => void;
+export declare const handleResize: ({ x, y, deltaX, deltaY, index, nodeModel, graphModel, cancelCallback, }: IHandleResizeParams) => void;
+export declare function calculateWidthAndHeight(startRotatedTouchControlPoint: SimplePoint, endRotatedTouchControlPoint: SimplePoint, oldCenter: SimplePoint, angle: number, freezeWidth: boolean | undefined, freezeHeight: boolean | undefined, oldWidth: number, oldHeight: number): {
+    width: number;
+    height: number;
+    center: {
+        x: number;
+        y: number;
+    };
+};

lib/util/resize.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.handleResize = exports.triggerResizeEvent = exports.updateEdgePointByAnchors = exports.recalcResizeInfo = void 0;
+exports.calculateWidthAndHeight = exports.handleResize = exports.triggerResizeEvent = exports.updateEdgePointByAnchors = exports.recalcResizeInfo = void 0;
 var Control_1 = require("../view/Control");
 var lodash_es_1 = require("lodash-es");
 var constant_1 = require("../constant");
+var rotate_1 = require("../algorithm/rotate");
+function recalcRotatedResizeInfo(pct, resizeInfo, rotate, controlX, controlY, oldCenterX, oldCenterY, freezeWidth, freezeHeight) {
+    if (freezeWidth === void 0) { freezeWidth = false; }
+    if (freezeHeight === void 0) { freezeHeight = false; }
+    // 假设我们触摸的点是右下角的control
+    var deltaX = resizeInfo.deltaX, deltaY = resizeInfo.deltaY, oldWidth = resizeInfo.width, oldHeight = resizeInfo.height;
+    var angle = (0, rotate_1.radianToAngle)(rotate);
+    // 右下角的control
+    var startZeroTouchControlPoint = {
+        x: controlX, // control锚点的坐标x
+        y: controlY, // control锚点的坐标y
+    };
+    var oldCenter = { x: oldCenterX, y: oldCenterY };
+    // 右下角的control坐标（transform后的-touchStartPoint）
+    var startRotatedTouchControlPoint = (0, rotate_1.calculatePointAfterRotateAngle)(startZeroTouchControlPoint, oldCenter, angle);
+    // 右下角的control坐标（transform后的-touchEndPoint）
+    var endRotatedTouchControlPoint = {
+        x: startRotatedTouchControlPoint.x + deltaX,
+        y: startRotatedTouchControlPoint.y + deltaY,
+    };
+    // 计算出新的宽度和高度以及新的中心点
+    var _a = calculateWidthAndHeight(startRotatedTouchControlPoint, endRotatedTouchControlPoint, oldCenter, angle, freezeWidth, freezeHeight, oldWidth, oldHeight), newWidth = _a.width, newHeight = _a.height, newCenter = _a.center;
+    // calculateWidthAndHeight()得到的是整个宽度，比如圆pct=0.5,此时newWidth等于整个圆直径
+    resizeInfo.width = newWidth * pct;
+    resizeInfo.height = newHeight * pct;
+    // BaseNodeModel.resize(deltaX/2, deltaY/2)，因此这里要*2
+    resizeInfo.deltaX = (newCenter.x - oldCenter.x) * 2;
+    resizeInfo.deltaY = (newCenter.y - oldCenter.y) * 2;
+    return resizeInfo;
+}
 /**
@@ -15,6 +45,7 @@ * 计算 Control 拖动后，节点的高度信息
  */
-var recalcResizeInfo = function (index, resizeInfo, pct, freezeWidth, freezeHeight) {
+var recalcResizeInfo = function (index, resizeInfo, pct, freezeWidth, freezeHeight, rotate, controlX, controlY, oldCenterX, oldCenterY) {
     if (pct === void 0) { pct = 1; }
     if (freezeWidth === void 0) { freezeWidth = false; }
     if (freezeHeight === void 0) { freezeHeight = false; }
+    if (rotate === void 0) { rotate = 0; }
     var nextResizeInfo = (0, lodash_es_1.cloneDeep)(resizeInfo);
@@ -77,2 +108,10 @@ var deltaX = nextResizeInfo.deltaX, deltaY = nextResizeInfo.deltaY;
     }
+    if (rotate % (2 * Math.PI) !== 0 &&
+        controlX !== undefined &&
+        controlY !== undefined) {
+        // 角度rotate不为0，则触发另外的计算修正resize的deltaX和deltaY
+        // 因为rotate不为0的时候，左上角的坐标一直在变化
+        // 角度rotate不为0得到的resizeInfo.deltaX仅仅代表中心点的变化，而不是宽度的变化
+        return recalcRotatedResizeInfo(pct, nextResizeInfo, rotate, controlX, controlY, oldCenterX, oldCenterY, freezeWidth, freezeHeight);
+    }
     // 如果限制了宽/高不变，对应的 width/height 保持一致
@@ -151,13 +190,6 @@ switch (index) {
 exports.triggerResizeEvent = triggerResizeEvent;
-// TODO：确认 handleResize 函数的类型定义
-// export type IHandleResizeParams = {
-//   deltaX: number
-//   deltaY: number
-//   index: ResizeControlIndex
-//   nodeModel: BaseNodeModel
-//   graphModel: GraphModel
-//   cancelCallback?: () => void
-// }
 /**
  * 处理节点的 resize 事件，提出来放到 utils 中，方便在外面（extension）中使用
+ * @param x
+ * @param y
  * @param deltaX
@@ -171,7 +203,7 @@ * @param deltaY
 var handleResize = function (_a) {
-    var deltaX = _a.deltaX, deltaY = _a.deltaY, index = _a.index, nodeModel = _a.nodeModel, graphModel = _a.graphModel, cancelCallback = _a.cancelCallback;
+    var x = _a.x, y = _a.y, deltaX = _a.deltaX, deltaY = _a.deltaY, index = _a.index, nodeModel = _a.nodeModel, graphModel = _a.graphModel, cancelCallback = _a.cancelCallback;
     var r = nodeModel.r, // circle
     rx = nodeModel.rx, // ellipse/diamond
     ry = nodeModel.ry, width = nodeModel.width, // rect/html
-    height = nodeModel.height, PCTResizeInfo = nodeModel.PCTResizeInfo, minWidth = nodeModel.minWidth, minHeight = nodeModel.minHeight, maxWidth = nodeModel.maxWidth, maxHeight = nodeModel.maxHeight;
+    height = nodeModel.height, PCTResizeInfo = nodeModel.PCTResizeInfo, minWidth = nodeModel.minWidth, minHeight = nodeModel.minHeight, maxWidth = nodeModel.maxWidth, maxHeight = nodeModel.maxHeight, rotate = nodeModel.rotate, oldCenterX = nodeModel.x, oldCenterY = nodeModel.y;
     var isFreezeWidth = minWidth === maxWidth;
@@ -187,3 +219,5 @@ var isFreezeHeight = minHeight === maxHeight;
     var pct = r || (rx && ry) ? 1 / 2 : 1;
-    var nextSize = (0, exports.recalcResizeInfo)(index, resizeInfo, pct, isFreezeWidth, isFreezeHeight);
+    var controlX = x;
+    var controlY = y;
+    var nextSize = (0, exports.recalcResizeInfo)(index, resizeInfo, pct, isFreezeWidth, isFreezeHeight, rotate, controlX, controlY, oldCenterX, oldCenterY);
     // 限制放大缩小的最大最小范围
@@ -198,7 +232,19 @@ if (nextSize.width < minWidth ||
     }
-    // 如果限制了宽高不变，对应的 x/y 不产生位移
-    nextSize.deltaX = isFreezeWidth ? 0 : nextSize.deltaX;
-    nextSize.deltaY = isFreezeWidth ? 0 : nextSize.deltaY;
+    if (rotate % (2 * Math.PI) == 0 ||
+        PCTResizeInfo ||
+        controlX === undefined ||
+        controlY === undefined) {
+        // rotate!==0并且不是PCTResizeInfo时，即使是isFreezeWidth||isFreezeHeight
+        // recalcRotatedResizeInfo()计算出来的中心点会发生变化
+        // 如果限制了宽高不变，对应的 x/y 不产生位移
+        nextSize.deltaX = isFreezeWidth ? 0 : nextSize.deltaX;
+        nextSize.deltaY = isFreezeHeight ? 0 : nextSize.deltaY;
+    }
     var preNodeData = nodeModel.getData();
     var curNodeData = nodeModel.resize(nextSize);
+    // 检测preNodeData和curNodeData是否没变化
+    if (preNodeData.x === curNodeData.x && preNodeData.y === curNodeData.y) {
+        // 中心点x和y都没有变化，说明无法resize，阻止下面边的更新以及resize事件的emit
+        return;
+    }
     // 更新边
@@ -210,1 +256,79 @@ (0, exports.updateEdgePointByAnchors)(nodeModel, graphModel);
 exports.handleResize = handleResize;
+function calculateWidthAndHeight(startRotatedTouchControlPoint, endRotatedTouchControlPoint, oldCenter, angle, freezeWidth, freezeHeight, oldWidth, oldHeight) {
+    if (freezeWidth === void 0) { freezeWidth = false; }
+    if (freezeHeight === void 0) { freezeHeight = false; }
+    // 假设目前触摸的是右下角的control点
+    // 计算出来左上角的control坐标，resize过程左上角的control坐标保持不变
+    var freezePoint = {
+        x: oldCenter.x - (startRotatedTouchControlPoint.x - oldCenter.x),
+        y: oldCenter.y - (startRotatedTouchControlPoint.y - oldCenter.y),
+    };
+    // 【touchEndPoint】右下角 + freezePoint左上角 计算出新的中心点
+    var newCenter = (0, rotate_1.getNewCenter)(freezePoint, endRotatedTouchControlPoint);
+    // 得到【touchEndPoint】右下角-没有transform的坐标
+    var endZeroTouchControlPoint = (0, rotate_1.calculatePointAfterRotateAngle)(endRotatedTouchControlPoint, newCenter, -angle);
+    // ---------- 使用transform之前的坐标计算出新的width和height ----------
+    // 得到左上角---没有transform的坐标
+    var zeroFreezePoint = (0, rotate_1.calculatePointAfterRotateAngle)(freezePoint, newCenter, -angle);
+    if (freezeWidth) {
+        // 如果固定width，那么不能单纯使用endZeroTouchControlPoint.x=startZeroTouchControlPoint.x
+        // 因为去掉transform的左上角不一定是重合的，我们要保证的是transform后的左上角重合
+        var newWidth = Math.abs(endZeroTouchControlPoint.x - zeroFreezePoint.x);
+        var widthDx = newWidth - oldWidth;
+        // 点击的是左边锚点，是+widthDx/2，点击是右边锚点，是-widthDx/2
+        if (newCenter.x > endZeroTouchControlPoint.x) {
+            // 当前触摸的是左边锚点
+            newCenter.x = newCenter.x + widthDx / 2;
+        }
+        else {
+            // 当前触摸的是右边锚点
+            newCenter.x = newCenter.x - widthDx / 2;
+        }
+    }
+    if (freezeHeight) {
+        var newHeight = Math.abs(endZeroTouchControlPoint.y - zeroFreezePoint.y);
+        var heightDy = newHeight - oldHeight;
+        if (newCenter.y > endZeroTouchControlPoint.y) {
+            // 当前触摸的是上边锚点
+            newCenter.y = newCenter.y + heightDy / 2;
+        }
+        else {
+            newCenter.y = newCenter.y - heightDy / 2;
+        }
+    }
+    if (freezeWidth || freezeHeight) {
+        // 如果调整过transform之前的坐标，那么transform后的坐标也会改变，那么算出来的newCenter也得调整
+        // 由于无论如何rotate，中心点都是不变的，因此我们可以使用transform之前的坐标算出新的中心点
+        var nowFreezePoint = (0, rotate_1.calculatePointAfterRotateAngle)(zeroFreezePoint, newCenter, angle);
+        // 得到当前新rect的左上角与实际上transform后的左上角的偏移量
+        var dx = nowFreezePoint.x - freezePoint.x;
+        var dy = nowFreezePoint.y - freezePoint.y;
+        // 修正不使用transform的坐标: 左上角、右下角、center
+        newCenter.x = newCenter.x - dx;
+        newCenter.y = newCenter.y - dy;
+        zeroFreezePoint = (0, rotate_1.calculatePointAfterRotateAngle)(freezePoint, newCenter, -angle);
+        endZeroTouchControlPoint = {
+            x: newCenter.x - (zeroFreezePoint.x - newCenter.x),
+            y: newCenter.y - (zeroFreezePoint.y - newCenter.y),
+        };
+    }
+    // transform之前的坐标的左上角+右下角计算出宽度和高度
+    var width = Math.abs(endZeroTouchControlPoint.x - zeroFreezePoint.x);
+    var height = Math.abs(endZeroTouchControlPoint.y - zeroFreezePoint.y);
+    // ---------- 使用transform之前的坐标计算出新的width和height ----------
+    if (freezeWidth) {
+        // 理论计算出来的width应该等于oldWidth
+        // 但是有误差，比如oldWidth = 100; newWidth=100.000000000001
+        // 会在handleResize()限制放大缩小的最大最小范围中被阻止滑动
+        width = oldWidth;
+    }
+    if (freezeHeight) {
+        height = oldHeight;
+    }
+    return {
+        width: width,
+        height: height,
+        center: newCenter,
+    };
+}
+exports.calculateWidthAndHeight = calculateWidthAndHeight;

lib/view/Control.d.ts

@@ -33,2 +33,3 @@ import { createElement as h, Component } from 'preact/compat';
     constructor(props: IResizeControlProps);
+    componentWillUnmount(): void;
     updateEdgePointByAnchors: () => void;
@@ -35,0 +36,0 @@ triggerResizeEvent: (preNodeData: ResizeNodeData, curNodeData: ResizeNodeData, deltaX: any, deltaY: any, index: any, nodeModel: BaseNodeModel) => void;

lib/view/Control.js

@@ -216,5 +216,7 @@ "use strict";
             var index = _this.index;
-            var _b = _this.props, model = _b.model, graphModel = _b.graphModel;
+            var _b = _this.props, model = _b.model, graphModel = _b.graphModel, x = _b.x, y = _b.y;
             // DONE: 调用每个节点中更新缩放时的方法 updateNode 函数，用来各节点缩放的方法
             (0, util_1.handleResize)({
+                x: x,
+                y: y,
                 deltaX: deltaX,
@@ -320,2 +322,5 @@ deltaY: deltaY,
     }
+    ResizeControl.prototype.componentWillUnmount = function () {
+        this.dragHandler.cancelDrag();
+    };
     ResizeControl.prototype.render = function () {
@@ -322,0 +327,0 @@ var _a = this.props, x = _a.x, y = _a.y, direction = _a.direction, model = _a.model;

package.json

 {
   "name": "@logicflow/core",
-  "version": "2.0.5",
+  "version": "2.0.6",
   "description": "LogicFlow, help you quickly create flowcharts",
@@ -5,0 +5,0 @@ "main": "lib/index.js",

src/model/BaseModel.ts

@@ -59,2 +59,18 @@ import GraphModel from './GraphModel'
 
+  /**
+   * 限制节点resize规则
+   * model: 移动节点的 model
+   * deltaX: 中心点移动的 X 轴距离
+   * deltaY: 中心点移动的 Y 轴距离
+   * width: 中心点新的width
+   * height: 中心点新的height
+   */
+  export type NodeResizeRule = (
+    model: BaseNodeModel,
+    deltaX: number,
+    deltaY: number,
+    width: number,
+    height: number,
+  ) => boolean
+
   export type AdjustEdgeStartAndEndParams = {
@@ -61,0 +77,0 @@ startPoint: LogicFlow.Point

src/model/GraphModel.ts

@@ -84,7 +84,12 @@ import { find, forEach, map } from 'lodash-es'
    * 节点移动规则判断
-   * 在节点移动的时候，会出发此数组中的所有规则判断
+   * 在节点移动的时候，会触发此数组中的所有规则判断
    */
-
   nodeMoveRules: Model.NodeMoveRule[] = []
   /**
+   * 节点resize规则判断
+   * 在节点resize的时候，会触发此数组中的所有规则判断
+   */
+  nodeResizeRules: Model.NodeResizeRule[] = []
+
+  /**
    * 获取自定义连线轨迹
@@ -1234,2 +1239,8 @@ */
 
+  addNodeResizeRules(fn: Model.NodeResizeRule) {
+    if (!this.nodeResizeRules.includes(fn)) {
+      this.nodeResizeRules.push(fn)
+    }
+  }
+
   /**
@@ -1236,0 +1247,0 @@ * 设置默认的边类型

src/model/node/BaseNodeModel.ts

@@ -151,2 +151,3 @@ import { action, computed, isObservable, observable, toJS } from 'mobx'
   moveRules: Model.NodeMoveRule[] = [] // 节点移动之前的hook
+  resizeRules: Model.NodeResizeRule[] = [] // 节点resize之前的hook
   hasSetTargetRules = false // 用来限制rules的重复值
@@ -285,2 +286,9 @@ hasSetSourceRules = false; // 用来限制rules的重复值
     const { width, height, deltaX, deltaY } = resizeInfo
+
+    const isAllowResize = this.isAllowResizeNode(deltaX, deltaY, width, height)
+
+    if (!isAllowResize) {
+      return this.getData()
+    }
+
     // 移动节点以及文本内容
@@ -766,2 +774,26 @@ this.move(deltaX / 2, deltaY / 2)
 
+  @action addNodeResizeRules(fn: Model.NodeResizeRule) {
+    if (!this.resizeRules.includes(fn)) {
+      this.resizeRules.push(fn)
+    }
+  }
+
+  /**
+   * 内部方法
+   * 是否允许resize节点到新的位置
+   */
+  isAllowResizeNode(
+    deltaX: number,
+    deltaY: number,
+    width: number,
+    height: number,
+  ): boolean {
+    const rules = this.resizeRules.concat(this.graphModel.nodeResizeRules)
+    for (const rule of rules) {
+      const r = rule(this, deltaX, deltaY, width, height)
+      if (!r) return false
+    }
+    return true
+  }
+
   @action setSelected(flag = true): void {
@@ -768,0 +800,0 @@ this.isSelected = flag

src/util/resize.ts

@@ -389,2 +389,8 @@ import { ResizeControl, ResizeControlIndex } from '../view/Control'
 
+  // 检测preNodeData和curNodeData是否没变化
+  if (preNodeData.x === curNodeData.x && preNodeData.y === curNodeData.y) {
+    // 中心点x和y都没有变化，说明无法resize，阻止下面边的更新以及resize事件的emit
+    return
+  }
+
   // 更新边
@@ -421,3 +427,3 @@ updateEdgePointByAnchors(nodeModel, graphModel)
   // 【touchEndPoint】右下角 + freezePoint左上角 计算出新的中心点
-  let newCenter = getNewCenter(freezePoint, endRotatedTouchControlPoint)
+  const newCenter = getNewCenter(freezePoint, endRotatedTouchControlPoint)
 
@@ -424,0 +430,0 @@ // 得到【touchEndPoint】右下角-没有transform的坐标

No alert changes

Improved metrics

Total package byte prevSize

5537377

increased by1.05%

Number of package files

575

increased by0.7%

Lines of code

65830

increased by1.05%

No dependency changes