javascript - 将 SVG 多边形路径转换为纬度和经度坐标

Question

tl;dr: 如何将 SVG 多边形路径转换为 ​​GPS 坐标或相同的 google.maps.Polygon？

我的高级目标是确定 20,000 个单独的 GPS 坐标是否位于固定区域(地理围栏)内。我已经保存了 GPS 坐标，并且我对如何测试它们是否在该区域有了基本的了解。

我现在正在尝试将路径转换为 ​​GPS 纬度/经度，我确信这只是一个公式，我需要协调 0,0 和比例 - 这个答案很有希望: https://stackoverflow.com/a/24171749/550595 ，我用它来进行“转换”，但结果并不接近。

我有一个 SVG 多边形路径，是从另一个 map (不是谷歌地图，但它足够接近)借来的，我在 map 上渲染了它:https://jsfiddle.net/2n2jmj8L/1/

var width = 624, // width of SVG
  height = 746; // height of SVG

function toLongitude(x) {
  return x * 180 / width;
}

function toLatitude(y) {
  return -y * 180 / width + 90;
}

function initMap() {
  // The SVG path;
  var path = document.getElementById("reservation-path").getAttribute("d");

  // Get the points. Even indices are x coordinates and odd indices are y
  // coordinates. Note that these are strings.
  var points = path.match(/(\d+)/g);

  map = new google.maps.Map(document.getElementById('map'), {
    streetViewControl: false,
    //scrollwheel: false,
    disableDefaultUI: true,
    draggable: false,
    zoom: 11,
    center: {
      lat: 41.3671863,
      lng: -123.8799729
    },
    mapTypeId: 'roadmap'
  });

  // Map polygon coordinates
  var polyCoordinates = [];
  for (var i = 0; i < points.length; i += 2) {
    var longitude = toLongitude(parseInt(points[i]) + 6),//I added the 6 and the following 5 to offset the parent transform
      latitude = toLatitude(parseInt(points[i + 1]) + 5);

    polyCoordinates.push(new google.maps.LatLng(latitude, longitude));
  }

  console.log(polyCoordinates);

  var polygon = new google.maps.Polygon({
    paths: polyCoordinates,
    strokeColor: '#FF0000',
    strokeOpacity: 0.8,
    strokeWeight: 2,
    fillColor: '#FF0000',
    fillOpacity: 0.35
  });

  polygon.setMap(map);

  // Add a listener for the click event.
  polygon.addListener('click', showArrays);

  infoWindow = new google.maps.InfoWindow;
}

附注...Google map /地点概述了我想要用作地理围栏的区域:https://www.google.com/maps/place/Yurok+Reservation,+Trinity-Klamath,+CA/@41.373847,-123.9471508,11z/data=!4m5!3m4!1s0x54d1a8156f591fd5:0xbcbca4e17d7d8801!8m2!3d41.3724029!4d-123.9009415但除了将其用作引用之外，我无法做任何事情。

我已经在这上面浪费了太多时间，所以即使我需要废弃我拥有的东西，我也会的。我想要做的就是能够循环一组坐标，如果它们位于我的 JSFiddle 的路径中，则返回。

提前致谢...

Answer 1

此页面似乎记录了如何将屏幕像素坐标转换为纬度/经度坐标。

https://developers.google.com/maps/documentation/javascript/examples/map-coordinates