Utilisation de l'API Google Maps Radial Distance

Auteur: Sara Rhodes
Date De Création: 15 Février 2021
Date De Mise À Jour: 21 Novembre 2024
Anonim
Utilisation de l'API Google Maps Radial Distance - Électronique
Utilisation de l'API Google Maps Radial Distance - Électronique

Contenu

Vous pouvez personnaliser une carte Google pour répondre aux besoins spécifiques de l'audience de votre site Web avec l'API Google Maps 3.0. Une méthode de personnalisation consiste à insérer un cercle qui montre le rayon de distance autour d'un endroit spécifique. Vous pouvez, par exemple, afficher le rayon de cinq kilomètres 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 emplacement ou d'un point, utilisez la classe "Cercle" de Google Maps.

Étape 1

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

Étape 2

Faites défiler le code jusqu'à ce que vous trouviez celui qui définit l'emplacement du marqueur. Pour trouver facilement le favori, recherchez le terme "google.maps.Marker" dans le fichier HTML.

Étape 3

En dessous de l'endroit où vous définissez le marqueur, créez le calque "Cercle" et attachez-le. Par exemple, tapez:

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

Étape 4

Ajoutez le rayon du cercle qui sera autour du marqueur en mètres:


var circleExample = new google.maps.Circle ({map: rayon de la carte: 5000

Étape 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});

Étape 6

Associez ou ajoutez le cercle au marqueur:

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

Étape 7

Enregistrez la carte et testez. Google Maps affichera un cercle blanc avec un rayon de 5 000 mètres autour de l'emplacement du marqueur.