如何确定坐标是否在SVG关闭路径内? [英] How to determine if a coordinate is inside SVG Close Path?

问题描述

我已经在SVG上设计了Duval三角形(一种诊断工具)， 合并不同颜色的线段(封闭路径). 诊断结果将是一个坐标. 是否需要检测结果坐标位于哪个封闭路径中?

I have designed a Duval's Triangle ( a diagnostic tool ), on SVG, cosisting of Segments (closed Paths) of different colors. The diagnostic result will be a coordinate. Need to detect the resultant coordinate is in which Closed Path ?

在以下情况下，诊断结果为红色点. 需要检测关闭路径，即在这种情况下:D2

Like in the following case the diagnostic result is a RED DOT. Need to detect the close path i.e in this case : D2

推荐答案

您有几种选择:

• SVG 2具有isPointInFill()方法.您可以在每个形状上调用它，以查看点是否在路径的填充范围内.但是我相信只有Chrome和Opera才实现了SVG2的这一新功能.

• SVG 2 has the isPointInFill() method. Which you can call on each shape to see if a point is within the fill of a path. However I believe only Chrome and Opera have implemented this new feature of SVG2.

https://developer.mozilla.org/zh- US/docs/Web/API/SVGGeometryElement/isPointInFill

您可以将SVG绘制到画布上，并使用isPointInPath()方法.

You can draw your SVG to a Canvas and use the isPointInPath() method.

https://developer.mozilla.org/zh- US/docs/Web/API/CanvasRenderingContext2D/isPointInPath

您可以将SVG绘制到画布上，并使用getImageData()方法获取该特定像素的颜色.

You could draw the SVG to a Canvas and use the getImageData() method to get the colour of that particular pixel.

https://developer.mozilla.org/zh- US/docs/Web/API/CanvasRenderingContext2D/getImageData

当然，您也可以通过某种方式自己计算来数字地进行计算.

And of course you can also do it numerically by calculating it yourself in some way.

这篇关于如何确定坐标是否在SVG关闭路径内?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！