좌표가 폴리곤 내부에 있는지 확인하는 방법

최근 지도기반으로 작업하는 프로젝트가 있었다.
그 중에 지도에 폴리곤을 뿌려주고 클릭시, 마커 표시시 폴리곤 내부에 있는지 판단해야 하는 문제가 있었는데 그 과정에서 어떻게 했는지 간단하게 남겨보고 싶다.

특정 좌표 point와 polygon 이라는 변수로 각각 두었을 때 폴리곤 내부에 있는지 판단하는 코드는 아래와 같다.

function pointInPolygon(point, polygon) {
  var x = point[0], y = point[1];
  var inside = false;
  for (var i = 0, j = polygon.length - 1; i < polygon.length; j = i++) {
    var xi = polygon[i][0], yi = polygon[i][1];
    var xj = polygon[j][0], yj = polygon[j][1];
    var intersect = ((yi > y) != (yj > y)) && (x < (xj - xi) * (y - yi) / (yj - yi) + xi);
    if (intersect) inside = !inside;
  }
  return inside;
}

그리고 이제 사용을 하려면 아래와 같이 하면 된다

var polygon = [[123.23, 35.87], [125.21, 36.87], ...];
var point = [123.12, 35.21];

if (pointInPolygon(point, polygon)) {
  console.log("Point is inside the polygon.");
} else {
  console.log("Point is outside the polygon.");
}

위 코드에서는 레이캐스팅 알고리즘을 사용해서 폴리곤 내부에 점이 있는지 확인하는 내용이다.

관련