Javascript d3复利债务

我正在尝试创建一个复利建模图，对于每一张信用卡，它将允许用户修改（通过滑块）他们每月支付的金额，并在指数函数图中看到这一点——当他们增加滑块金额时，指数曲线与上轴（年）相交越早还清债务

---

在sliderchange上重画指数函数，还是为增量和每次转换创建json更好？我没有见过很多d3指数函数的例子。

我不能说这是最好的解决方案，但如果我这样做，我可以这样做：

我的假设是

复利是根据一定的时间间隔计算的（我想信用卡是每月一次）

图表将显示未来几年（比如说10年）的总金额

在此基础上，我们可以得出要绘制的点数，例如120（10年乘以12个月）

然后，通过一个简单的循环，我将创建一个120个元素的

null

s数组：

var points = [null, null, null, null, null, null.....null, null]; // 120 null's

然后我将创建一个线生成器，它根据数组中的索引计算X和Y。意思是，因为目标是运行这样的东西：

d3.select('svg')
  .append('path')
  .attr('d', lineGenerator(points))// points are the array of nulls

var lineGenerator = d3.svg.line()
  .x(function(d, i) {
    // return a date value calculated as function of i
  })
  .y(function(d, i) {
    // return a compound interest "future value" as a function of i
  })

然后，我会像这样创建线生成器：

d3.select('svg')
  .append('path')
  .attr('d', lineGenerator(points))// points are the array of nulls

var lineGenerator = d3.svg.line()
  .x(function(d, i) {
    // return a date value calculated as function of i
  })
  .y(function(d, i) {
    // return a compound interest "future value" as a function of i
  })

---

关键是这样，当用户更改参数（通过滑块）时，无需重建点阵列（除非点数必须更改，在这种情况下，我会从中追加/删除

null

s）。即使是传递到line generator的

x（）

和

y（）

方法中的函数也不必更改–只有这些函数中用于计算输出的参数（即变量）必须更改。

我不确定是否理解您的要求？您想知道每一次更改创建一个新路径与每一次更改更新现有路径中的点的相对优点吗？这正是我的意思，我最终更新了路径，效果很好。谢谢，我能够生成整个数据集，然后每一次更改更新路径。