Übersicht

Mit Sammlungen den Überblick behalten Sie können Inhalte basierend auf Ihren Einstellungen speichern und kategorisieren.

Mit WebGL-gestützten Funktionen für die Maps JavaScript API können Sie die Neigung und Drehung steuern, 3D-Objekte direkt auf der Karte einfügen und vieles mehr. Die folgenden Funktionen sind enthalten:

  • Mit der WebGL-Overlay-Ansicht können Sie Ihren Karten benutzerdefinierte 2D- und 3D-Grafiken sowie animierte Inhalte hinzufügen.
  • Neigung und Ausrichtung können jetzt programmatisch und mithilfe von Maus- und Tastaturgesten angepasst werden.
  • Mit map.moveCamera() können Sie mehrere Kameraeigenschaften gleichzeitig ändern.
  • Zoom unterstützt jetzt Dezimalwerte.

Erste Schritte

Um die neuen WebGL-Funktionen nutzen zu können, benötigen Sie eine Karten-ID mit Vektorkarte. Außerdem müssen Sie Ihre API-Bootstrap-Anfrage aktualisieren. In diesem Abschnitt wird die Vorgehensweise beschrieben.

Neue Karten-ID erstellen

Wie Sie eine neue Karten-ID erstellen, erfahren Sie unter Cloudbasierte Kartenstile verwenden – Karten-ID abrufen. Legen Sie den Kartentyp auf JavaScript fest und wählen Sie die Option Vektor aus. Setzen Sie ein Häkchen bei Neigung und/oder Rotation, um Neigung und Rotation auf der Karte zu aktivieren. Dadurch lassen sich diese Werte programmatisch anpassen. Außerdem können Nutzer Neigung und Richtung direkt auf der Karte anpassen. Wenn sich die Verwendung der Neigung oder Neigung negativ auf Ihre App auswirkt, lassen Sie Neigen und Drehen deaktiviert, damit Nutzer die Neigung und die Rotation nicht anpassen können.

Vektorkarten-ID erstellen

Initialisierungscode für die Karte aktualisieren

Dazu ist die soeben erstellte Karten-ID erforderlich. Sie finden es auf der Seite Maps-Verwaltung. Geben Sie eine Karten-ID an, wenn Sie die Karte mit der Property mapId instanziieren:

map = new google.maps.Map(document.getElementById('map'), {
  center: {lat: -34.397, lng: 150.644},
  zoom: 8,
  mapId: 'MAP_ID'
});

Beispiele

Beispiele zur Veranschaulichung dieser Funktionen: