单击时检测SVG文件中的路径是什么

Question

我正在处理 SVG 文件。我通过对象标签 html 嵌入了 SVG 文件。

像这样：

<object id="map" type="image/svg+xml" data="the-file-has-same-domain"></object>

当我通过 Javascript 或任何对此的库支持单击时，如何检测哪个区域。

谢谢！！！

Answer 1

由于您的文件在同一个域中（如果我们信任您的假名），那么您可以简单地访问其文档，并从您的主页附加侦听器：

// wait for your <object> is loaded
document.getElementById('map').onload = e => {
  const doc = map.getSVGDocument(); // that's the inner document
  doc.addEventListener('click', your_handler);
};

不幸的是，StackSnippet 的空值 iframe 不允许访问任何内部文档，所以这里有一个 jsfiddle。