Проверка точки в многоугольнике с помощью SVG и JavaScript?

У меня есть карта, которую я преобразовал из растровой графики в файл SVG, преобразовав области разного цвета в пути.

Я знаю, как выполнить базовую проверку точки в многоугольнике с учетом массива ребер, но svg: Элементы path представляют собой несколько полигонов, а также маски (для учета морей и т. д.), и извлечение этой информации путем анализа атрибута d кажется довольно непосильным.

Есть ли библиотека JS, которая позволяет мне упростить эту проверку? Я в основном хочу создавать случайные точки, а затем проверять, находятся ли они на суше (т.е. внутри полигонов) или в воде (т.е. снаружи).

Поскольку элементы SVG, похоже, позволяют обрабатывать события мыши, я бы подумал, что этого не должно быть. быть большой проблемой (например, если вы можете определить, находится ли указатель мыши над элементом, вы уже решаете проблему с точкой в ​​многоугольнике).

РЕДАКТИРОВАТЬ: немного усложняя вопрос, я должен упомянуть, что элементы svg: path кажутся основанными на кривых, а не на линиях, поэтому простой синтаксический анализ атрибута d для создания массива ребер не представляется возможным.

Поскольку элементы могут принимать атрибут fill , подход рендеринга гетто SVG на холсте, а затем поиск значения цвета пикселя в заданной точке может работать, но это кажется действительно ужасным способом сделать это.

7
задан Alan Plum 13 November 2010 в 20:36
поделиться