Street View

Google Street View stellt 360°-Panoramen von verschiedenen Straßen des gesamten Street View-Abdeckungsbereichs zur Verfügung.

In diesem Video erfährst du, wie du den Street View-Dienst nutzen kannst, um deinen Nutzern ein wirklichkeitsgetreues Bild einer Adresse auf der Karte zu bieten und ihnen aussagekräftige Kontextinformationen zu ihrem Ziel oder Ort ihres Interesses zu liefern.

Die über die Google Maps Android API Version 2 verfügbare Abdeckung ist dieselbe wie die der Google Maps-App auf deinem Android-Gerät. Weitere Informationen zu Street View und den unterstützten Gebieten findest du unter Street View.

Die Klasse StreetViewPanorama modelliert das Street View-Panorama in deiner Anwendung. Innerhalb deiner UI wird ein Panorama durch ein StreetViewPanoramaFragment- oder StreetViewPanoramaView-Objekt dargestellt.

Codebeispiele

Das ApiDemos-Repository auf GitHub enthält Beispiele für die Verwendung von Street View.

Java-Beispiele:

Kotlin-Beispiele:

Street View im Maps SDK for Android – Übersicht

Das Maps SDK for Android stellt einen Street View-Dienst zum Abrufen und Bearbeiten der Bilder bereit, die in Google Street View verwendet werden. Bilder werden als Panoramen zurückgegeben.

Jedes Street View-Panorama besteht aus einem oder mehreren Bildern, die eine 360-Grad-Ansicht eines einzelnen Orts bilden. Die Bilder entsprechen der Equirektangularprojektion (Plate Carrée), die eine 360-Grad-Horizontalsicht (eine volle Drehung) und eine 180-Grad-Vertikalsicht (von ganz oben bis ganz unten) bietet. Das sich ergebende 360-Grad-Panorama definiert eine Projektion auf einer Kugel, wobei das Bild auf die zweidimensionale Oberfläche dieser Kugel gelegt ist.

StreetViewPanorama stellt ein Anzeigeprogramm bereit, mit dem das Panorama als Kugel mit einer Kamera in ihrem Mittelpunkt gerendert wird. Du kannst StreetViewPanoramaCamera bearbeiten, um den Zoom und die Ausrichtung (Neigung und Drehung) der Kamera zu steuern.

Jetzt starten

Richte ein Maps SDK for Android-Projekt ein. Füge anschließend ein Street View-Panorama hinzu, wie nachfolgend beschrieben.

Die Clientbibliothek von Google Play Services SDK enthält einige Street View-Beispiele, die du importieren und als Grundlage für deine Entwicklung verwenden kannst. In der Einführung findest du Richtlinien zum Importieren von Beispielen.

API verwenden

Folge der nachstehenden Anleitung, um ein Android-Fragment durch ein Street View-Panorama zu ergänzen. Das ist die einfachste Möglichkeit, um Street View zu deiner Anwendung hinzuzufügen. Lese anschließend mehr über Fragmente, Ansichten und die Anpassung des Panoramas.

Street View-Panorama hinzufügen

Gehe wie unten beschrieben vor, um ein Street View-Panorama wie dieses hinzuzufügen:

Demo zu Street View-Panorama

Zusammenfassung:

  1. Füge dem Activity-Objekt ein Fragment-Objekt hinzu, mit dem das Street View-Panorama verarbeitet wird. Am einfachsten ist es, der Layoutdatei für Activity ein <fragment>-Element hinzuzufügen.
  2. Implementiere die Schnittstelle OnStreetViewPanoramaReadyCallback und verwende die Callback-Methode onStreetViewPanoramaReady(StreetViewPanorama), um ein Handle für das Objekt StreetViewPanorama zu erhalten.
  3. Rufe getStreetViewPanoramaAsync() für das Fragment auf, um den Callback zu registrieren.

Nachfolgend erhältst du ausführlichere Informationen zu den einzelnen Schritten.

Fragment hinzufügen

Füge der Layoutdatei der Aktivität ein <fragment>-Element hinzu, um ein Fragment-Objekt zu definieren. Lege in diesem Element das Attribut class auf com.google.android.gms.maps.StreetViewPanoramaFragment (oder SupportStreetViewPanoramaFragment) fest.

Hier siehst du ein Beispiel eines Fragments in einer Layoutdatei:

