更新D3中的数据更新后更新拖动/滚动原点

Question

我使用拖动，缩放和更新工作在图表上。然而，在添加新数据后，这种方式通常起作用，拖动位置不会更新。

重现步骤：

• 看到演示
• 等待几秒钟，让一些数据添加到图表
• 然后尝试图表拖动到左侧或右侧
• 图将推回到开始，从这一点拖动作品的方式，它应该

所以我想，当添加n新闻数据，我不知何故必须更新拖动的起源。但是如何？到目前为止，我无法找到任何这样的例子。我也看了一下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 
     ... 
    } 
    ... 
} 

这里的原因：

要初始化使用d3.behavior.zoom()对象上调用.x(x)水平拖放。这看起来很好，除了这个拖动&拖放处理程序不是为不同的来源而设计的。

基本上，当您拨打d3.behavior.zoom().x(x)时，您现在声明值为x是原点。现在，d3.js存储这个值，所以即使你在一个动画循环中将窗口向右移动，拖动&仍然会遵循原始原点。

在d3.behavior.zoom源中有三个感兴趣的变量，x0,x1和translate。 x1是您通过的x变量的当前值的参考。x0是您最初传入时的复制值x。translate是所有拖放组合的汇总转换。

现在，方便地呼叫zoom.x(x)将重置所有这三个变量，这意味着翻译只会与当前原点汇总，并且原点会反映您的移位窗口。