Question

我尝试使用d3.js树形图进行各种菜单。它主要起作用，但我有一些小问题，我无法确定。

基本上，有时我的图表没有正确缩放，而不是看到孩子们占据整个SVG区域，他们出现了＆＃34; unzoomed＆＃34;。

我怀疑它必须与动画的时序和一些数据操作有关，以隐藏/显示不同的节点，但实际上无法弄明白。我认为可能会使行为变得棘手的其他事情与由父母＆＃34;父母＆＃34;和＃34;孩子＆＃34;节点

我在JSBIN中设置了类似的示例。

所以，我想知道如何在缩放时注册/取消注册父/子节点中的点击事件 - 如果这甚至是问题 - 以及是否存在更简单或更少错误的更改方式节点＆＃39;可视性。

欢迎任何帮助！

Answer 1

嗯，这可能有点不正统，但我找到了解决这个问题的方法。

基本上，我不是试图搞乱事件注册/取消注册，而只是在点击不是来自当前缩放级别的节点时才运行缩放。

所以，在我的zoom函数中，我将缩放处理包装在if支票中：

function zoom(d) {

  if(node!=d){

    // the rest remains the same

  }
}

无论哪种方式，我仍然认为这是因为点击事件来自SVG区域中重叠的源元素 - 简单地说，点击事件是由几个重叠元素触发的，是第一个（最无意义地触发了SVG树顺序。

Here是一个有效的版本。

希望这有助于其他人！

编辑：但这个解决方案并不完美。现在，有时候点击不会做任何事情 - 但它比直接用户界面更好。如果有人有其他想法，欢迎他们。