我使用google map api 3
根据用户输入的地址在google maps
上找到商店。使用latlong
完成geocoding
转换的地址,我的代码工作正常。现在,我的客户希望我在搜索区域内绘制商店以及靠近该区域(近2英里)的商店并计算他们的距离。我想要的一个例子是this site和this one。我的工作Javascript
如下
var markers = response.d.split('^^');
var latlng = new google.maps.LatLng(51.474634, -0.195791);
var mapOptions1 = {
zoom: 14,
center: latlng
}
var geocoder = new google.maps.Geocoder();
var infoWindow = new google.maps.InfoWindow();
var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions1);
for (i = 0; i < markers.length; i++) {
var data = markers[i];
geocoder.geocode({ 'address': data }, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location,
title: results[0].formatted_address
});
} else {
alert("Geocode was not successful for the following reason: " + status);
}
});
}
(function (marker, data) {
// Attaching a click event to the current marker
google.maps.event.addListener(marker, "click", function (e) {
infoWindow.setContent(data);
infoWindow.open(map, marker);
});
})(marker, data);
上面的代码看起来很奇怪,我在正文onload
上做了初始化,我的markers
数组包含了所有地址,geocode
将这些地址转换为latlong
和marker
绘制它们。
我想api给我更近的地址和从搜索位置到每家商店的距离。我怎么能得到它?
更新
距离计算可以使用MrUpsidown的答案来完成,但我无法到达附近的地方。我去了here,发现https://maps.googleapis.com/maps/api/place/search/json?location=-33.8670522,151.1957362&radius=7500&types=library&sensor=false&key=AIzaSyDRn2crkKMALHkQAOyadm-d2u_bIPeBA1o
提供了数据,但我不知道如何有效地阅读,因为建议我尝试使用下面的代码在jason中得到这个
$.getJSON("https://maps.googleapis.com/maps/api/place/search/json?location=-33.8670522,151.1957362&radius=7500&types=library&sensor=false&key=AIzaSyDRn2crkKMALHkQAOyadm-d2u_bIPeBA1o", function (data) {
alert(data);
});
但没有运气:(我错过了什么?
答案 0 :(得分:1)
你必须自己计算距离。您可以使用geometry library和computeDistanceBetween
方法。
例如:
var latlng = new google.maps.LatLng(51.474634, -0.195791);
然后在地理编码器中:
var distance = google.maps.geometry.spherical.computeDistanceBetween(latlng, results[0].geometry.location);
您需要将这些标记及其距离存储在一个数组中,如果您希望它们按特定顺序显示,请对它们进行排序。