Inhalt
Mit der Google Maps 3.0-API können Sie eine Google-Karte an die spezifischen Bedürfnisse der Zielgruppe Ihrer Website anpassen. Eine Methode zur Personalisierung besteht darin, einen Kreis einzufügen, der den Abstandsradius um einen bestimmten Ort anzeigt. Sie können beispielsweise den Radius von fünf Kilometern um einen Touristenort anzeigen, damit Besucher nahe gelegene Hotels und Restaurants sehen können. Verwenden Sie die Google Maps-Klasse "Kreis", um einen Entfernungsradius um einen Ort oder Punkt zu erstellen.
Schritt 1
Öffnen Sie die HTML-Datei und gehen Sie zu dem Abschnitt, der den Google-Kartencode enthält.
Schritt 2
Scrollen Sie im Code nach unten, bis Sie den Code finden, der die Position des Markers definiert. Um das Lesezeichen leicht zu finden, suchen Sie in der HTML-Datei nach dem Begriff "google.maps.Marker".
Schritt 3
Unterhalb der Stelle, an der Sie den Marker definieren, erstellen Sie die Ebene "Kreis" und hängen Sie sie an. Geben Sie beispielsweise Folgendes ein:
var circleExample = new google.maps.Circle ({map: map
Schritt 4
Fügen Sie den Radius des Kreises, der sich um die Markierung befindet, in Metern hinzu:
var circleExample = new google.maps.Circle ({Karte: Kartenradius: 5000
Schritt 5
Erstellen Sie eine Füllfarbe für den Kreis. Sie definieren die Farbe im Hexadezimalformat. Geben Sie beispielsweise Folgendes ein:
var circleExample = new google.maps.Circle ({Karte: Kartenradius: 5000 fillColor = #FFFFFF});
Schritt 6
Ordnen Sie den Kreis der Markierung zu oder fügen Sie ihn hinzu:
var circleExample = new google.maps.Circle ({Karte: Kartenradius: 5000 fillColor = #FFFFFF}); circleExample.bindTo ("Karte", Markierung);
Schritt 7
Speichern Sie die Karte und testen Sie. Google Maps zeigt einen weißen Kreis mit einem Radius von 5.000 Metern um die Markierungsposition.