首先,我使用 Google Maps API v3。我有一张大地图,显示从数据库中提取的所有结果,现在我想实现一个功能,显示距当前位置 X 公里内最近结果的半径(由 HTML5 地理定位提供)。
由于地图包含所有结果,我希望能够添加X公里,然后它将提交,结果将根据用户当前位置返回最近的结果。然后整个地图应该删除所有半径外标记,留下 X 公里半径内的标记。
我正在请求有关如何执行此操作的有效代码、教程或文章。
这里的JSFiddle 演示:
我想这是一种方法。您可以使用Google Map V3 API 的圈子从您的中心点或当前位置创建边界。您可以使用以下命令指定圆的半径(以米为单位)setRadius(radius:number)
。使用创建的圆圈,您可以循环遍历标记并使用以下命令查看它们是否在圆圈的边界内Circle 的 getBounds 对象是一个 LatLngBounds并检查标记是否在范围内。
我继续创建了一个小演示,该演示在地图上有五个点,当您单击“创建圆形”按钮时,它将使第一个标记成为中心点,并绘制一个半径为 5000 的圆形,并过滤掉那些标记不使用上述方法进行绑定:
function createRadius(dist) {
var myCircle = new google.maps.Circle({
center: markerArray[markerArray.length - 1].getPosition(),
map: map,
radius: dist,
strokeColor: "#FF0000",
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: "#FF0000",
fillOpacity: 0.35
});
var myBounds = myCircle.getBounds();
//filters markers
for(var i=markerArray.length;i--;){
if(!myBounds.contains(markerArray[i].getPosition()))
markerArray[i].setMap(null);
}
map.setCenter(markerArray[markerArray.length - 1].getPosition());
map.setZoom(map.getZoom()+1);
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)