Ich verwende die Google Maps-API, um eine Karte voller Markierungen zu erstellen, möchte jedoch, dass sich eine Markierung von den anderen abhebt. Ich denke, das Einfachste wäre, die Farbe des Markers in Blau anstatt in Rot zu ändern. Ist das eine einfache Sache oder muss ich irgendwie ein ganz neues Symbol erstellen? Was ist der einfachste Weg, wenn ich ein neues Symbol erstellen muss?
google-maps
google-maps-api-2
abeger
quelle
quelle
Antworten:
Da Maps v2 veraltet ist, sind Sie wahrscheinlich an V3-Maps interessiert: https://developers.google.com/maps/documentation/javascript/markers#simple_icons
Für v2-Karten:
http://code.google.com/apis/maps/documentation/overlays.html#Icons_overview
Sie würden einen Satz Logik veranlassen, alle 'regulären' Pins auszuführen, und einen anderen, der die 'speziellen' Pins unter Verwendung des neu definierten Markers ausführt.
quelle
Mit Version 3 der Google Maps-API können Sie dies am einfachsten tun, indem Sie ein benutzerdefiniertes Symbolset verwenden, wie es Benjamin Keen hier erstellt hat:
http://www.benjaminkeen.com/?p=105
Wenn Sie alle diese Symbole an derselben Stelle wie Ihre Kartenseite platzieren, können Sie einen Marker einfärben, indem Sie beim Erstellen einfach die entsprechende Symboloption verwenden:
Dies ist sehr einfach und der Ansatz, den ich für das Projekt verwende, an dem ich gerade arbeite.
quelle
MapIconMaker: Eine Bibliothek für Google Maps v2
Eine Möglichkeit ist die Verwendung des
MapIconMaker(Deadlink). Es ist ein Beispielhier(Dead). Die Standardsymbole von Google Maps sind 20 Pixel breit und 34 Pixel hoch. Sie können also Folgendes verwenden, um Folgendes zu emulieren:Sie könnten es sogar in eine Funktion einwickeln, um es sich noch einfacher zu machen:
Das verwende ich persönlich für alle Marker, die ich erstelle. Ich bevorzuge die Option, die Farben einer Laune zu ändern.
Update: Die Hex-Farbe des Standardsymbols lautet "# FE7569". Sie können das Bild auch auf einen Marker setzen, anstatt einen neuen Marker mit einem neuen Symbol zu erstellen. Wenn Sie also eine Funktion hervorheben möchten, können Sie mit der obigen Funktion Folgendes tun:
StyledMarker: Eine Bibliothek für Google Maps v3
Da V2 vor einiger Zeit durch V3 ersetzt wurde, dachte ich, ich sollte diese Antwort aktualisieren. Ich habe eine Bibliothek für benutzerdefinierte Markierungen erstellt, die hier in der V3-Dienstprogrammbibliothek zu
finden ist(Deadlink). Es ermöglicht verschiedene Farben und Formen, und Sie können auch Text auf dem Marker platzieren. Es funktioniert mithilfe der Google Charts-API, die Methoden zum Erstellen von Google Maps-Typmarkierungen enthält. Schauen Sie sich den Quellcode an, wenn Sie die Google Charts-API lieber direkt verwenden möchten.Das Besondere an dieser Bibliothek ist jedoch, dass sie sich darum kümmert, die anklickbaren Bereiche dieser Markierungsbilder für Sie zu definieren. So hat beispielsweise die längere Blase mit Text die erwarteten anklickbaren Bereiche, wie in
diesem Beispiel(Deadlink).quelle
Material Design
EDITED MÄRZ 2019 jetzt mit programmatischer Stiftfarbe,
PURE JAVASCRIPT, KEINE BILDER, UNTERSTÜTZT ETIKETTEN
stützt sich nicht mehr auf die veraltete Charts-API
quelle
MapIconMaker
bereits veraltet ist.http
sei denn, es enthüllt etwas, das mir im Header nicht bekannt istPersönlich finde ich, dass die von der Google Charts-API generierten Symbole großartig aussehen und einfach dynamisch angepasst werden können.
Siehe meine Antwort auf Google Maps API 3 - Benutzerdefinierte Markierungsfarbe für Standardmarker (Punktmarker)
quelle
Der einfachste Weg, den ich gefunden habe, ist die Verwendung von BitmapDescriptorFactory.defaultMarker (). Die Dokumentation enthält sogar ein Beispiel für das Festlegen der Farbe. Aus meinem eigenen Code:
quelle
Um Marker anzupassen, können Sie dies über dieses Online-Tool tun: https://materialdesignicons.com/
In Ihrem Fall möchten Sie den Kartenmarker, der hier verfügbar ist: https://materialdesignicons.com/icon/map-marker und den Sie online anpassen können.
Wenn Sie einfach die Standardfarbe Rot in Blau ändern möchten, können Sie dieses Symbol laden: http://maps.google.com/mapfiles/ms/icons/blue-dot.png
Es wurde in diesem Thread erwähnt: https://stackoverflow.com/a/32651327/6381715
quelle
Dieser relativ neue Artikel bietet ein einfaches Beispiel mit einem begrenzten Satz farbiger Symbole in Google Maps.
quelle