<fragment
    android:name="com.google.android.gms.maps.StreetViewPanoramaFragment"
    android:id="@+id/streetviewpanorama"
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>

Street View-Code hinzufügen

Wenn du mit dem Street View-Panorama in der App arbeiten möchtest, musst du die Schnittstelle OnStreetViewPanoramaReadyCallback implementieren und eine Instanz des Callbacks in einem StreetViewPanoramaFragment- oder StreetViewPanoramaView-Objekt festlegen. In dieser Anleitung wird ein StreetViewPanoramaFragment verwendet, weil das die gängigste Methode ist, um deiner App Street View hinzuzufügen. Im ersten Schritt implementierst du die Callback-Schnittstelle:

Java

class StreetViewActivity extends AppCompatActivity implements OnStreetViewPanoramaReadyCallback {
    // ...
}
      

Kotlin

internal class StreetViewActivity : AppCompatActivity(), OnStreetViewPanoramaReadyCallback {
    // ...
        // ...
    }

    override fun onStreetViewPanoramaReady(streetViewPanorama: StreetViewPanorama) {
        val sanFrancisco = LatLng(37.754130, -122.447129)
        streetViewPanorama.setPosition(sanFrancisco)
    }

    private fun newView() {
        val sanFrancisco = LatLng(37.754130, -122.447129)
        val view = StreetViewPanoramaView(
            this,
            StreetViewPanoramaOptions().position(sanFrancisco)
        )
    }

    private fun setLocationOfThePanorama(streetViewPanorama: StreetViewPanorama) {
        val sanFrancisco = LatLng(37.754130, -122.447129)

        // Set position with LatLng only.
        streetViewPanorama.setPosition(sanFrancisco)

        // Set position with LatLng and radius.
        streetViewPanorama.setPosition(sanFrancisco, 20)

        // Set position with LatLng and source.
        streetViewPanorama.setPosition(sanFrancisco, StreetViewSource.OUTDOOR)

        // Set position with LaLng, radius and source.
        streetViewPanorama.setPosition(sanFrancisco, 20, StreetViewSource.OUTDOOR)

        streetViewPanorama.location.links.firstOrNull()?.let { link: StreetViewPanoramaLink ->
            streetViewPanorama.setPosition(link.panoId)
        }
    }

    private fun zoom(streetViewPanorama: StreetViewPanorama) {
        val zoomBy = 0.5f
        val camera = StreetViewPanoramaCamera.Builder()
            .zoom(streetViewPanorama.panoramaCamera.zoom + zoomBy)
            .tilt(streetViewPanorama.panoramaCamera.tilt)
            .bearing(streetViewPanorama.panoramaCamera.bearing)
            .build()
    }

    private fun pan(streetViewPanorama: StreetViewPanorama) {
        val panBy = 30f
        val camera = StreetViewPanoramaCamera.Builder()
            .zoom(streetViewPanorama.panoramaCamera.zoom)
            .tilt(streetViewPanorama.panoramaCamera.tilt)
            .bearing(streetViewPanorama.panoramaCamera.bearing - panBy)
            .build()
    }

    private fun tilt(streetViewPanorama: StreetViewPanorama) {
        var tilt = streetViewPanorama.panoramaCamera.tilt + 30
        tilt = if (tilt > 90) 90f else tilt
        val previous = streetViewPanorama.panoramaCamera
        val camera = StreetViewPanoramaCamera.Builder(previous)
            .tilt(tilt)
            .build()
    }

    private fun animate(streetViewPanorama: StreetViewPanorama) {
        // Keeping the zoom and tilt. Animate bearing by 60 degrees in 1000 milliseconds.
        val duration: Long = 1000
        val camera = StreetViewPanoramaCamera.Builder()
            .zoom(streetViewPanorama.panoramaCamera.zoom)
            .tilt(streetViewPanorama.panoramaCamera.tilt)
            .bearing(streetViewPanorama.panoramaCamera.bearing - 60)
            .build()
        streetViewPanorama.animateTo(camera, duration)
    }
}
      

Lege in der onCreate()-Methode von Activity die Layoutdatei als Inhaltsansicht fest. Wenn die Layoutdatei beispielsweise den Namen main.xml hat, verwende diesen Code:

Java

