d3.js強制圖形：將圖形分散得太多的鏈接

我想在強制有向圖中顯示一組節點。這些節點幾乎完全是父子關係（幾乎是一棵樹）。有幾個有很多孩子的節點，其他大多數是葉子節點。這產生了幾個相互連接的節點「島」的結構。問題在於，這些「島」保持分散，尤其是當節點被拖拽時。d3.js強制圖形：將圖形分散得太多的鏈接

小提琴這裏：https://jsfiddle.net/50oz3xtr/ 我一直試圖在以下塊不同的設置：

var simulation = d3.forceSimulation() 
.force("link", d3.forceLink().id(function(d) { return d.id; })) 
.force("charge", d3.forceManyBody()) 
.force("center", d3.forceCenter(width/2, height/2));

但沒有運氣（強度，distanceMin ...）

我的問題是： - 如何我可以在鏈接上設置「最大長度」，所以圖表不會傳播太多嗎？ - 有沒有辦法給鏈接設置一個「固定」的長度？

來源

2017-03-05 Trashie

你可以做的是在模擬試圖優化的每個鏈路上設置一個「理想」長度。

要做到這一點，鏈距離的方法來你的「鏈接」力到底 - api reference

例如

.force("link", d3.forceLink().id(function(d) { return d.id; }).distance({x}));

您還可以將函數傳遞給distance方法，該方法允許您通過鏈接基礎改變鏈接上的理想距離。另外，請記住，你有多個部隊在這裏行動，所以其他部隊可能會「干擾」你的聯繫力量。我會考慮在每個環節上使用「強度」設置，並考慮使用「碰撞」力而不是多個身體。

使用參數對每個力量應該得到你以後的結果。

來源

2017-03-05 11:46:41 bartelski

事實上，我有一個測試使用這種方法，但結果是相同的。它不同，是最初的佈局。但是，只要我點擊一個節點來拖拽它（即使根本不拖拽它），仿真也會繼續運行，並以類似的結構結束（即通過非常長的「字符串」相互連接的節點島），即使我修復了鏈接距離（）。distance（） – Trashie

我建議你嘗試這樣的事情：var simulation = d3.forceSimulation（） .force（「link」，d3.forceLink（）.id（function（d）{return d .id;}）。distance（10）） .force（「collide」，d3.forceCollide（10）） .force（「center」，d3.forceCenter（width/2，height/2））; 更新小提琴：https://jsfiddle.net/50oz3xtr/1/ – bartelski

d3.js強制圖形：將圖形分散得太多的鏈接

回答

相關問題