aldehyde 0.2.474 → 0.2.476

package/lib/draw-canvas-edit/components/render/graphs/rect.js

@@ -0,0 +1,716 @@
+import Konva from 'konva';
+import { GraphDraw, LinkDraw, PreviewDraw } from '../draws';
+import { BaseGraph } from './base-graph';
+/**
+ * 图形 矩形
+ */
+export class Rect extends BaseGraph {
+    // 实现：更新 图形 的 调整点 的 锚点位置
+    static updateAnchorShadows(graph, anchorShadows) {
+        const { width, height } = graph.size();
+        for (const shadow of anchorShadows) {
+            switch (shadow.attrs.adjustType) {
+                case 'top':
+                    shadow.position({ x: width / 2, y: 0 });
+                    break;
+                case 'bottom':
+                    shadow.position({ x: width / 2, y: height });
+                    break;
+                case 'left':
+                    shadow.position({ x: 0, y: height / 2 });
+                    break;
+                case 'right':
+                    shadow.position({ x: width, y: height / 2 });
+                    break;
+                case 'top-left':
+                    shadow.position({ x: 0, y: 0 });
+                    break;
+                case 'top-right':
+                    shadow.position({ x: width, y: 0 });
+                    break;
+                case 'bottom-left':
+                    shadow.position({ x: 0, y: height });
+                    break;
+                case 'bottom-right':
+                    shadow.position({ x: width, y: height });
+                    break;
+            }
+        }
+    }
+    // 实现：更新 图形 的 连接点 的 锚点位置
+    static updateLinkAnchorShadows(graph, linkAnchorShadows) {
+        const { width, height } = graph.size();
+        for (const shadow of linkAnchorShadows) {
+            switch (shadow.attrs.alias) {
+                case 'top':
+                    shadow.position({ x: width / 2, y: 0 });
+                    break;
+                case 'bottom':
+                    shadow.position({ x: width / 2, y: height });
+                    break;
+                case 'left':
+                    shadow.position({ x: 0, y: height / 2 });
+                    break;
+                case 'right':
+                    shadow.position({ x: width, y: height / 2 });
+                    break;
+                case 'center':
+                    shadow.position({ x: width / 2, y: height / 2 });
+                    break;
+            }
+        }
+    }
+    // 实现：生成 调整点
+    static createAnchorShapes(render, graph, anchorAndShadows, 
+    // eslint-disable-next-line
+    adjustAnchor) {
+        var _a;
+        const stageState = render.getStageState();
+        for (const anchorAndShadow of anchorAndShadows) {
+            const { anchor, anchorShadow } = anchorAndShadow;
+            const x = render.toStageValue(anchorShadow.getAbsolutePosition().x - stageState.x), y = render.toStageValue(anchorShadow.getAbsolutePosition().y - stageState.y);
+            const offset = render.toStageValue(render.pointSize + 5);
+            const anchorShape = new Konva.Line({
+                name: 'anchor',
+                anchor: anchor,
+                stroke: `rgba(0,0,255,0.4)`,
+                strokeWidth: render.toStageValue(2),
+                hitStrokeWidth: render.toStageValue(3),
+                x,
+                y,
+                points: (_a = {
+                    'top-left': [[-offset, offset / 2], [-offset, -offset], [offset / 2, -offset]].flat(),
+                    top: [[-offset, -offset], [offset, -offset]].flat(),
+                    'top-right': [[-offset / 2, -offset], [offset, -offset], [offset, offset / 2]].flat(),
+                    right: [[offset, -offset], [offset, offset]].flat(),
+                    'bottom-right': [[-offset / 2, offset], [offset, offset], [offset, -offset / 2]].flat(),
+                    bottom: [[-offset, offset], [offset, offset]].flat(),
+                    'bottom-left': [[-offset, -offset / 2], [-offset, offset], [offset / 2, offset]].flat(),
+                    left: [[-offset, -offset], [-offset, offset]].flat()
+                }[anchor.adjustType]) !== null && _a !== void 0 ? _a : [],
+                rotation: graph.getAbsoluteRotation(), // 旋转角度
+                visible: graph.attrs.adjusting || graph.attrs.hover === true
+            });
+            anchorShape.on('mouseenter', () => {
+                document.body.style.cursor = 'move';
+                graph.setAttr('hover', true);
+                graph.setAttr('hoverAnchor', true);
+            });
+            anchorShape.on('mouseleave', () => {
+                document.body.style.cursor = anchorShape.attrs.adjusting ? 'move' : 'default';
+                graph.setAttr('hover', false);
+                graph.setAttr('hoverAnchor', false);
+                render.redraw([GraphDraw.name]);
+            });
+            anchorAndShadow.shape = anchorShape;
+        }
+        return { anchorAndShadows };
+    }
+    // 实现：调整 图形
+    static adjust(render, graph, graphSnap, adjustShape, anchorAndShadows, startPoint, endPoint, hoverRect) {
+        var _a, _b, _c, _d, _e;
+        // 目标 矩形
+        const rect = graph.findOne('.graph');
+        const rectSnap = graphSnap.findOne('.graph');
+        const anchors = ((_a = graph.find('.anchor')) !== null && _a !== void 0 ? _a : []);
+        const anchorsSnap = ((_b = graphSnap.find('.anchor')) !== null && _b !== void 0 ? _b : []);
+        const linkAnchors = ((_c = graph.find('.link-anchor')) !== null && _c !== void 0 ? _c : []);
+        if (rect && rectSnap) {
+            const [graphRotation, adjustType, ex, ey] = [
+                Math.round(graph.rotation()),
+                (_d = adjustShape.attrs.anchor) === null || _d === void 0 ? void 0 : _d.adjustType,
+                endPoint.x,
+                endPoint.y
+            ];
+            let anchorShadow, anchorShadowAcross;
+            switch (adjustType) {
+                case 'top':
+                    anchorShadow = anchorsSnap.find((o) => o.attrs.adjustType === 'top');
+                    anchorShadowAcross = anchorsSnap.find((o) => o.attrs.adjustType === 'bottom');
+                    break;
+                case 'bottom':
+                    anchorShadow = anchorsSnap.find((o) => o.attrs.adjustType === 'bottom');
+                    anchorShadowAcross = anchorsSnap.find((o) => o.attrs.adjustType === 'top');
+                    break;
+                case 'left':
+                    anchorShadow = anchorsSnap.find((o) => o.attrs.adjustType === 'left');
+                    anchorShadowAcross = anchorsSnap.find((o) => o.attrs.adjustType === 'right');
+                    break;
+                case 'right':
+                    anchorShadow = anchorsSnap.find((o) => o.attrs.adjustType === 'right');
+                    anchorShadowAcross = anchorsSnap.find((o) => o.attrs.adjustType === 'left');
+                    break;
+                case 'top-left':
+                    anchorShadow = anchorsSnap.find((o) => o.attrs.adjustType === 'top-left');
+                    anchorShadowAcross = anchorsSnap.find((o) => o.attrs.adjustType === 'bottom-right');
+                    break;
+                case 'top-right':
+                    anchorShadow = anchorsSnap.find((o) => o.attrs.adjustType === 'top-right');
+                    anchorShadowAcross = anchorsSnap.find((o) => o.attrs.adjustType === 'bottom-left');
+                    break;
+                case 'bottom-left':
+                    anchorShadow = anchorsSnap.find((o) => o.attrs.adjustType === 'bottom-left');
+                    anchorShadowAcross = anchorsSnap.find((o) => o.attrs.adjustType === 'top-right');
+                    break;
+                case 'bottom-right':
+                    anchorShadow = anchorsSnap.find((o) => o.attrs.adjustType === 'bottom-right');
+                    anchorShadowAcross = anchorsSnap.find((o) => o.attrs.adjustType === 'top-left');
+                    break;
+            }
+            if (anchorShadow && anchorShadowAcross) {
+                const { x: sx, y: sy } = anchorShadow.getAbsolutePosition();
+                const { x: ax, y: ay } = anchorShadowAcross.getAbsolutePosition();
+                {
+                    const d1 = Math.sqrt(Math.pow(sx - ax, 2) + Math.pow(sy - ay, 2));
+                    const d2 = Math.sqrt(Math.pow(ex - ax, 2) + Math.pow(ey - ay, 2));
+                    const r1 = d2 / d1;
+                    let zeroWidth = 1, zeroHeight = 1;
+                    switch (adjustType) {
+                        case 'top':
+                            if (graphRotation >= 45 && graphRotation < 135) {
+                                zeroHeight = ex <= ax ? 0 : 1;
+                            }
+                            else if (graphRotation >= -135 && graphRotation < -45) {
+                                zeroHeight = ex >= ax ? 0 : 1;
+                            }
+                            else if (graphRotation >= -45 && graphRotation < 45) {
+                                zeroHeight = ey >= ay ? 0 : 1;
+                            }
+                            else {
+                                zeroHeight = ey <= ay ? 0 : 1;
+                            }
+                            break;
+                        case 'bottom':
+                            if (graphRotation >= 45 && graphRotation < 135) {
+                                zeroHeight = ex <= ax ? 1 : 0;
+                            }
+                            else if (graphRotation >= -135 && graphRotation < -45) {
+                                zeroHeight = ex >= ax ? 1 : 0;
+                            }
+                            else if (graphRotation >= -45 && graphRotation < 45) {
+                                zeroHeight = ey >= ay ? 1 : 0;
+                            }
+                            else {
+                                zeroHeight = ey <= ay ? 1 : 0;
+                            }
+                            break;
+                        case 'left':
+                            if (graphRotation >= 45 && graphRotation < 135) {
+                                zeroWidth = ey >= ay ? 0 : 1;
+                            }
+                            else if (graphRotation >= -135 && graphRotation < -45) {
+                                zeroWidth = ex <= ax ? 0 : 1;
+                            }
+                            else if (graphRotation >= -45 && graphRotation < 45) {
+                                zeroWidth = ex >= ax ? 0 : 1;
+                            }
+                            else {
+                                zeroWidth = ey <= ay ? 0 : 1;
+                            }
+                            break;
+                        case 'right':
+                            if (graphRotation >= 45 && graphRotation < 135) {
+                                zeroWidth = ey >= ay ? 1 : 0;
+                            }
+                            else if (graphRotation >= -135 && graphRotation < -45) {
+                                zeroWidth = ex <= ax ? 1 : 0;
+                            }
+                            else if (graphRotation >= -45 && graphRotation < 45) {
+                                zeroWidth = ex >= ax ? 1 : 0;
+                            }
+                            else {
+                                zeroWidth = ey <= ay ? 1 : 0;
+                            }
+                            break;
+                        case 'top-left':
+                            if (graphRotation > -45 && graphRotation < 45) {
+                                if (ex >= ax && ey >= ay) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if (graphRotation === 45) {
+                                if (ey >= ay) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if (graphRotation > 45 && graphRotation < 135) {
+                                if (ex <= ax && ey >= ay) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if (graphRotation === 135) {
+                                if (ex <= ax) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if ((graphRotation > 135 && graphRotation <= 180) || (graphRotation >= -180 && graphRotation < -135)) {
+                                if (ex <= ax && ey <= ay) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if (graphRotation === -135) {
+                                if (ey <= ay) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if (graphRotation > -135 && graphRotation < -45) {
+                                if (ex >= ax && ey <= ay) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if (graphRotation === -45) {
+                                if (ex >= ax) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            break;
+                        case 'top-right':
+                            if (graphRotation > -45 && graphRotation < 45) {
+                                if (ex <= ax && ey >= ay) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if (graphRotation === 45) {
+                                if (ex <= ax) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if (graphRotation > 45 && graphRotation < 135) {
+                                if (ex <= ax && ey <= ay) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if (graphRotation === 135) {
+                                if (ey <= ay) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if ((graphRotation > 135 && graphRotation <= 180) || (graphRotation >= -180 && graphRotation < -135)) {
+                                if (ex >= ax && ey <= ay) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if (graphRotation === -135) {
+                                if (ex >= ax) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if (graphRotation > -135 && graphRotation < -45) {
+                                if (ex >= ax && ey >= ay) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if (graphRotation === -45) {
+                                if (ey >= ay) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            break;
+                        case 'bottom-left':
+                            if (graphRotation > -45 && graphRotation < 45) {
+                                if (ex >= ax && ey <= ay) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if (graphRotation === 45) {
+                                if (ex >= ax) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if (graphRotation > 45 && graphRotation < 135) {
+                                if (ex >= ax && ey >= ay) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if (graphRotation === 135) {
+                                if (ey >= ay) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if ((graphRotation > 135 && graphRotation <= 180) || (graphRotation >= -180 && graphRotation < -135)) {
+                                if (ex <= ax && ey >= ay) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if (graphRotation === -135) {
+                                if (ex <= ax) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if (graphRotation > -135 && graphRotation < -45) {
+                                if (ex <= ax && ey <= ay) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if (graphRotation === -45) {
+                                if (ey <= ay) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            break;
+                        case 'bottom-right':
+                            if (graphRotation > -45 && graphRotation < 45) {
+                                if (ex <= ax && ey <= ay) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if (graphRotation === 45) {
+                                if (ey <= ay) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if (graphRotation > 45 && graphRotation < 135) {
+                                if (ex >= ax && ey <= ay) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if (graphRotation === 135) {
+                                if (ex >= ax) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if ((graphRotation > 135 && graphRotation <= 180) || (graphRotation >= -180 && graphRotation < -135)) {
+                                if (ex >= ax && ey >= ay) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if (graphRotation === -135) {
+                                if (ey >= ay) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if (graphRotation > -135 && graphRotation < -45) {
+                                if (ex <= ax && ey >= ay) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            else if (graphRotation === -45) {
+                                if (ex <= ax) {
+                                    zeroWidth = 0;
+                                    zeroHeight = 0;
+                                }
+                                else {
+                                    zeroWidth = 1;
+                                    zeroHeight = 1;
+                                }
+                            }
+                            break;
+                    }
+                    if (/-?(left|right)$/.test(adjustType)) {
+                        graph.width(Math.max(2, graphSnap.width() * r1 * zeroWidth));
+                    }
+                    if (/^(top|bottom)-?/.test(adjustType)) {
+                        graph.height(Math.max(2, graphSnap.height() * r1 * zeroHeight));
+                    }
+                }
+                {
+                    const [graphWidth, graphHeight] = [graph.width() * graph.scaleX(), graph.height() * graph.scaleY()];
+                    const cos = Math.cos((graphRotation * Math.PI) / 180);
+                    const sin = Math.sin((graphRotation * Math.PI) / 180);
+                    const tan = Math.tan((graphRotation * Math.PI) / 180);
+                    switch (adjustType) {
+                        case 'top':
+                            graph.x(ax - (graphWidth / 2 - graphHeight * tan) * cos);
+                            if (graphRotation !== 90 && graphRotation !== -90) {
+                                graph.y(ay - (graphHeight / cos + (graphWidth / 2 - graphHeight * tan) * sin));
+                            }
+                            break;
+                        case 'bottom': // 无需处理
+                            break;
+                        case 'left':
+                            if ([90, -90].includes(graphRotation)) {
+                                graph.y(ay - graphWidth);
+                            }
+                            else if (Math.abs(graphRotation) === 180) {
+                                graph.x(ax + graphWidth);
+                            }
+                            else {
+                                const v1 = graphHeight / 2 / cos;
+                                const v2 = v1 * sin;
+                                const v3 = graphWidth - v2;
+                                const v4 = v3 * sin;
+                                graph.x(ax - v3 * cos);
+                                graph.y(ay - (v1 + v4));
+                            }
+                            break;
+                        case 'right': // 无需处理
+                            break;
+                        case 'top-left':
+                            graph.x(ax - (graphWidth - graphHeight * tan) * cos);
+                            graph.y(ay - (graphWidth * sin + graphHeight * cos));
+                            break;
+                        case 'top-right':
+                            graph.x(ax + graphHeight * sin);
+                            graph.y(ay - graphHeight * cos);
+                            break;
+                        case 'bottom-left':
+                            graph.x(ax - graphWidth * cos);
+                            graph.y(ay - graphWidth * sin);
+                            break;
+                        case 'bottom-right': // 无需处理
+                            break;
+                    }
+                }
+            }
+            const [graphWidth, graphHeight] = [graph.width(), graph.height()];
+            // 更新 矩形 大小
+            rect.width(graphWidth);
+            rect.height(graphHeight);
+            // 更新 调整点 的 锚点 位置
+            Rect.updateAnchorShadows(graph, anchors);
+            // 更新 图形 的 连接点 的 锚点位置
+            Rect.updateLinkAnchorShadows(graph, linkAnchors);
+            const stageState = render.getStageState();
+            // 更新 调整点 位置
+            for (const anchor of anchors) {
+                for (const { shape } of anchorAndShadows) {
+                    if (shape) {
+                        if (((_e = shape.attrs.anchor) === null || _e === void 0 ? void 0 : _e.adjustType) === anchor.attrs.adjustType) {
+                            const anchorShadow = graph.find(`.anchor`).find((o) => o.attrs.adjustType === anchor.attrs.adjustType);
+                            if (anchorShadow) {
+                                shape.position({
+                                    x: render.toStageValue(anchorShadow.getAbsolutePosition().x - stageState.x),
+                                    y: render.toStageValue(anchorShadow.getAbsolutePosition().y - stageState.y)
+                                });
+                                shape.rotation(graph.getAbsoluteRotation());
+                            }
+                        }
+                    }
+                }
+            }
+            render.redraw([GraphDraw.name, LinkDraw.name, PreviewDraw.name]);
+        }
+        BaseGraph.adjust(render, graph, graphSnap, adjustShape, anchorAndShadows, startPoint, endPoint, hoverRect);
+    }
+    /**
+     * 提供给 GraphDraw draw 使用
+     */
+    static draw(graph, render, adjustAnchor) {
+        // 调整点 及其 锚点
+        const { anchorAndShadows } = super.draw(graph, render, adjustAnchor);
+        return Rect.createAnchorShapes(render, graph, anchorAndShadows, adjustAnchor);
+    }
+    constructor(render, dropPoint) {
+        super(render, dropPoint, {
+            type: "Rect",
+            anchors: [
+                { adjustType: 'top' },
+                { adjustType: 'bottom' },
+                { adjustType: 'left' },
+                { adjustType: 'right' },
+                { adjustType: 'top-left' },
+                { adjustType: 'top-right' },
+                { adjustType: 'bottom-left' },
+                { adjustType: 'bottom-right' }
+            ].map((o) => ({ adjustType: o.adjustType })),
+            linkAnchors: [
+                { x: 0, y: 0, alias: 'top', direction: 'top' },
+                { x: 0, y: 0, alias: 'bottom', direction: 'bottom' },
+                { x: 0, y: 0, alias: 'left', direction: 'left' },
+                { x: 0, y: 0, alias: 'right', direction: 'right' },
+                { x: 0, y: 0, alias: 'center' }
+            ]
+        });
+        this.rect = new Konva.Rect({
+            name: 'graph',
+            x: 0,
+            y: 0,
+            width: 0,
+            height: 0,
+            stroke: this.render.getPageSettings().stroke,
+            strokeWidth: this.render.getPageSettings().strokeWidth
+        });
+        this.group.add(this.rect);
+        this.group.position(this.dropPoint);
+    }
+    // 实现：拖动进行时
+    drawMove(point) {
+        let offsetX = point.x - this.dropPoint.x, offsetY = point.y - this.dropPoint.y;
+        if (offsetX < 1)
+            offsetX = 1;
+        if (offsetY < 1)
+            offsetY = 1;
+        // 矩形 位置大小
+        this.rect.width(offsetX);
+        this.rect.height(offsetY);
+        this.group.size({ width: offsetX, height: offsetY });
+        Rect.updateAnchorShadows(this.group, this.anchorShadows);
+        Rect.updateLinkAnchorShadows(this.group, this.linkAnchorShadows);
+        this.render.redraw([GraphDraw.name, LinkDraw.name, PreviewDraw.name]);
+    }
+    // 实现：拖动结束
+    drawEnd() {
+        if (this.rect.width() <= 1 && this.rect.height() <= 1) {
+            const width = Rect.size, height = width;
+            this.rect.width(width - this.rect.strokeWidth());
+            this.rect.height(height - this.rect.strokeWidth());
+            this.group.size({ width, height });
+            Rect.updateAnchorShadows(this.group, this.anchorShadows);
+            Rect.updateLinkAnchorShadows(this.group, this.linkAnchorShadows);
+            this.render.attractTool.alignLinesClear();
+            this.render.updateHistory();
+            this.render.redraw([GraphDraw.name, LinkDraw.name, PreviewDraw.name]);
+        }
+        super.drawEnd();
+    }
+}
+/**
+ * 默认图形大小
+ */
+Rect.size = 100;
+//# sourceMappingURL=rect.js.map