@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_street_view);
    SupportStreetViewPanoramaFragment streetViewPanoramaFragment =
        (SupportStreetViewPanoramaFragment) getSupportFragmentManager()
            .findFragmentById(R.id.street_view_panorama);
    streetViewPanoramaFragment.getStreetViewPanoramaAsync(this);
}
      

Kotlin

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_street_view)
    // ...
}
      

Erstelle ein Handle zum Fragment, indem du FragmentManager.findFragmentById() aufrufst und die Ressourcen-ID des <fragment>-Elements übergibst. Die Ressourcen-ID R.id.streetviewpanorama wird dem Android-Projekt automatisch hinzugefügt, wenn du die Layoutdatei erstellst.

Verwende dann getStreetViewPanoramaAsync(), um den Callback für das Fragment festzulegen.

Java

SupportStreetViewPanoramaFragment streetViewPanoramaFragment =
    (SupportStreetViewPanoramaFragment) getSupportFragmentManager()
        .findFragmentById(R.id.street_view_panorama);
streetViewPanoramaFragment.getStreetViewPanoramaAsync(this);
      

Kotlin

val streetViewPanoramaFragment =
    supportFragmentManager
        .findFragmentById(R.id.street_view_panorama) as SupportStreetViewPanoramaFragment
streetViewPanoramaFragment.getStreetViewPanoramaAsync(this)
      

Verwende die Callback-Methode onStreetViewPanoramaReady(StreetViewPanorama), um eine Nicht-NULL-Instanz von StreetViewPanorama abzurufen, die sofort verwendet werden kann.

Java

@Override
public void onStreetViewPanoramaReady(StreetViewPanorama streetViewPanorama) {
    LatLng sanFrancisco = new LatLng(37.754130, -122.447129);
    streetViewPanorama.setPosition(sanFrancisco);
}
      

Kotlin

override fun onStreetViewPanoramaReady(streetViewPanorama: StreetViewPanorama) {
    val sanFrancisco = LatLng(37.754130, -122.447129)
    streetViewPanorama.setPosition(sanFrancisco)
}
      

Weitere Informationen zum Konfigurieren des Anfangszustands

Im Gegensatz zu einer Karte kann der Anfangszustand des Street View-Panoramas nicht über XML konfiguriert werden. Du kannst das Panorama jedoch programmatisch konfigurieren, indem du ein StreetViewPanoramaOptions-Objekt übergibst, das die von dir angegebenen Optionen enthält.

Java

LatLng sanFrancisco = new LatLng(37.754130, -122.447129);
StreetViewPanoramaView view = new StreetViewPanoramaView(this,
    new StreetViewPanoramaOptions().position(sanFrancisco));
      

Kotlin

val sanFrancisco = LatLng(37.754130, -122.447129)
val view = StreetViewPanoramaView(
    this,
    StreetViewPanoramaOptions().position(sanFrancisco)
)
      

Weitere Informationen zu StreetViewPanoramaFragment

StreetViewPanoramaFragment ist eine Unterklasse der Android Fragment-Klasse und ermöglicht das Festlegen eines Street View-Panoramas in einem Android-Fragment. StreetViewPanoramaFragment-Objekte fungieren als Container für die Karte und bieten Zugriff auf das StreetViewPanorama-Objekt.

StreetViewPanoramaView

Mit StreetViewPanoramaView, einer Unterklasse der Android-View-Klasse, kannst du ein Street View-Panorama in einer Android-View platzieren. Ein View-Element repräsentiert einen rechteckigen Bereich des Bildschirms und bildet einen Basisbaustein für Android-Apps und -Widgets. Ähnlich wie StreetViewPanoramaFragment fungiert StreetViewPanoramaView als Container für das Panorama und stellt dabei Kernfunktionen über das Objekt StreetViewPanorama bereit. Nutzer dieser Klasse müssen alle Methoden des Aktivitätslebenszyklus, z. B. onCreate(), onDestroy(), onResume() und onPause()), an die entsprechenden Methoden in der StreetViewPanoramaView-Klasse weiterleiten.

Benutzerdefinierte Funktionen anpassen

Standardmäßig stehen dem Nutzer folgende Funktionen bei der Anzeige von Street View-Panoramen zur Verfügung: Schwenken, Vergrößern und Wechseln zu benachbarten Panoramen. Du kannst benutzergesteuerte Gesten mithilfe von Methoden in StreetViewPanorama aktivieren und deaktivieren. Programmgesteuerte Änderungen sind auch nach dem Deaktivieren der Geste weiterhin möglich.

Standort des Panoramas festlegen

Um den Standort des Street View-Panoramas festzulegen, rufst du StreetViewPanorama.setPosition() auf und übergibst einen LatLng. Du kannst auch radius und source als optionale Parameter übergeben.

Ein Radius ist hilfreich, wenn du den Bereich vergrößern oder verkleinern möchtest, in dem Street View nach einem passenden Panorama sucht. Ein Radius von 0 bedeutet, dass das Panorama mit dem angegebenen LatLng verknüpft werden muss. Der Standardradius beträgt 50 Meter. Wenn sich im übereinstimmenden Bereich mehrere Panoramas befinden, gibt die API die beste Übereinstimmung zurück.

Eine Quelle ist nützlich, wenn du Street View nur auf Außenaufnahmen beschränken möchtest. Standardmäßig können Street View-Panoramen beispielsweise in Museen, öffentlichen Gebäuden, Cafés oder Unternehmen aufgenommen werden. Möglicherweise sind für den angegebenen Ort keine Außenansichten vorhanden.

Java

LatLng sanFrancisco = new LatLng(37.754130, -122.447129);

// Set position with LatLng only.
streetViewPanorama.setPosition(sanFrancisco);

// Set position with LatLng and radius.
streetViewPanorama.setPosition(sanFrancisco, 20);

// Set position with LatLng and source.
streetViewPanorama.setPosition(sanFrancisco, StreetViewSource.OUTDOOR);

// Set position with LaLng, radius and source.
streetViewPanorama.setPosition(sanFrancisco, 20, StreetViewSource.OUTDOOR);
      

Kotlin

val sanFrancisco = LatLng(37.754130, -122.447129)

// Set position with LatLng only.
streetViewPanorama.setPosition(sanFrancisco)

// Set position with LatLng and radius.
streetViewPanorama.setPosition(sanFrancisco, 20)

// Set position with LatLng and source.
streetViewPanorama.setPosition(sanFrancisco, StreetViewSource.OUTDOOR)

// Set position with LaLng, radius and source.
streetViewPanorama.setPosition(sanFrancisco, 20, StreetViewSource.OUTDOOR)
      

Alternativ kannst du den Standort anhand einer Panorama-ID festlegen. Dazu übergibst du einen panoId an StreetViewPanorama.setPosition().

Wenn du die Panorama-ID für benachbarte Panoramabilder abrufen möchtest, rufe zuerst mit getLocation() einen StreetViewPanoramaLocation ab. Dieses Objekt enthält die ID des aktuellen Panoramas und ein Array mit StreetViewPanoramaLink-Objekten, von denen jedes die ID eines Panoramas enthält, das mit dem aktuellen Panorama verbunden ist.

Java

StreetViewPanoramaLocation location = streetViewPanorama.getLocation();
if (location != null && location.links != null) {
    streetViewPanorama.setPosition(location.links[0].panoId);
}
      

Kotlin

streetViewPanorama.location.links.firstOrNull()?.let { link: StreetViewPanoramaLink ->
    streetViewPanorama.setPosition(link.panoId)
}
      

Heran- und herauszoomen

Du kannst die Zoomstufe programmatisch ändern, indem du StreetViewPanoramaCamera.zoom festlegst. Durch Festlegen des Zooms auf 1,0 wird das Bild um den Faktor 2 vergrößert.

Im nachfolgenden Snippet wird StreetViewPanoramaCamera.Builder() verwendet, um eine neue Kamera mit derselben Neigung und Drehung wie die vorhandene Kamera und einem um 50 % erhöhten Zoom zu erstellen.

Java

float zoomBy = 0.5f;
StreetViewPanoramaCamera camera = new StreetViewPanoramaCamera.Builder()
    .zoom(streetViewPanorama.getPanoramaCamera().zoom + zoomBy)
    .tilt(streetViewPanorama.getPanoramaCamera().tilt)
    .bearing(streetViewPanorama.getPanoramaCamera().bearing)
    .build();
      

Kotlin

val zoomBy = 0.5f
val camera = StreetViewPanoramaCamera.Builder()
    .zoom(streetViewPanorama.panoramaCamera.zoom + zoomBy)
    .tilt(streetViewPanorama.panoramaCamera.tilt)
    .bearing(streetViewPanorama.panoramaCamera.bearing)
    .build()
      

