La API de Google Maps no proporciona polígonos condado, o cualquier otro fronteras predefinidos de estados o países. Por lo tanto, el problema principal aquí es obtener los datos del polígono.
Un polígono en la API de Google Maps se define mediante la construcción de una serie de objetos LatLng
(asumiendo que usted está utilizando la versión 3 del API):
var bermudaTriangleCoords = [
new google.maps.LatLng(25.774252, -80.190262),
new google.maps.LatLng(18.466465, -66.118292),
new google.maps.LatLng(32.321384, -64.757370),
new google.maps.LatLng(25.774252, -80.190262)
];
A continuación, puede utilizar esta matriz para construir un objeto Polygon
:
var bermudaTriangle = new google.maps.Polygon({
paths: bermudaTriangleCoords,
strokeColor: '#FF0000',
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: '#FF0000',
fillOpacity: 0.35
});
Y por último lo muestran en el mapa llamando al método setMap()
:
bermudaTriangle.setMap(map); // Assuming map is your google.maps.Map object
Si se mantiene una referencia al objeto Polygon
, también puede ocultar que al pasar null
al método setMap()
:
bermudaTriangle.setMap(null);
Por lo tanto usted podría considerar la construcción de un objeto JavaScript con un nombre de propiedad para cada condado. Esto le permitirá buscar los objetos del polígono desde el nombre de los condados en O(1) (tiempo constante), sin tener que recorrer toda la colección. Consideremos el siguiente ejemplo:
// Let's start with an empty object:
var counties = {
};
// Now let's add a county polygon:
counties['Alameda'] = new google.maps.Polygon({
paths: [
// This is not real data:
new google.maps.LatLng(25.774252, -80.190262),
new google.maps.LatLng(18.466465, -66.118292),
new google.maps.LatLng(32.321384, -64.757370),
new google.maps.LatLng(25.774252, -80.190262)
// ...
],
strokeColor: '#FF0000',
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: '#FF0000",
fillOpacity: 0.3'
});
// Next county:
counties['Alpine'] = new google.maps.Polygon({
// Same stuff
});
// And so on...
El objeto counties
será nuestro almacén de datos. Cuando un usuario busca de "El Dorado" que simplemente puede mostrar el polígono de la siguiente manera:
counties['El Dorado'].setMap(map);
Si se mantiene una referencia al condado previamente buscado, también puede llamar a setMap(null)
para ocultar el polígono anterior:
var userInput = 'El Dorado';
var latestSearch = null;
// Check if the county exists in our data store:
if (counties.hasOwnProperty(userInput)) {
// It does - So hide the previous polygon if there was one:
if (latestSearch) {
latestSearch.setMap(null);
}
// Show the polygon for the searched county:
latestSearch = counties[userInput].setMap(map);
}
else {
alert('Error: The ' + userInput + ' county was not found');
}
espero que esto consigue que va en la dirección correcta.