Question

我在拖动，缩放和更新的图表上工作。这主要是有效的，但是，在添加新数据后，拖动位置不会更新。

重现的步骤：

所以我想，在添加新数据时，我不得不更新拖动原点。但是怎么样？到目前为止，我无法找到任何这方面的例子。我也查看了code of the dragging functionality of D3，但我仍然不清楚。同样的事情发生在缩放上，我想这也是同样的问题。

此处可以看到代码和演示： http://jsbin.com/irixag/1/edit

编辑：如果不清楚我的意思，请告诉我，以便我可以重新解释这个问题。

Answer 1

好的，我一直在筛选您的代码和d3.js源代码，并且我注意到了一些事情。

首先，我的解决方案的要点是添加

function update() {
    ...
    if (shiftRight) {
        zoom.x(x); // You're missing this line
        ...
    }
    ...
}

这就是原因：

您正在使用.x(x)对象上的d3.behavior.zoom()调用初始化水平拖放。这看起来很好，除了这个拖累和drop handler不是为不同的起源而设计的。

基本上，当您致电d3.behavior.zoom().x(x)时，您宣布现在，x的值就是原点。现在，d3.js存储了这个值，所以即使你正在动画循环中移动窗口，也可以拖动它。滴水仍将尊重原始原产地。

在d3.behavior.zoom来源中，有三个感兴趣的变量，x0，x1和translate。 x1是对您传入的x变量的当前值的引用。x0是您最初传入时x的复制值。{{1} }是所有拖放组合的汇总转换。

现在，方便的是，调用translate会重置所有这三个变量，这意味着翻译只会针对当前原点进行聚合，并且原点将反映您的转换窗口。