Fügen Sie ein benutzerdefiniertes Steuerelement zu einer Google Map hinzu, bei der es sich um ein Dropdown-Menü handelt
Ich habe die Google Maps V3-API-Dokumentation über benutzerdefinierte Kartensteuerelemente gelesen . Dieses Dokument zeigt, wie Sie eine einfache Schaltfläche erstellen. Ich möchte jedoch ein eigenes Dropdown-Menü als benutzerdefiniertes Steuerelement erstellen. Ich möchte dieses Dropdown-Menü verwenden, damit der Benutzer eine Sprache wie Französisch oder Deutsch auswählen kann.
Google bietet ein integriertes Map-Steuerelement namens MapType. Außerdem können Sie dieses Steuerelement als Dropdown-Menü verwenden, indem Sie den integrierten Stil google.maps.MapTypeControlStyle.DROPDOWN_MENU verwenden.
Analog dazu möchte ich ein benutzerdefiniertes Steuerelement mit dem Namen MapLanguage erstellen und ein Drop-down verwenden, als ob wir Zugriff auf etwas wie google.maps.MapLanguageControlStyle.DROPDOWN_MENU hätten. Wenn es eine JQuery-Möglichkeit gibt, dies zu tun, dann umso besser, da ich JQuery bereits an anderer Stelle in meiner App verwende.
Alle Hinweise auf Beispiele wären großartig.
3 Antworten
Ich habe kein Beispiel, aber es scheint, dass google.maps ziemlich flexibel ist und solange Sie Ihr Menü so programmieren, dass es sich in einem einzelnen Div befindet, können Sie es genauso in das Map Control Array schieben, wie sie es tun ihre einfache Schaltfläche.
K
Mit den benutzerdefinierten Steuerelementen können Sie so viel wie möglich auf der Karte platzieren - Dropdown / Auswahl, Logos, Schaltflächen, was auch immer. Ich würde empfehlen, Material Design Lite-Komponenten zu verwenden, da sie das Aussehen von Google haben.
Sie möchten Ihre benutzerdefinierten Logos und Urheberrechte sicherlich über benutzerdefinierte Steuerelemente zu Google Maps hinzufügen. Andernfalls werden sie wahrscheinlich nicht ordnungsgemäß auf mobilen Geräten gerendert.
Ich fand das offizielle Beispiel einer benutzerdefinierten Google Maps JavaScript-API ziemlich kompliziert und ich kann sich nie an die Positionsoptionen erinnern. Also, ich habe eine winzige 1.72 KB Add-on JS auf GitHub Bibliothek namens CONTROL-JS, die Sie einfach erstellen können erstellt B. var html = "<h1>Hi</h1>" , dann übergebe es an ein Objekt namens control , wobei jede Position eine Methode ist (IDE intellisense erinnert dich an die möglichen Positionen).
Mach einfach
%Vor% 
Tags und Links javascript jquery google-maps