小编pal*_*rmo的帖子

我正在尝试实现一个简单的强制布局,其中可以动态添加和删除节点(没有链接).我在D3版本3中成功实现了这个概念,但我无法将其转换为版本4.添加和更新节点后,模拟冻结,并在svg的左上角绘制传入的圆圈.有人知道为什么会这样吗？谢谢你的帮助 :)

我的概念基于这个解决方案: 向Force-directed布局添加新节点

JSFiddle:在d3 v3中运行代码

/* Define class */
class Planet {
  constructor(selector) {
    this.w = $(selector).innerWidth();
    this.h = $(selector).innerHeight();

    this.svg = d3.select(selector)
      .append('svg')
      .attr('width', this.w)
      .attr('height', this.h);

    this.force = d3.layout.force()
      .gravity(0.05)
      .charge(-100)
      .size([this.w, this.h]);

    this.nodes = this.force.nodes();
  }

  /* Methods (are called on object) */
  update() {
    /* Join selection to data array -> results in three new selections enter, update and exit */
    const circles = this.svg.selectAll('circle')
      .data(this.nodes, d => d.id); // arrow function, function(d) { return …