Es kann losgehen!

Bevor Sie mit der Entwicklung beginnen, lesen Sie bitte unsere Entwicklerdokumentation.

Die Google Maps Android API aktivieren

Zum Einstieg führen wir Sie durch die Google Developers Console, wo Sie vorab Folgendes tun müssen:

  1. Ein Projekt erstellen oder auswählen
  2. Die Google Maps Android API aktivieren
  3. Zugehörige Schlüssel erstellen
Weiter

Hinzufügen einer formatierten Karte

In dieser Anleitung wird erläutert, wie Sie Ihrer Android-App eine Karte mit benutzerdefinierter Formatierung hinzufügen. Der Nachtmodus dient hierbei als Beispiel für eine benutzerdefinierte Formatierung.

Mit Formatoptionen können Sie die Darstellung der Google-Standardkartenformate individuell gestalten, indem Sie die visuelle Anzeige von Merkmalen wie Straßen, Parks, Unternehmen und anderen Points of Interest ändern. Sie können also bestimmte Komponenten der Karte hervorheben bzw. die Formatierung der Karte an die Gestaltung Ihrer App anpassen.

Die Formatierung funktioniert nur für den Kartentyp normal.

Code beschaffen

Klonen Sie das Google Maps Android API v2 Samples-Repository oder laden Sie es von GitHub herunter.

Entwicklungsprojekt einrichten

Gehen Sie wie folgt vor, um das Anleitungsprojekt in Android Studio zu erstellen.

  1. Laden Sie Android Studio herunter und installieren Sie es.
  2. Fügen Sie das Google Play-Dienste-Paket zu Android Studio hinzu.
  3. Klonen Sie das Google Maps Android API v2 Samples-Repository oder laden Sie es herunter, sofern Sie dies noch nicht zu Beginn dieser Anleitung getan haben.
  4. Importieren Sie das Anleitungsprojekt:

    • Wählen Sie in Android Studio File > New > Import Project aus.
    • Navigieren Sie zum Verzeichnis, in dem Sie das Google Maps Android API v2 Samples- Repository nach dem Download gespeichert haben.
    • Sie finden das Projekt StyledMap im folgenden Verzeichnis:
      PATH-TO-SAVED-REPO/android-samples/tutorials/StyledMap
    • Wählen Sie das Projektverzeichnis aus und klicken Sie dann auf OK. Android Studio erstellt jetzt Ihr Projekt mit dem Build-Tool Gradle.

Einen API-Schlüssel anfordern und die erforderlichen APIs aktivieren

Für diese Anleitung benötigen Sie einen Google API-Schlüssel, der für die Google Maps Android API autorisiert ist.

Klicken Sie auf die folgende Schaltfläche, um einen Schlüssel anzufordern und die API zu aktivieren.

Schlüssel anfordern

Weitere Informationen finden Sie im vollständigen Leitfaden zum Anfordern eines API-Schlüssels.

API-Schlüssel der App hinzufügen

  1. Bearbeiten Sie die Datei gradle.properties Ihres Projekts.
  2. Fügen Sie Ihren API-Schlüssel in den Wert der Eigenschaft GOOGLE_MAPS_API_KEY ein. Wenn Sie die App erstellen, kopiert Gradle den API-Schlüssel in das Android-Manifest der App.

    GOOGLE_MAPS_API_KEY=PASTE-YOUR-API-KEY-HERE
    

App erstellen und ausführen

  1. Verbinden Sie ein Android-Gerät mit Ihrem Computer. Befolgen Sie die Anleitung, um Entwickleroptionen in Ihrem Android-Gerät zu aktivieren, und konfigurieren Sie Ihr System so, dass das Gerät erkannt wird. (Alternativ hierzu können Sie mit dem Android Virtual Device (AVD) Manager ein virtuelles Gerät konfigurieren. Wenn Sie einen Emulator wählen, stellen Sie sicher, dass Sie ein Image auswählen, das die Google APIs enthält. Weitere Informationen finden Sie im Startleitfaden.)
  2. Klicken Sie in Android Studio auf die Menüoption Run (oder das Abspielsymbol). Wählen Sie ein Gerät, wenn Sie dazu aufgefordert werden.

Android Studio ruft Gradle auf, um die App zu erstellen, und führt diese dann auf dem Gerät oder dem Emulator aus. Sie sollten eine Karte mit einer dunklen Formatierung (Nachtmodus) sehen, die dem Bild auf dieser Seite ähnelt.

Fehlerbehebung:

Erläuterungen zum Code

In diesem Teil der Anleitung werden die wesentlichsten Teile der App StyledMap erläutert, um Ihnen ein Verständnis davon zu vermitteln, wie eine entsprechende App zu erstellen ist.

Eine Ressource mit einem JSON-Formatobjekt hinzufügen

Fügen Sie Ihrem Entwicklungsprojekt eine Ressource hinzu, die die Formatdeklarationen im JSON-Format enthält. Sie können wie in den folgenden Beispielen dargestellt eine Raw-Ressource oder Zeichenfolge verwenden.

Hinweis: In der Beispiel-App, die Sie von GitHub heruntergeladen haben, wird eine Raw-Ressource verwendet.

Raw-Ressource

Definieren Sie eine Raw-Ressource in /res/raw/style_json.json, die die folgende JSON-Formatdeklaration für den Nachtmodus enthält:

Zeichenfolgenressource

Definieren Sie eine Zeichenfolgenressource in /res/values/style_strings.xml, die die folgende JSON-Formatdeklaration für den Nachtmodus enthält: In dieser Anleitung wird der Zeichenfolgename style_json verwendet. In dieser Datei müssen Sie einen umgekehrten Schrägstrich verwenden, um Escaping auf die Anführungszeichen anzuwenden:

