D3缩放+拖动闪烁

Question

我试图在此示例中使用D3中的缩放+拖动功能：http://bl.ocks.org/mbostock/6123708

我想使用svg和d3模仿缩放+拖动图像裁剪。然而，当我拖动它似乎闪烁很多，现在确定该怎么做才能使它更顺畅。另外，如何将其保持在黑色矩形边界内？

链接到jsbin

Answer 1

我面临同样的问题。当我寻找答案时，我看到了你的答案。虽然我还没有得到逻辑答案，但我设法解决了我的问题。所以我希望那里的任何一位大师能为我们解释。

基本上我遵循本教程时没有问题： http://bl.ocks.org/mbostock/3680999

 var svg = d3.select("body").append("svg")
    .attr("width", width)
    .attr("height", height)
  .append("g")
    .call(d3.behavior.zoom().scaleExtent([1, 8]).on("zoom", zoom))
  .append("g");

然后我意识到没有最后一个.append("g")它的最后一个工作，所以我只是在一段时间之后删除了这一行我发现了问题。 （带我一点看看当地的历史）。

但是要回答你的问题，你可能想尝试一个“g”进行缩放，另外一个“g”用于所有图纸。