【问题标题】:Is a point inside a closed path - SVG Javascript是封闭路径内的一个点 - SVG Javascript
【发布时间】:2012-05-09 23:49:39
【问题描述】:

如何使用 javascript 确定一个点是否位于封闭的 SVG 路径内?为什么下面的代码没有按预期工作?

var paper = Raphael(0, 0, 600, 600);

var p = paper.path("M82.725,37.884l0.777,1.555l-20.391,9.569l-17.714,7.453L27.508,68.212v3.111l-6.997,19.442l16.329,20.996 l7.864,21.019l0.477,13.026l5.658,10.284l4.666,3.886l-2.333,2.336l7.002,0.777v6.219l3.886,10.888l8.555,0.778l-8.555,4.363 l-10.11-2.03l1.016,24.043l2.873,11.73l0.777-2.333l4.667,16.329l3.111-0.778L56.047,350.44l-16.052,32.639l-8.381,19.527 l15.253,11.277l7.083,9.399l49.77,20.129l8.726,4.064l16.917,3.736l10.131,6.222l27.195,6.222l7.799,4.079l17.865,0.284 l16.354,5.292l72.321,17.903l60.463,45.627l18.082,16.633l-2.032-24.106l-34.777-76.215l-12.66-41.99l-1.447-22.556l-6.826-30.328 l-2.851-12.442l5.054-10.108l5.206-14.061l-0.214-10.045l1.555-14.779h7.774l7.002-3.111l-4.495-27.996l-2.593-27.93l4.753-28.06 l8.555-3.241l20.217-3.652l7.002-3.995l42.771-4.837l13.999,6.393h-3.111l0.777,4.666l3.889-1.558l1.555,3.891h-3.109l4.6,32.661 l3.176,27.219l3.111,0.775l18.662,2.271l12.443,0.062l15.078,6.224l12.139,38.105h-31.926l-1.512,6.997l-2.334,0.775l2.334,3.891 l6.998-6.222l-0.777,4.666l0.777,4.667l15.555-9.333l2.332,0.78l10.889,3.886l-2.336-6.221l3.414,18.664l-8.057,45.126l-4.213,55.97 l-10.584,59.88l7.582,31.108l1.035,24.106L477,579.916h31.105V36.33l-14.777,6.522L442.004,58.88l-24.107,9.636l-32.663,5.032 l-41.993-11.557v-2.333l-45.104-13.219l-9.268-6.761L250.7,25.982L145,20.084L103.72,31.058L82.725,37.884z");

p.isPointInside(165,100); // returns false, but when I draw a circle at that point, it is clearly inside the path.

【问题讨论】:

  • 看起来像一个错误。为什么你还需要这个?

标签: javascript svg raphael


【解决方案1】:

这不会解决您的问题,甚至没有太大帮助。一些谷歌搜索提出了this 问题,以及一个观察结果 - 该错误似乎受到您使用浮点数还是整数的影响。

我已将您的代码放在此fiddle 中,看起来它们是正确的,但在您的情况下,使用小数可以使其正常工作,而不是中断。也许你可以利用这些信息以某种方式绕过这个问题。

感谢 github 上问题的创建者。

【讨论】:

  • 为了让事情变得更清楚,我在你的路径中添加了一个 mousemove 事件,只要指针在里面,就会根据 isPointInside 调用的结果更改颜色。结果……很有趣。这是小提琴 -> jsfiddle.net/amadanNM/7A8C8
【解决方案2】:

查看其他issue,这可能是您的问题的原因。

已在 2.1.1 版本中解决。您可以从此branch 获取更新的代码。从中更新 Raphael 为我解决了这个问题。

【讨论】:

    猜你喜欢
    • 2019-06-02
    • 2021-09-08
    • 1970-01-01
    • 2015-12-08
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-02-05
    • 1970-01-01
    相关资源
    最近更新 更多