javascript - mexico - API de Google Maps: obtener los puntos más cercanos al código postal
código postal de mi ubicación actual (2)
En primer lugar, gracias por tomarse el tiempo para considerar mi pregunta y por su ayuda.
Estoy en proceso de agregar un mapa a un sitio web usando Google Maps API v3 y javascript.
Tengo una lista de direcciones y las he trazado con éxito en el mapa. Cuando el usuario ingresa un código postal, el mapa se vuelve a centrar en su ubicación y muestra los marcadores más cercanos a ese punto. Ahora, necesito crear una vista de lista de las 3 o 5 ubicaciones más cercanas a su código postal con enlaces para la dirección de manejo. Estoy atascado ... y abierto para recibir sugerencias.
¡Gracias!
Cuando tiene el par de latitud de un código postal, puede usar la fórmula harversine para encontrar la distancia desde su ubicación.
La solución habitual es utilizar el método google.maps.geometry.spherical library computeDistanceBetween (de: LatLng, a: LatLng, radius?: Number) para reducir el número a aproximadamente 10, luego use la matriz de distancia para devolver la distancia de conducción a aquellos ubicaciones para que los resultados se puedan ordenar por distancia de manejo (distancia de viaje real) y se reduzcan a las ubicaciones más cercanas de 3 a 5 por distancia de viaje real dentro de los límites de solicitud.
ejemplo (encuentra los 3 lugares más cercanos de una lista) (datos tomados del ejemplo "tienda de pizzerías" de FusionTables)
function codeAddress() {
var address = document.getElementById(''address'').value;
geocoder.geocode( { ''address'': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
if (customerMarker) customerMarker.setMap(null);
customerMarker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
});
closest = findClosestN(results[0].geometry.location,10);
// get driving distance
closest = closest.splice(0,3);
calculateDistances(results[0].geometry.location, closest,3);
} else {
alert(''Geocode was not successful for the following reason: '' + status);
}
});
}
function findClosestN(pt,numberOfResults) {
var closest = [];
document.getElementById(''info'').innerHTML += "processing "+gmarkers.length+"<br>";
for (var i=0; i<gmarkers.length;i++) {
gmarkers[i].distance = google.maps.geometry.spherical.computeDistanceBetween(pt,gmarkers[i].getPosition());
document.getElementById(''info'').innerHTML += "process "+i+":"+gmarkers[i].getPosition().toUrlValue(6)+":"+gmarkers[i].distance.toFixed(2)+"<br>";
gmarkers[i].setMap(null);
closest.push(gmarkers[i]);
}
closest.sort(sortByDist);
return closest;
}
function sortByDist(a,b) {
return (a.distance- b.distance)
}
function calculateDistances(pt,closest,numberOfResults) {
var service = new google.maps.DistanceMatrixService();
var request = {
origins: [pt],
destinations: [],
travelMode: google.maps.TravelMode.DRIVING,
unitSystem: google.maps.UnitSystem.METRIC,
avoidHighways: false,
avoidTolls: false
};
for (var i=0; i<closest.length; i++) request.destinations.push(closest[i].getPosition());
service.getDistanceMatrix(request, function (response, status) {
if (status != google.maps.DistanceMatrixStatus.OK) {
alert(''Error was: '' + status);
} else {
var origins = response.originAddresses;
var destinations = response.destinationAddresses;
var outputDiv = document.getElementById(''side_bar'');
outputDiv.innerHTML = '''';
var results = response.rows[0].elements;
for (var i = 0; i < numberOfResults; i++) {
closest[i].setMap(map);
outputDiv.innerHTML += "<a href=''javascript:google.maps.event.trigger(closest["+i+"],/"click/");''>"+closest[i].title + ''</a><br>'' + closest[i].address+"<br>"
+ results[i].distance.text + '' appoximately ''
+ results[i].duration.text + ''<br><hr>'';
}
}
});
}
ejemplo anterior con el enlace "Obtener indicaciones" en la ventana de información