我正在尝试将onClick事件添加到现有的svg。现在我有这个：
<g id="Group" onClick={this.clickGroup.bind(this, 1)}>
哪些有些有效但不完全...当我点击群组时会触发事件，但可点击的“区域”与我想要点击的群组不同（它对我来说似乎完全随机。）
有没有更好的方法将事件添加到<g>元素（使用React？）？
答案 0 :(得分：18)
g元素只是一个空容器;它本身无法发射事件。
如果您运行this example，您会看到可以通过点击click元素的子项来触发g事件，但是您无法如果你点击它们之间的空白区域。
您必须使用实际形状在SVG中触发事件。
答案 1 :(得分：11)
使用样式指针事件作为边界框，使组可以在组中的任何位置单击。即使在空白处
<g id="Group" onClick={this.clickGroup.bind(this, 1)} style="pointer-events: bounding-box;">