代码之家 › 专栏 › 技术社区 › Naila Akbar

D3.polygoncontains总是返回false

point-in-polygon d3.js javascript

1

Naila Akbar · 技术社区 · 5 年前

在我的 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>

有谁能告诉我我做错了什么吗??

1 回复 | 直到 5 年前

1

2

Gerardo Furtado 5 年前

testPoints 它本身必须是一个包含2个元素的简单数组, x 和 y 按顺序排列的位置,而不是具有内部数组的数组:

let testPoint = [42.33288, -71.05835];

不幸的是 docs 不清楚,只是说:

D3.多角蛋白(多边形,点)

仅当指定点位于指定多边形内时返回true。

但人们总是可以检查 source code :

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>