d3.js - 对象构造函数中的 D3 v4 气泡模拟未放置圆

Question

我想通过将创建放在一个对象中并调用该对象的实例来创建 D3 气泡图。

在对象之外，脚本运行良好，显示出散布在画布中的气泡。

但是，当我尝试将脚本放置在对象构造函数中时，forceSimulation 函数似乎并没有将气泡分散在 y 轴上。他们只是聚集在同一个 cy 和 cx

this.forceStrength = 0.03;


  this.width = 940;
  this.height = 600;

  this.center = { x: this.width / 2, y: this.height / 2 };

  this.svg = null;
  this.bubbles = null;
  this.nodes = [];


  this.charge = function(d) {
    return -Math.pow(d.radius, 2.0) * this.forceStrength;
  }

this.simulation = d3.forceSimulation()
        .velocityDecay(0.2) //controls the friction at each "tick"
        .force('x', d3.forceX().strength(this.forceStrength).x(this.center.x))
        .force('y', d3.forceY().strength(this.forceStrength).y(this.center.y))
        .force('charge', d3.forceManyBody().strength(this.charge))
        .on('tick',this.ticked)
        .on('end', function() {
    // layout is done
    console.log("end")
  });

更新这是完整示例代码的jsfiddle