d3.polygonContains всегда возвращает false

Question

В моем react application я нарисовал polygon, используя некоторые точки, и затем я пытаюсь выяснить, находится ли текущее местоположение мыши внутри многоугольника или нет.Я использую d3.polygonContains и передаю ему массив точек с текущими точками местоположения, но всегда возвращает false , хотя точки находятся внутри многоугольника.

вот пример;

let points = [
            [ 42.34624, -71.06024 ],
            [ 42.33558, -71.06616 ],
            [ 42.32632, -71.05835 ],
            [ 42.32987, -71.05428 ],
            [ 42.34732, -71.05432 ],
            [ 42.34618, -71.05973 ],
            [ 42.34624, -71.06024 ]
        ];
        
let testPoint = [
    [42.33288, -71.05835]

];
alert(d3.polygonContains(points, testPoint));

alert(d3.polygonContains(points, (42.33288, -71.05835)));

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/5.7.0/d3.min.js"></script>

Может кто-нибудь сказать мне, что я здесь делаю неправильно?

Answer 1

testPoints сам по себе должен быть простым массивом с 2 элементами, с позициями x и y в этом порядке, а не массивом с внутренним массивом:

let testPoint = [42.33288, -71.05835];

К сожалению, docs не совсем понятно об этом, просто сказано:

d3.polygonContains (polygon, point)

Возвращает true тогда и только тогда, когда указанная точка находится внутриуказанный многоугольник.

Но всегда можно проверить исходный код :

export default function(polygon, point) {
  var n = polygon.length,
      p = polygon[n - 1],
      x = point[0], y = point[1],
      //^-- here we see that 'point' is an array with 2 elements

Вот код с этим изменением:

let points = [
  [42.34624, -71.06024],
  [42.33558, -71.06616],
  [42.32632, -71.05835],
  [42.32987, -71.05428],
  [42.34732, -71.05432],
  [42.34618, -71.05973],
  [42.34624, -71.06024]
];

let testPoint = [42.33288, -71.05835];

console.log(d3.polygonContains(points, testPoint));
console.log(d3.polygonContains(points, [42.33288, -71.05835]));

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/5.7.0/d3.min.js"></script>