Javascript D3.js zoom无法在safari中使用鼠标滚轮

我使用D3V4来实现缩放功能，所有功能在FireFox和Chrome浏览器上都能完美运行

使用

Safari

浏览器（我的版本是

version10.0.1（12602.2.14.0.7）

）的行为完全不同。滚轮缩放适用于

g

元素，不适用于

svg

元素。注意：

dbClick

zoom适用于

svg

元素

我创建了simple，试图重现这个问题。 如果您尝试在

red rect

上进行滚轮缩放，则在

rect

之外，该功能将正常工作。该功能不起作用，但适用于其他浏览器

我一直在寻找官方的例子，比如什么都能用，但我找不到我的例子有什么问题

这里是一个缩放有效的区域（疯狂的是svg中的左侧和顶部区域具有有效的缩放）：

我从以下方面得到了答案：

问题：

如中所示，这是一个

Safari bug

（或者，如果您愿意，可以对规范进行另一种解释）。当指针下没有SVG内容时，Safari不会向SVG发送控制盘事件；事件被发送到SVG元素下面的任何位置（本例中为主体）。相反，其他浏览器将控制盘事件发送到SVG元素的边界矩形内的任何位置

解决方案：

如果希望SVG在所有浏览器上接收事件，则必须在SVG中放入一些内容以捕获控制盘事件。下面是一个固定的测试用例：

原始讨论：