From 0f22b416825de901149cc16927d5deb6cd28b22a Mon Sep 17 00:00:00 2001 From: yitacls <75364857+yitacls@users.noreply.github.com> Date: Tue, 10 Jun 2025 01:54:37 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BC=98=E5=8C=96=E8=8A=82=E7=82=B9?= =?UTF-8?q?=E5=88=9D=E5=A7=8B=E5=B8=83=E5=B1=80=EF=BC=8C=E6=A0=B9=E6=8D=AE?= =?UTF-8?q?=E5=87=BA=E5=85=A5=E5=BA=A6=E6=96=BD=E5=8A=A0=E6=B0=B4=E5=B9=B3?= =?UTF-8?q?=E5=8A=9B=EF=BC=8C=E6=8F=90=E5=8D=87=E5=88=9D=E5=A7=8B=E5=8F=AF?= =?UTF-8?q?=E8=A7=86=E5=8C=96=E7=BB=93=E6=9E=84=E6=B8=85=E6=99=B0=E5=BA=A6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/public/script.js | 31 +++++++++++++++++++++++++++++++ 1 file changed, 31 insertions(+) diff --git a/src/public/script.js b/src/public/script.js index 64e83bf..18452f7 100644 --- a/src/public/script.js +++ b/src/public/script.js @@ -894,6 +894,23 @@ function renderDependencyGraph() { .force("charge", d3.forceManyBody().strength(-300)) .force("center", d3.forceCenter(width / 2, height / 2)) .force("collide", d3.forceCollide().radius(30)) + // 新增:水平分布力 + .force("x", d3.forceX().x(d => { + // 计算节点的入度和出度 + const inDegree = links.filter(l => (l.target.id || l.target) === d.id).length; + const outDegree = links.filter(l => (l.source.id || l.source) === d.id).length; + + if (inDegree === 0) { + // 入度为0的节点(起始节点)靠左 + return width * 0.2; + } else if (outDegree === 0) { + // 出度为0的节点(终止节点)靠右 + return width * 0.8; + } else { + // 其他节点在中间 + return width * 0.5; + } + }).strength(0.2)) // 调整力的强度,可以根据需要调整 .on("tick", ticked); // 添加用於存放連結和節點的組 @@ -1054,6 +1071,20 @@ function renderDependencyGraph() { // 5. 更新力導向模擬,但不啟動 simulation.nodes(nodes); // 更新模擬節點 simulation.force("link").links(links); // 更新模擬連結 + + // 更新水平分布力的目標位置 + simulation.force("x").x(d => { + const inDegree = links.filter(l => (l.target.id || l.target) === d.id).length; + const outDegree = links.filter(l => (l.source.id || l.source) === d.id).length; + + if (inDegree === 0) { + return width * 0.2; + } else if (outDegree === 0) { + return width * 0.8; + } else { + return width * 0.5; + } + }); // 注意:移除了 restart() 調用,防止刷新時的動畫跳變 }