javascript - D3 中的嵌套缩放问题

Question

请看我的小提琴：http: //jsfiddle.net/haiphong/BRjFE/

您可以按住 SHIFT，然后拖放矩形来移动它和它里面的圆圈。您也可以按住 SHIFT 和缩放。此缩放/平移由 完成d3.behavior.zoom()。效果很好。

我想在不按住 shift 时缩放和平移圆圈。所以，我创建了另一个d3.behavior.zoom(). 但是，圆圈​​可以缩放但不能平移。通过调试，我看到当我平移圆圈时，处理代码没有执行。

总之，当将 a 绑定zoom到外部g元素和内部g元素时，外部元素适用于缩放/平移；但是，内部仅适用于缩放。如何让它也适用于平底锅？

Answer 1

我找到了答案的解决方案。http://jsfiddle.net/haiphong/BRjFE/4/

当我平移圆圈时，它的zoom事件不会触发。但是，它的zoomstart事件会触发，并且会在其父事件之前触发zoomstart。不知何故，当父母zoomstart开火时，它吃掉了圈子的事件。

因此，在zoomstart圈子中，当 SHIFT 未被保持时，我强制事件停止传播。这使得圈子zoom火了。