Utilisation de l'API Google Maps pour la distance radiale

Contenu

• Les instructions

Vous pouvez personnaliser une carte Google pour répondre aux besoins spécifiques du public de votre site avec Maps API 3.0. Une méthode de personnalisation consiste à insérer un cercle indiquant le rayon de la distance autour d'un lieu spécifique. Vous pouvez, par exemple, afficher le rayon de cinq miles autour d’un site touristique afin que les visiteurs puissent voir les hôtels et restaurants à proximité. Pour créer un rayon de distance autour d'un lieu ou d'un point, utilisez la classe "Cercle" de Google Maps.

Les instructions

1. Ouvrez le fichier HTML et accédez à la section contenant le code de carte Google.

2. Faites défiler le code jusqu'à trouver l'emplacement du marqueur. Pour trouver facilement le signet, recherchez le terme "google.maps.Marker" dans le fichier HTML.

3. Ci-dessous, où vous définissez le marqueur, créez le calque "Circle" et attachez-le. Par exemple, tapez:

   var circleExample = new google.maps.Circle ({map: map

4. Ajoutez le rayon du cercle qui sera autour du repère en mètres:

   var circleExample = new google.maps.Circle ({map: map radius: 5000

5. Créez une couleur de remplissage pour le cercle. Vous définissez la couleur en utilisant un format hexadécimal. Par exemple, tapez:

   var circleExample = new google.maps.Circle ({map: map radius: 5000 fillColor = #FFFFFF});

6. Associez ou ajoutez le cercle au marqueur:

   
   

   var circleExample = new google.maps.Circle ({map: map radius: 5000 fillColor = #FFFFFF}); circleExample.bindTo ('map', marqueur);

7. Enregistrez la carte et testez. Google Maps affichera un cercle blanc de 5 000 mètres autour du repère.