Javascript svg-获取重叠形状区域的路径坐标

对于重叠svg形状，是否可以获得重叠区域的路径坐标

显示相交的线的点，但我在整个形状的路径之后，即重叠区域（）

最终，我希望重叠最多5个形状，然后使每个重叠区域能够有一个悬停状态，该状态可更改其颜色并添加工具提示。在这里，如果您检查其中一个重叠区域上的元素，您可以看到，首先，使用不透明度绘制完整的椭圆，以创建重叠的视觉表示。

但是，下面的组本身就有实际的重叠区域。

一种想法是在Illustrator中绘制主要形状，然后使用其Pathfinder工具将其相交或划分为单独的重叠区域。然后对于每个新的重叠区域，另存为.svg以获取其路径坐标，然后清理并将其放入D3

但是，当然，我更喜欢在D3中绘制形状，并使用一些计算或库来获得重叠区域，而不必经过Illustrator练习。我希望我只是不知道一些称为GetIntersectedAreaPathCoordinatePlease的工具、属性或函数：）

---

谢谢你的意见。

我发现你的问题出于我自己的目的很有趣，所以我在网上做了一些研究

我发现这解释了如何在SVG中使用剪裁，猜猜看，它可以相交（参见相交和并集）

基本上，您需要创建一个剪辑路径，使两个形状相交，并将其应用于其中一个形状。遗憾的是，文章说：

没有直接的方法与3条或3条以上的剪裁路径相交

但是“直接”这个词让我相信你应该找到解决问题的方法：）

编辑：添加源代码的修改版本，以说明重叠和悬停行为。

rect:悬停{
填充：红色
}

重叠

感谢您共享该站点并粘贴示例。生成的交叉点似乎是一个带计算“掩码”链接的矩形“。我想知道在鼠标悬停颜色改变和工具提示定位时会发生什么。好吧，我会试试，然后再报告。谢谢。哇，谢谢你把这些放在一起，你真是太好了。是的，看起来效果不错。我将在本地试用，并将向您汇报。谢谢