AI Zusammenfassung
Möchten Sie Points of Interest (POIs) wie Restaurants, Geschäfte und andere Unternehmen auf Ihrem Kartenfeld ausblenden, sodass nur Ihre benutzerdefinierten Markierungen sichtbar sind? Google Maps zeigt diese POIs standardmäßig an, aber Sie können das Erscheinungsbild der Karte mithilfe der cloudbasierten Kartenformatierungsfunktion der Google Cloud Console anpassen.
Dieses Tutorial zeigt Ihnen, wie Sie in der Google Cloud Console einen benutzerdefinierten Kartenstil erstellen, ihn so konfigurieren, dass POIs ausgeblendet werden, und ihn mithilfe eines Code-Schnipsels auf Ihr WPForms-Kartenfeld anwenden.
Erstellen eines benutzerdefinierten Kartenstils in der Google Cloud Console
Öffnen Sie zunächst die Google Cloud Console und wählen Sie das Projekt aus, in dem Ihr Google Places API-Schlüssel konfiguriert ist. Klicken Sie anschließend in der linken Seitenleiste auf „Map Styles“ (Kartenstile) oder gehen Sie direkt zu „Map Styles“ (Kartenstile).
Klicken Sie dort auf die Schaltfläche „Kartenstil erstellen“, um einen neuen Kartenstil zu erstellen.
Wählen Sie anschließend im angezeigten Modalfenster einen Modus für Ihre Karte aus, indem Sie entweder „Hell“ oder „Dunkel“ auswählen. Bei Bedarf können Sie auch ein optionales Design wie „Monochrom“ auswählen, um zusätzliche Formatierungen anzuwenden. Nachdem Sie Ihre Auswahl getroffen haben, klicken Sie auf die Schaltfläche „Anpassen“, um den Stil-Editor zu öffnen.
Sobald der Stil-Editor geöffnet ist, suchen Sie die Kategorie „Sehenswürdigkeiten“ und klicken Sie darauf. Daraufhin wird eine Liste mit einzelnen Arten von Sehenswürdigkeiten (POI) angezeigt, z. B. Notfälle, Unterhaltung, Essen und Trinken, Unterkünfte, Freizeit, Einzelhandel und andere.
Um POIs auszublenden, klicken Sie für jede Kategorie, die Sie ausblenden möchten, auf das Augensymbol auf der rechten Seite des Bildschirms. Sie können alle POIs auf einmal ausblenden, indem Sie auf das Augensymbol neben der Hauptkategorie „Sonderziele“ klicken, oder Sie können bestimmte POI-Typen selektiv ausblenden, indem Sie auf das Augensymbol neben jeder einzelnen Kategorie klicken.
Nachdem Sie Ihren Kartenstil konfiguriert haben, klicken Sie auf „Speichern“.
Ihre Karten-ID erhalten
Sobald Ihr Stil veröffentlicht ist, müssen Sie eine Karten-ID erstellen und diese mit Ihrem Stil verknüpfen, um ihn in WPForms verwenden zu können.
Navigieren Sie dazu in der linken Seitenleiste zum Abschnitt „Kartenverwaltung “ und klicken Sie in Ihrer Google Cloud Console auf „Karten-ID erstellen “.
Geben Sie im angezeigten Dialogfeld einen aussagekräftigen Namen für Ihre Karten-ID ein, wählen Sie JavaScript als Kartentyp und wählen Sie Vektor aus den verfügbaren Optionen.
Sobald Sie fertig sind, klicken Sie auf „Speichern“, um die neue Karten-ID zu erstellen.
Sobald Ihre Karten-ID erstellt ist, scrollen Sie auf der Seite „Karten-ID“ nach unten zum Abschnitt „Kartenstile “. Klicken Sie auf das Stiftsymbol neben dem Standardkarten stil von Google.
Dadurch wird eine Seitenleiste geöffnet, in der Sie Ihren benutzerdefinierten Kartenstil auswählen müssen. Suchen Sie in der Seitenleiste unter dem Abschnitt „Meine Stile“ Ihren veröffentlichten Stil und wählen Sie ihn aus.
Klicken Sie anschließend auf „Fertig“, um Ihren benutzerdefinierten Stil mit der Karten-ID zu verknüpfen.
Dadurch wird sichergestellt, dass der von Ihnen konfigurierte Stil immer dann angewendet wird, wenn diese Karten-ID verwendet wird.
Kopieren Sie abschließend den auf der Seite „Map ID“ angezeigten Wert „Map ID“ , da Sie diese ID benötigen, um den benutzerdefinierten Stil im nächsten Schritt in WPForms zu integrieren.
Anwenden der Karten-ID auf Ihr Kartenfeld
Um Ihren benutzerdefinierten Kartenstil auf das WPForms-Kartenfeld anzuwenden, verwenden Sie den folgenden PHP-Codeausschnitt. Passen Sie ihn mit Ihrer Formular-ID, Feld-ID und der kopierten Karten-ID an.
- Auf Zeile 11ersetzen
111mit Ihrer tatsächlichen Formular-ID - Auf Zeile 15ersetzen
222mit Ihrer tatsächlichen Kartenfeld-ID - Auf Zeile 19ersetzen
'your-map-id'mit der Map-ID, die Sie aus der Google Cloud Console kopiert haben (behalten Sie die Anführungszeichen bei)
Nachdem Sie den Code-Schnipsel mit Ihren benutzerdefinierten Werten gespeichert haben, verwendet Ihr Kartenfeld den benutzerdefinierten Stil aus der Google Cloud Console. Die Karte zeigt nur Ihre benutzerdefinierten Markierungen ohne Sehenswürdigkeiten an, sodass Sie eine übersichtliche, fokussierte Ansicht Ihrer Standorte erhalten.
Das war's schon! Jetzt können Sie Points of Interest in Ihrem Kartenfeld ausblenden und nur Ihre benutzerdefinierten Markierungen anzeigen. Weitere Möglichkeiten zur Anpassung Ihrer Formulare finden Sie in unserem Leitfaden zur Anpassung von WPForms mit Code.