Kameraausrichtung (POV) festlegen

Du kannst die Ausrichtung der Street View-Kamera bestimmen, indem du die Drehung und Neigung für StreetViewPanoramaCamera festlegst.

bearing
Die Richtung, in die die Kamera zeigt, angegeben in Grad im Uhrzeigersinn vom geografischen Norden um den geometrischen Kameraort. Der geografische Norden ist 0, Osten 90, Süden 180 und Westen 270.
tilt
Die Neigung der y-Achse nach oben oder unten. Der Bereich reicht von -90 über 0 bis 90, wobei -90 senkrecht nach unten, 0 zentriert am Horizont und 90 senkrecht nach oben bedeutet. Die Abweichung wird vom Standardneigungswinkel der Kamera aus gemessen, der häufig (aber nicht immer) flach horizontal ist. Ein Bild, das auf einem Berg aufgenommen wurde, wird vermutlich einen Standardneigungswinkel haben, der nicht horizontal ist.

Im folgenden Snippet wird StreetViewPanoramaCamera.Builder() verwendet, um eine neue Kamera mit dem Zoom und der Neigung der vorhandenen Kamera zu erstellen und dabei die Neigung um 30 Grad nach links zu ändern.

Java

float panBy = 30;
StreetViewPanoramaCamera camera = new StreetViewPanoramaCamera.Builder()
    .zoom(streetViewPanorama.getPanoramaCamera().zoom)
    .tilt(streetViewPanorama.getPanoramaCamera().tilt)
    .bearing(streetViewPanorama.getPanoramaCamera().bearing - panBy)
    .build();
      

Kotlin

val panBy = 30f
val camera = StreetViewPanoramaCamera.Builder()
    .zoom(streetViewPanorama.panoramaCamera.zoom)
    .tilt(streetViewPanorama.panoramaCamera.tilt)
    .bearing(streetViewPanorama.panoramaCamera.bearing - panBy)
    .build()
      

Mit dem nachfolgenden Code-Snippet wird die Kamera um 30 Grad nach oben geneigt.

Java

float tilt = streetViewPanorama.getPanoramaCamera().tilt + 30;
tilt = (tilt > 90) ? 90 : tilt;

StreetViewPanoramaCamera previous = streetViewPanorama.getPanoramaCamera();

StreetViewPanoramaCamera camera = new StreetViewPanoramaCamera.Builder(previous)
    .tilt(tilt)
    .build();
      

Kotlin

var tilt = streetViewPanorama.panoramaCamera.tilt + 30
tilt = if (tilt > 90) 90f else tilt
val previous = streetViewPanorama.panoramaCamera
val camera = StreetViewPanoramaCamera.Builder(previous)
    .tilt(tilt)
    .build()
      

Kamerabewegungen animieren

Rufe zur Animation der Kamerabewegungen StreetViewPanorama.animateTo() auf. Die Animation wird zwischen den aktuellen und den neuen Kameraattributen interpoliert. Um direkt und ohne Animation zur Kamera zu springen, kannst du die Dauer mit 0 festlegen.

Java

// Keeping the zoom and tilt. Animate bearing by 60 degrees in 1000 milliseconds.
long duration = 1000;
StreetViewPanoramaCamera camera =
    new StreetViewPanoramaCamera.Builder()
        .zoom(streetViewPanorama.getPanoramaCamera().zoom)
        .tilt(streetViewPanorama.getPanoramaCamera().tilt)
        .bearing(streetViewPanorama.getPanoramaCamera().bearing - 60)
        .build();
streetViewPanorama.animateTo(camera, duration);
      

Kotlin

// Keeping the zoom and tilt. Animate bearing by 60 degrees in 1000 milliseconds.
val duration: Long = 1000
val camera = StreetViewPanoramaCamera.Builder()
    .zoom(streetViewPanorama.panoramaCamera.zoom)
    .tilt(streetViewPanorama.panoramaCamera.tilt)
    .bearing(streetViewPanorama.panoramaCamera.bearing - 60)
    .build()
streetViewPanorama.animateTo(camera, duration)
      

Die folgende Abbildung zeigt das Ergebnis, wenn du die Animation oben mit Handler.postDelayed() alle 2.000 Millisekunden planst:

Demo für Street View-Panoramaanimation