1 回答

TA貢獻1844條經驗 獲得超8個贊
D3 的 sankey 模塊創建的鏈接是帶有貝塞爾曲線的 SVG 路徑。在您的示例中,瀏覽器的 SVG 引擎試圖在非常緊湊的水平空間內創建一條曲線路徑,路徑非常粗(描邊寬度)。例如比較以下兩個 SVG(唯一的區別是筆劃寬度)...
<svg style="width: 100%; height: 100%;">
<path d="M 0 50 C 25,50 25,100 50,100" style="stroke-width: 10px; fill: none; stroke: rgb(0, 0, 0); stroke-opacity: 0.2;"></path>
<g transform="translate(100,0)">
<path d="M 0 50 C 25,50 25,100 50,100" style="stroke-width: 80px; fill: none; stroke: rgb(0, 0, 0); stroke-opacity: 0.2;"></path>
</g>
</svg>
默認情況下,networkD3's sankey plot 嘗試使用其容器允許的盡可能多的水平和垂直空間,在您的情況下,這會導致高度與寬度的比例低于最佳水平,這使得節點之間的水平距離相對較小,并且高度節點的數量(以及鏈接的厚度)相對較大。
您可以通過更改容器的大小并刷新(即調整瀏覽器窗口的大小,或更改容器的 HTML/CSS 屬性)或通過指定寬度和高度來“修復”此問題,以便該比例適用于您的數據有,例如...
sankeyNetwork(
Links = links,
Nodes = nodes,
Source = "source",
Target = "target",
Value = "count",
NodeID = "name",
iterations = 0,
sinksRight = FALSE,
height = 250,
width = 1000
)
添加回答
舉報