Contenido
Puede personalizar un mapa de Google para satisfacer las necesidades específicas de la audiencia de su sitio web con la API de Google Maps 3.0. Un método de personalización es insertar un círculo que muestre el radio de distancia alrededor de un lugar específico. Puede, por ejemplo, mostrar el radio de cinco kilómetros alrededor de un lugar turístico para que los visitantes puedan ver hoteles y restaurantes cercanos. Para crear un radio de distancia alrededor de una ubicación o punto, use la clase "Círculo" de Google Maps.
Paso 1
Abra el archivo HTML y vaya a la sección que contiene el código del mapa de Google.
Paso 2
Desplácese hacia abajo en el código hasta encontrar el que define la ubicación del marcador. Para encontrar el marcador fácilmente, busque el término "google.maps.Marker" en el archivo HTML.
Paso 3
Debajo de donde define el marcador, cree la capa "Círculo" y adjúntela. Por ejemplo, escriba:
var circleExample = new google.maps.Circle ({map: map
Paso 4
Agregue el radio del círculo que estará alrededor del marcador en metros:
var circleExample = new google.maps.Circle ({map: map radius: 5000
Paso 5
Crea un color de relleno para el círculo. El color se define en formato hexadecimal. Por ejemplo, escriba:
var circleExample = new google.maps.Circle ({map: map radius: 5000 fillColor = #FFFFFF});
Paso 6
Asociar o agregar el círculo al marcador:
var circleExample = new google.maps.Circle ({map: map radius: 5000 fillColor = #FFFFFF}); circleExample.bindTo ("mapa", marcador);
Paso 7
Guarde el mapa y pruebe. Google Maps mostrará un círculo blanco con un radio de 5,000 metros alrededor de la ubicación del marcador.