检查Google地图中一个坐标是否包含在圆形范围内？

Question

我正在制作一个应用程序，可以告诉我一个坐标是否包含在一个圆形内。每次我在地图上点击一个点时，我都会获得该坐标。我想知道这个新坐标是否包含在圆内。

我还想知道如何使一个圆占据离一个坐标5米的范围。在我的例子中，半径为：50000，但我不知道如何进行转换以将值设置为米。

这是我的代码：

http://plnkr.co/edit/OI4sjcuS526rFYxPnvDv?p=preview

function initMap() {
    var map = new google.maps.Map(document.getElementById('map'), {
        center: {lat:4.624335 , lng: -74.063644 },
        zoom: 5,
    });

    //circle coordinates
    var circle = new google.maps.Circle({
        map: map,
        radius: 50000,    
        fillColor: '#FFFFFF',
        opacity:0,
        center:{lat:4.624335 , lng: -74.063644 }
    });   

    google.maps.event.addListener(map, 'click', function(e) {
        //I get new coordinates ( e.latLng)
    });
}

谢谢！

更新

他们把这个问题标记为重复，并附上了这个解决方案 (http://jsfiddle.net/kaiser/wzcst/embedded/result/)

但是它并不能真正解决我的问题，因为正如您可以在图片中看到的那样，该解决方案失败了。

- yavg

---

我能看到同样的情况发生了。看起来距离计算（computeDistanceBetween）和实际圆形半径相差几米。你试过用更小的圆吗？我想知道这是否可能是由于地球曲率引起的。圆形是否始终为测地线？那么计算距离的方法呢？话虽如此，你的问题仍然是一个重复的问题，就像标记的一样。 - MrUpsidown

@MrUpsidown，发生的情况是由于某种原因，圆圈似乎被包含在一个矩形中。这就是为什么此时标记似乎在该矩形内部的原因。也许问题可以重复，但答案并不能满足我的需求。你能帮我吗？ - yavg

@geocodezip 这个“解决方案”并不是完全准确的。从我的图片中可以清楚地看到，标记不在圆内，但它却显示为包含在内。这是因为在圆内创建了一种矩形，所以它并不在圆内。如果您能帮助我解决这个问题，我将非常感激。 - yavg

对不起，我的母语是西班牙语，我不确定你在说什么。这是所谓“解决方案”的jsdfiddle http://jsfiddle.net/kaiser/wzcst/，其中显示标记在圆外，并表示其包含在圆内。这是我的代码：http://plnkr.co/edit/OI4sjcuS526rFYxPnvDv?p=preview，我已准备好接收新坐标并计算是否在圆内做些事情。 - yavg

关于你的问题“如何执行转换以设置米值”：无需进行任何转换，该值已经是以米为单位！只需阅读文档。 - MrUpsidown

Answer 1

根据您的问题，我所理解的是：

1. 显示地图
2. 在地图上创建一个圆形
3. 在单击地图时，确定该点是在圆形内还是外

关于此问题，在SO上有一篇文章：Check if a latitude and longitude is within a circle google maps。如果您查看接受的答案（感谢Guffa提供的精妙算法），他使用了这个函数来检查该点是否在半径内：

// credits to user:69083 for this specific function
function arePointsNear(checkPoint, centerPoint, km) { 
   var ky = 40000 / 360;
   var kx = Math.cos(Math.PI * centerPoint.lat / 180.0) * ky;
   var dx = Math.abs(centerPoint.lng - checkPoint.lng) * kx;
   var dy = Math.abs(centerPoint.lat - checkPoint.lat) * ky;
   return Math.sqrt(dx * dx + dy * dy) <= km;
}

现在关于你想要达到的目标，你可以简单地将这个代码段添加到你的点击事件中。这是我所做的：

google.maps.event.addListener(map, 'click', function(event) {
  var click = event.latLng;
  var locs = {lat: event.latLng.lat(), lng: event.latLng.lng()};
  var n = arePointsNear(user, locs, diameter);

然后我添加了条件，如果函数返回true，标记将有一个标签"I"（缩写为inside）。

  if(n){
    marker = new google.maps.Marker({
      map: map,
      position: locs,
      label: {
        text:"I", //marking all jobs inside radius with I
        color:"white"
      }
    });

如果没有通过，那么评分人员会将标记改为"O"（代表未通过）...

  }else{
    marker = new google.maps.Marker({
      map: map,
      position: locs,
      label: {
        text:"O", //marking all jobs outside radius with O
        color:"white"
      }
    });
  }
});

以下是我创建的示例应用程序，如果你想看它的运行情况，可以点击这里查看： http://jsbin.com/hujusod/edit?js,output

这可能是重复的问题：Check if a latitude and longitude is within a circle google maps 或者 How To Display Content Based on Closest Lat/Long to Entered Address。

但由于函数的使用方式不同，我发表了我的答案来帮助您实现最初想要的内容。如果您只需要arePointsNear函数，请随意点赞答案所在的位置。

希望对你有所帮助！

- tomjosef

---

几何库具有计算距离(computeDistanceBetween)的函数。如果您知道圆的半径和中心点，则很容易计算距离并将其与半径进行比较。 - MrUpsidown