Question

我关注Mike Bostock's pattern for reusable charts - 使用getter / setter关闭。但不知何故，当我使用新属性实例化新图表对象时，现有图表正在使用这些属性进行更新：

var chart1 = new StackedAreaChart();
d3.select('#chart1')
    .data([data])
    .call(chart1);     

// a new chart - whose properties end up in chart1!
var chart2 = new StackedAreaChart().colors(['green', 'blue']);

以下是一个例子：http://jsfiddle.net/samselikoff/YZ6Ea/3/。调整窗口大小以查看第一个重新渲染的图表，带有时尚但意想不到的绿色色调。

我对此感到困惑。我怀疑（1）我的setter正在改变实际的'构造函数'，并且（2）不知何故chart1实际上是对这个构造函数的引用，而不是像我想的那样成为它的单独实例。

我在考虑使用this.margin = ...代替var margin =，但由于这是建议的模式，我想先在此处发布。我错过了什么？

Answer 1

如果您正在关注Mike的教程，则在创建图表时不应使用new：

var chart1 = StackedAreaChart();

d3.select('#chart1')
  .data([data])
  .call(chart1);

StackedAreaChart将返回一个函数，当绑定数据时，将为选择中的每个元素调用该函数。

影响现有实例的新图表对象实例

1 个答案: