javascript - style - ¿Google Maps con superposición de condados?

google.maps.marker example

Question

No tengo experiencia trabajando con Google Maps, pero me gustaría insertar un mapa de "Elija su condado" en mi aplicación web. Mi aplicación solo se enfoca en California, por lo que solo tiene que ser compatible con un estado, pero no puedo encontrar una manera fácil de hacerlo (sin dibujar polígonos superpuestos manualmente para todas las líneas del condado).

Supuse que podría encontrar ejemplos de las interfaces de estilo "Elige tu condado" en Google de alguna manera, pero lo único que encontré fue esto, http://maps.huge.info/county.htm , y Me estoy inclinando por golpear su API para extraer la geometría de todo el estado si no puedo encontrar una mejor opción.

¿Alguien tiene alguna experiencia o conocimiento para ayudar a hacer esto un poco más fácil?

Answer 1

La API de Google Maps no proporciona polígonos de condado, ni ninguna otra frontera predefinida de estados o países. Por lo tanto, el principal problema aquí es obtener los datos del polígono.

Un polígono en la API de Google Maps se define al construir una matriz de objetos LatLng (asumiendo que estás usando la API v3):

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)
]; 

Luego usarías 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 finalmente, muéstrelo en el mapa llamando al método setMap() :

bermudaTriangle.setMap(map); // Assuming map is your google.maps.Map object

Si mantiene una referencia a su objeto Polygon , también puede ocultarlo pasando null al método setMap() :

bermudaTriangle.setMap(null); 

Por lo tanto, podría considerar construir un objeto JavaScript con un nombre de propiedad para cada condado. Esto le permitirá obtener los objetos de polígono del nombre de los condados en O(1) (tiempo constante), sin tener que recorrer toda la colección. Considere 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 "El Dorado", simplemente puede mostrar el polígono de la siguiente manera:

counties[''El Dorado''].setMap(map);

Si 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 te lleve en la dirección correcta.

Answer 2

Las tablas de Google Fusion ahora se vinculan con los datos del Estado, del Condado y del Distrito del Congreso para todos los EE.

El campo de geometría de la tabla de fusión contiene un elemento Polígono para el objeto dado. Los polígonos de sus límites de estado (y, en menor medida, los condados) se ven con poca resolución en algunos lugares, pero pueden ser lo suficientemente buenos para usted y deberían ser relativamente fáciles de agarrar.