JSON-Formatobjekt an Ihre Karte übergeben

Rufen Sie zum Formatieren der Karte GoogleMap.setMapStyle() auf und übergeben Sie ein Objekt vom Typ MapStyleOptions, das Ihre Formatdeklarationen im JSON-Format enthält.

Raw-Ressource

Im folgenden Codebeispiel wird davon ausgegangen, dass Ihr Projekt eine Raw-Ressource mit dem Namen style_json enthält:

package com.example.styledmap;

import android.content.res.Resources;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.util.Log;

import com.google.android.gms.maps.CameraUpdateFactory;
import com.google.android.gms.maps.GoogleMap;
import com.google.android.gms.maps.OnMapReadyCallback;
import com.google.android.gms.maps.SupportMapFragment;
import com.google.android.gms.maps.model.LatLng;
import com.google.android.gms.maps.model.MapStyleOptions;

/**
 * A styled map using JSON styles from a raw resource.
 */
public class MapsActivityRaw extends AppCompatActivity
        implements OnMapReadyCallback {

    private static final String TAG = MapsActivityRaw.class.getSimpleName();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        // Retrieve the content view that renders the map.
        setContentView(R.layout.activity_maps_raw);

        // Get the SupportMapFragment and register for the callback
        // when the map is ready for use.
        SupportMapFragment mapFragment =
                (SupportMapFragment) getSupportFragmentManager()
                        .findFragmentById(R.id.map);
        mapFragment.getMapAsync(this);
    }

    /**
     * Manipulates the map when it's available.
     * The API invokes this callback when the map is ready for use.
     */
    @Override
    public void onMapReady(GoogleMap googleMap) {

        try {
            // Customise the styling of the base map using a JSON object defined
            // in a raw resource file.
            boolean success = googleMap.setMapStyle(
                    MapStyleOptions.loadRawResourceStyle(
                            this, R.raw.style_json));

            if (!success) {
                Log.e(TAG, "Style parsing failed.");
            }
        } catch (Resources.NotFoundException e) {
            Log.e(TAG, "Can't find style. Error: ", e);
        }
        // Position the map's camera near Sydney, Australia.
        googleMap.moveCamera(CameraUpdateFactory.newLatLng(new LatLng(-34, 151)));
    }
}

Das Layout (activity_maps_raw.xml) sieht wie folgt aus:

Zeichenfolgenressource

Im folgenden Codebeispiel wird davon ausgegangen, dass Ihr Projekt eine Zeichenfolgenressource mit dem Namen style_json enthält:

package com.example.styledmap;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.util.Log;

import com.google.android.gms.maps.CameraUpdateFactory;
import com.google.android.gms.maps.GoogleMap;
import com.google.android.gms.maps.OnMapReadyCallback;
import com.google.android.gms.maps.SupportMapFragment;
import com.google.android.gms.maps.model.LatLng;
import com.google.android.gms.maps.model.MapStyleOptions;

/**
 * A styled map using JSON styles from a string resource.
 */
public class MapsActivityString extends AppCompatActivity
        implements OnMapReadyCallback {

    private static final String TAG = MapsActivityString.class.getSimpleName();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        // Retrieve the content view that renders the map.
        setContentView(R.layout.activity_maps_string);

        // Get the SupportMapFragment and register for the callback
        // when the map is ready for use.
        SupportMapFragment mapFragment =
                (SupportMapFragment) getSupportFragmentManager()
                        .findFragmentById(R.id.map);
        mapFragment.getMapAsync(this);
    }

    /**
     * Manipulates the map when it's available.
     * The API invokes this callback when the map is ready for use.
     */
    @Override
    public void onMapReady(GoogleMap googleMap) {

        // Customise the styling of the base map using a JSON object defined
        // in a string resource file. First create a MapStyleOptions object
        // from the JSON styles string, then pass this to the setMapStyle
        // method of the GoogleMap object.
        boolean success = googleMap.setMapStyle(new MapStyleOptions(getResources()
                .getString(R.string.style_json)));

        if (!success) {
            Log.e(TAG, "Style parsing failed.");
        }
        // Position the map's camera near Sydney, Australia.
        googleMap.moveCamera(CameraUpdateFactory.newLatLng(new LatLng(-34, 151)));
    }
}

Das Layout (activity_maps_string.xml) sieht wie folgt aus:

Weitere Informationen zu JSON-Formatdeklarationen

Für formatierte Karten kommen zwei Konzepte zum Einsatz, um Farben und andere Formatänderungen für eine Karte anzuwenden:

  • Selektoren geben die geografischen Komponenten an, die Sie auf der Karte formatieren können. Dazu gehören Straßen, Parks, Gewässer usw. sowie deren Beschriftungen. Die Selektoren umfassen Merkmale und Elemente, die als die Eigenschaften featureType und elementType angegeben werden.
  • Styler sind Farb- und Sichtbarkeitseigenschaften, die auf die Kartenelemente angewendet werden können. Mit ihnen definieren Sie die Anzeigefarbe, indem Sie Farbton-, Farb- sowie Helligkeits-/Gammawerte kombinieren.

Eine detaillierte Beschreibung der JSON-Formatierungsoptionen finden Sie in der Formatreferenz.

Google Maps APIs Styling Wizard



Mit dem Google Maps APIs Styling Wizard können Sie schnell ein JSON-Formatierungsobjekt generieren. Die Google Maps Android API unterstützt die gleichen Formatdeklarationen wie die Google Maps JavaScript API.

Nächster Schritt

Weitere Informationen erhalten Sie unter Ausblenden von Kartenmerkmalen mit Formatierung.

Feedback geben zu...

Google Maps Android API
Google Maps Android API