修复 bug

src/hook/render/render-view.js

@@ -0,0 +1,122 @@
+import * as d3 from 'd3';
+import { WireRender } from './wire';
+import { PortRender } from './port';
+import { InstantiationRender } from './instantiation';
+import { ConnectionRender } from './connection';
+import { CellRender } from './cell';
+import { CrossDotRender } from './cross-dot';
+import { globalLookup } from '../global';
+
+export class RenderViewNode {
+    /**
+     * 
+     * @param {d3.Selection} g 
+     */
+    constructor(g) {
+        this.g = g;
+
+        /**
+         * @type {WireRender}
+         */
+        this.wireRender = undefined;
+
+        /**
+         * @type {CrossDotRender}
+         */
+        this.crossDotRender = undefined;
+
+        /**
+         * @type {CellRender}
+         */
+        this.cellRender = undefined;
+
+        /**
+         * @type {ConnectionRender}
+         */
+        this.connectionRender = undefined;
+
+        /**
+         * @type {InstantiationRender}
+         */
+        this.instantiationRender = undefined;
+
+        /**
+         * @type {PortRender}
+         */
+        this.portRender = undefined;
+
+        /**
+         * @type {Map<string, RenderViewNode>}
+         */
+        this.id2children = new Map;
+    }
+
+    hasChild(id) {
+        return this.id2children.has(id);
+    }
+    
+    getChild(id) {
+        return this.id2children.get(id);
+    }
+
+    setChild(id, node) {
+        this.id2children.set(id, node);
+    }
+
+    /**
+     * @description 根据布局更新点的位置（不需要创建 DOM）
+     * @param {import('elkjs').ElkNode} layout 
+     */
+    updateNode(layout) {
+        const skinManager = globalLookup.skinManager;
+        for (const node of layout.children) {
+            const skin = skinManager.querySkin(node.renderName);
+            if (skin) {
+                this.cellRender.addUpdateDataItem(node);
+            } else {
+                if (node.renderType === 'port') {
+                    this.portRender.addUpdateDataItem(node);
+                } else {
+                    // 没有 skin 的器件或者端口
+                    this.instantiationRender.addUpdateDataItem(node);
+                }
+            }
+
+            // for (const cellPort of node.ports || []) {
+            //     this.connectionRender.addUpdateDataItem(cellPort, node); 
+            // }
+        }
+
+        this.portRender.update();
+        this.instantiationRender.update();
+        this.cellRender.update();
+        // this.connectionRender.update();
+    }
+
+    /**
+     * @description 更新边（需要删除再创建 DOM）
+     * @param {import('elkjs').ElkNode} layout 
+     */
+    updateEdge(layout) {
+        this.wireRender.destroy();
+        this.crossDotRender.destroy();
+
+        for (const edge of layout.edges) {
+            for (const section of edge.sections || []) {
+                const points = [];
+                points.push(section.startPoint);
+                for (const point of section.bendPoints || []) {
+                    points.push(point);
+                }
+                points.push(section.endPoint);
+                this.wireRender.addAsD3DataItems(points, edge);
+
+                // 制作线段
+
+            }
+        }
+
+        this.wireRender.render();
+
+    }
+}

src/hook/render/wire.js

@@ -137,7 +137,11 @@ export class WireRender {
                             return `translate(${point.x},${point.y})`;
                         }
                     });
-                    transition = transition.on('end', renderOneAnimation);
+                    transition = transition.on('end', function() {
+                        if (id2animation.has(data.id)) {
+                            renderOneAnimation();
+                        }
+                    });
                     // 动画结束后重新启动动画
                     id2animation.set(data.id, {
                         pivot,