Question

我已经用力仿真初始化了气泡图。我如何更新数据，即。更改气泡半径。

我尝试用一组新的节点重新启动forceSimulation，但是所有其他节点都在移动，就像费用增加了一样。

var nodes=[{'radius':3},{'radius':4},{'radius':5},{'radius':6}];

var sim = d3.forceSimulation(nodes)
    .force('charge', d3.forceManyBody().strength(-1))
    .force('center', d3.forceCenter(width / 2, height / 2))
    .force('collision', d3.forceCollide().radius(function(d) {
      return d.radius
    }))
    .on('tick',ticked)


 function ticked() {
  var u = svgContainer
     .selectAll('circle')
     .data(nodes)
   u.enter()
    .append('circle')
    .attr('fill','orange')
    .merge(u)
    .attr('r', function(d) {
    return d.radius
    })
   .attr('cx', function(d) {
      return d.x
    })
   .attr('cy', function(d) {
      return d.y
    })
  u.exit().remove()
}


function updateBubbles(){
    node[0]['radius]=10;
     sim.nodes(nodes).alpha(1).restart();
}

Answer 1

您可以将updateBubbles更改为以下内容：

function updateBubbles() {
    svgContainer.selectAll('circle')
        .attr('r', 10);     
}

当前节点的移动就像增加电荷一样，因为您将alpha设置为1并重新启动了仿真。这是我们期望在立即重新加热图形时看到的行为。

用新的气泡半径更新ForceSimulation

1 个答案: