我正在 this package 中试用 3d 力图我正在寻找影响节点之间结合强度的方法。链接宽度或长度都不错，但我在 API 中看不到任何允许我控制或影响的内容。传递链接强度的 Graph 的正确字段是什么，每个链接一个？
最佳答案
这是此 example 的修改版本每个链接应用自定义距离:
const N = 300;
const gData = {
nodes: [...Array(N).keys()].map(i => ({ id: i })),
links: [...Array(N).keys()]
.filter(id => id)
.map(id => {
var distance = (Math.random() < 0.2) ? 75 : 250;
var width = (distance == 75) ? 4 : 0.2;
return ({
source: id,
target: Math.round(Math.random() * (id-1)),
width: width,
distance: distance
})
})
};
const Graph = ForceGraph3D()
(document.getElementById('3d-graph'))
.graphData(gData)
.linkWidth('width')
.cameraPosition({ z: 600 })
.d3Force("link", d3.forceLink().distance(d => d.distance))
.d3Force("charge", d3.forceManyBody().theta(0.5).strength(-1));<head>
<style> body { margin: 0; } </style>
<script src="//unpkg.com/3d-force-graph"></script>
<script src="https://d3js.org/d3.v4.min.js"></script>
</head>
<body>
<div id="3d-graph"></div>
</body>事实上，为了允许用户修改链接参数，库只使用了 d3 force应用程序接口(interface)。唯一的区别是访问器在 3d-force-graph 中的名称。库是 .d3Force()(而不是 d3 中的 .force())。
例如，要修改每个链接的距离，我们可以为每个链接数据点添加一个distance属性(除了source和target)，然后在力布局中修改此距离(使用 d3Force 访问器):
.d3Force("link", d3.forceLink().distance(d => d.distance))
而在 d3 force 布局中我们会使用:
.force("link", d3.forceLink().distance(d => d.distance))
这给了我们:
const Graph = ForceGraph3D()
(document.getElementById('3d-graph'))
.graphData(gData)
.linkWidth('width')
// The link distance modification:
.d3Force("link", d3.forceLink().distance(d => d.distance))
// To make it prettier:
.d3Force("charge", d3.forceManyBody().theta(0.5).strength(-1));
可以用同样的方式调整强度，使用:
.d3Force("link", d3.forceLink().strength(d => d.strength))
在示例中，我为每个链接指定了一个随机距离 75 或 250。为了清楚起见，我为距离较小的链接指定了较大的宽度。我的演示中的节点分布并不完美，可能需要额外调整。
关于javascript - 如何影响 3d-force-graph 中的链接距离？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/50360821/