You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何在3d-force-graph中控制链接距离及设置单条链接强度?

控制3D Force Graph中节点间的连接强度

嘿,我刚好对这个库比较熟悉,给你梳理几个关键配置项,完美解决你的需求:

1. 控制链接的力学拉力强度

如果你想调整节点间连接的力学拉力强度(让某些链接更“结实”,拉扯节点的力度更大),可以用linkStrength配置项。它支持传入一个函数,接收每条链接的数据对象作为参数,返回对应的强度值:

const graph = ForceGraph3D()
  .graphData(yourGraphDataset)
  .linkStrength(link => link.customStrength); // customStrength是你在每条链接数据里自定义的字段,比如设为0.1、0.5、1等数值

你只需要在链接数据里给每条链接添加类似customStrength的自定义字段(名称随便取),再通过这个函数读取即可。数值越大,链接的拉力越强。

2. 用视觉宽度体现连接强度

如果想通过链接粗细直观体现强度,用linkWidth配置项,同样支持动态函数:

.linkWidth(link => link.customWidth || 1); // customWidth是你自定义的宽度字段,比如2、5、10等,默认值设为1

3. 用理想长度调整布局松紧

另外,linkDistance配置项可以设置每条链接在力导向布局中的理想距离,数值越小,节点会被拉得越近,也能间接体现连接的“紧密程度”:

.linkDistance(link => link.customDistance || 100); // customDistance是你自定义的长度字段,默认值100

这些配置的函数形式是关键——它们允许你针对每条链接单独设置参数,而非统一应用同一个值。你只需要在链接数据结构里提前加入对应的自定义字段,再通过这些配置函数读取就行。

内容的提问来源于stack exchange,提问作者Brian Dolan

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.28 03:47:30