我有一张地图，我将光栅图形转换为SVG文件，方法是将不同颜色的区域转换为路径。
我知道如何在给定边数组的情况下进行基本的多边形点检查，但svg:path元素表示多个多边形以及蒙版（以考虑海洋等）并通过解析提取该信息d属性似乎相当严厉。
是否有一个JS库允许我简化检查？我基本上想要创建随机点，然后检查它们是在陆地上（即在多边形内）还是在水中（即在外面）。
由于SVG元素似乎允许鼠标事件处理，我认为这不应该是一个大问题（即，如果你可以判断鼠标指针是否在元素的顶部，你已经解决了这一点-in-polygon问题）。
编辑：稍微复杂一点，我应该提到svg:path元素似乎是基于曲线而不是线，所以只需要解析d属性来创建边缘数组就不会'似乎是一种选择。
由于元素可以采用fill属性，在画布上渲染SVG然后在给定点找到像素的颜色值的贫民窟方法可以工作，但这似乎真的，真的糟糕的方式去做。
答案 0 :(得分：4)
Hit-testing SVG shapes?上的答案可以帮助您完成此任务。缺少浏览器支持存在问题，但您可以使用svgroot.checkIntersection在多边形形状中测试一个小的（可能甚至0宽度/高度可以工作？）矩形。
答案 1 :(得分：1)
我建议作为最后手段的方法似乎是解决此问题的最简单方法。
我发现a nice JS library可以很容易地在画布上渲染SVG。在渲染SVG的情况下，只需要在要检查的点上调用2D上下文的getImageData方法即可获得1x1区域。我想如果你的SVG比我使用的SVG更复杂（你必须逐字节地检查RGBA值），有助于创建一个带有颜色编码的SVG副本，以便更容易检查。 / p>
当你实际检查光栅图像的像素时，这感觉非常黑，但性能似乎足够好，并且颜色检查可以以允许杂质（例如靠近边缘）的方式写入。 / p>
我想如果您想要相对坐标，可以尝试创建一对一尺寸的画布，然后将像素坐标除以画布尺寸。
如果有人提出更好的答案，我会接受它。在此之前，这个作为占位符，以防有人来到这里寻找一个简单的解决方案同样的问题。