D3.js d3Force'；s（d3-force-3d'；s）forceLink.links（）怎么办？_D3.js

D3.js d3Force'；s（d3-force-3d'；s）forceLink.links（）怎么办？

d3.js

D3.js d3Force'；s（d3-force-3d'；s）forceLink.links（）怎么办？,d3.js,D3.js,我希望forceLink的#功能能够“初始化”链接子集的力；但是，此函数显然不会将链接子集传递给后续的#distance函数（在下面的代码中），后者会接收所有链接问题：如何使用#links函数[或任何库函数]来提供链接子集，然后对其应用#distance之类的函数为了相关的清晰性，也许有助于了解links函数除了在移除/添加图形节点后重新应用力（可能使用函数）之外，还可以做些什么正文{页边距：0；} 常量图形数据={ 节点：[ {id:“爱丽丝”}， {id:“Bob”}， {id:“乔

我希望forceLink的#功能能够“初始化”链接子集的力；但是，此函数显然不会将链接子集传递给后续的#distance函数（在下面的代码中），后者会接收所有链接

问题：如何使用#links函数[或任何库函数]来提供链接子集，然后对其应用#distance之类的函数

为了相关的清晰性，也许有助于了解links函数除了在移除/添加图形节点后重新应用力（可能使用函数）之外，还可以做些什么


正文{页边距：0；}
常量图形数据={
节点：[
{id:“爱丽丝”}，
{id:“Bob”}，
{id:“乔治”}
],
链接：[
{来源：“爱丽丝”，目标：“乔治”，来源级别：6}，
{来源：“乔治”，目标：“鲍勃”，来源级别：7}
]
};
const elem=document.getElementById（'3d-graph'）；
常量图=ForceGraph3D（）（元素）
.graphData（graphData）；
常量graphLinksSubset=graphData.links
.filter（link=>link.sourceLevel==6）；
常量graphNodesSubset=graphLinksSubset
.map（链接=>{
返回[
graphData.nodes
.find（node=>node.id==link.source），
graphData.nodes
.find（node=>node.id==link.target）
]}）平坦（）；
常量图形数据子集={
节点：[…图形节点子集]，
链接：[……GraphlinkSubset]
}
图.d3Force（'link'）
.links（图形数据子集）
.距离（链接=>{
返回200；
//return link.sourceLevel==6？
//     50 : 200
} )
.id（node=>node.id）
//.强度（d=>linkStrength（d））
//同样的结果--
//图d3Force（'link'，d3.forceLink（图数据子集）
//.links（图形数据子集）
//.距离（链接=>{
//返回200；
////返回link.sourceLevel==5？
//     //   50 : 200
//   } )
//.id（node=>node.id）
////强度（d=>linkStrength（d））
// );

您的摘要和问题似乎有所不同。您是否寻求对功能的解释或问题的解决方案？主要是问题的解决方案；但如果您/某人可以帮助阐述#links函数的实用性，那就太好了。

<html>
<head>
  <style> body { margin: 0; } </style>

  <!-- <script src="https://unpkg.com/three"></script> -->
  <script src="https://unpkg.com/d3-force-3d"></script>
  <script src="https://unpkg.com/3d-force-graph"></script>
</head>

<body>
  <div id="3d-graph"></div>
  <script>

    const graphData = {
      nodes: [
        {id:"Alice"},
        {id:"Bob"},
        {id:"George"}
      ],
      links: [
        {source: "Alice", target:"George", sourceLevel: 6},
        {source: "George", target:"Bob", sourceLevel: 7}
      ]
    };

    const elem = document.getElementById('3d-graph');
    const Graph = ForceGraph3D()(elem)
      .graphData(graphData);

    const graphLinksSubset = graphData.links
      .filter( link => link.sourceLevel === 6 );
    const graphNodesSubset = graphLinksSubset
      .map( link => {
        return [
          graphData.nodes
            .find( node => node.id === link.source ),
          graphData.nodes
            .find( node => node.id === link.target )
        ] }).flat();
    const graphDataSubset = {
      nodes: [...graphNodesSubset],
      links: [...graphLinksSubset]
    }

    Graph.d3Force('link')
      .links(graphDataSubset)
      .distance( link=> {
        return 200;
      //   return link.sourceLevel === 6 ?
      //     50 : 200
      } )
      .id( node => node.id )
      // .strength( d => linkStrength(d) )


// SAME RESULT HERE--
    // Graph.d3Force('link', d3.forceLink(graphDataSubset)
    //   .links(graphDataSubset)
    //   .distance( link=> {
    //     return 200;
    //     // return link.sourceLevel === 5 ?
    //     //   50 : 200
    //   } )
    //   .id( node => node.id )
    //   // .strength( d => linkStrength(d) )
    // );


  </script>
</body>
</html>