So verwenden Sie eine Nummer anstelle eines Buchstaben in der benutzerdefinierten Markierung von Google

Google Maps-Markierungen markieren bestimmte Websites auf einer Karte. Standardmäßig identifiziert Google eine einzelne Markierung mit einem Quadrat und mehrere Markierungen mit Buchstaben. Dies kann jedoch für manche Anwendungen nicht zutreffen. Wenn Ihr Unternehmen beispielsweise Zweigniederlassungen als Standorte 1, 2 und 3 bezeichnet, würden nummerierte Markierungen sie deutlicher identifizieren als Buchstaben. Verwenden Sie benutzerdefinierte Markierungen in Ihrem Programm, um eigene Etiketten für Kartenpositionen zu erstellen. Diese Markierungen verwenden benutzerdefinierte Symbole, die Sie mit der Google Charts-API kodieren können.

1

Öffnen Sie den Quellcode Ihres Programms mit einem Java-Entwicklungsprogramm wie Eclipse.

2

Blättern Sie zur Funktion "Initialisieren". Dieser Codeblock definiert Ihre Karte und definiert Optionen dafür. Beispielsweise kann der Code lesen:

Funktion initialisieren () {

Var-Koordinaten = new google.maps.LatLng (42.346429, -71.097186);

var myOptions = {

Zoom: 4,

Mitte: Koordinaten,

mapTypeId: google.maps.MapTypeId.ROADMAP

}

var ourHeadquarters = new google.maps.Map (document.getElementById ("map_canvas"), meineOptions);

}

3.

Fügen Sie eine neue Zeile hinzu, die den Längen- und Breitengrad Ihres Markers definiert. Wenn Ihre Marke beispielsweise einen Breitengrad von 42, 349093 und einen Längengrad von -71, 101971 bestimmen muss, fügen Sie die folgende Zeile hinzu:

var markerCoordinates = new google.maps.LatLng (42.349093, -71.101971);

4

Fügen Sie den folgenden Block hinzu, um Ihre Markierung zu erstellen:

var marker = new google.maps.Marker ({

Position: markerCoordinates,

karte: unser hauptquartier,

});

Ersetzen Sie "markerCoordinates" durch die im vorherigen Schritt erstellte Variable und ersetzen Sie "ourHeadquarters" durch die Ihrer Map zugeordnete Variable.

5

Fügen Sie im Markerblock die folgende Zeile hinzu, um ein Symbol für den Marker zu erstellen:

Symbol: "// chart.apis.google.com/chartchst=d_map_pin_letter&chld=A|FF0000|000000"

6

Ersetzen Sie "A" in der Zeile durch eine Nummer. Ersetzen Sie es beispielsweise durch "1" und ändern Sie die Zeile in:

Symbol: "// chart.apis.google.com/chartchst=d_map_pin_letter&chld=1|FF0000|999999"

7.

Ändern Sie "FF0000" in den hexadezimalen HTML-Code des Hintergrunds der Marke. B. die Hintergrundfarbe auf gelb setzen, wobei der Code "FFFF00" verwendet wird, ersetzen Sie den Code durch "FFFF00". Ändern Sie die Zeile in:

Symbol: "// chart.apis.google.com/chartchst=d_map_pin_letter&chld=1|FFFF00|999999"

8

Ändern Sie "999999" in den hexadezimalen HTML-Code des Textes der Markierungsnummer. Um beispielsweise diesen Text in Schwarz zu schreiben, der den Code "000000" verwendet, ersetzen Sie den Code durch "000000". Ändern Sie die Zeile in:

Symbol: "// chart.apis.google.com/chartchst=d_map_pin_letter&chld=1|FFFF00|000000"