Street View

Zadbaj o dobrą organizację dzięki kolekcji Zapisuj i kategoryzuj treści zgodnie ze swoimi preferencjami.
Wybierz platformę: Android iOS JavaScript

Google Street View rozciąga się z wyznaczonych ulic w panoramicznym widoku 360°.

Ten film pokazuje, jak korzystać z usługi Street View, by udostępniać użytkownikom rzeczywistość w adresie na mapie, dostarczając mu istotny kontekst dotyczący miejsca docelowego lub miejsca, które ich interesuje.

Pokrycie dostępne w interfejsie API Map Google na Androida w wersji 2 jest takie samo jak w aplikacji Mapy Google na urządzeniu z Androidem. Więcej informacji o Street View i obsługiwanych obszarach znajdziesz na interaktywnej mapie w artykule Informacje o Street View.

Klasa StreetViewPanorama modeluje panoramę Street View w Twojej aplikacji. W interfejsie użytkownika panorama jest reprezentowana przez obiekt StreetViewPanoramaFragment lub StreetViewPanoramaView.

Przykładowe fragmenty kodu

Repozytorium ApiDemos w serwisie GitHub zawiera przykłady, które pokazują użycie Street View.

Przykłady w języku Java:

Przykłady Kotlina:

Omówienie Street View w pakiecie Maps SDK na Androida

Pakiet SDK Map na Androida oferuje usługę Street View do pobierania zdjęć i manipulowania nimi w Google Street View. Obrazy są zwracane jako panoramy.

Każda panorama Street View to obraz lub zbiór zdjęć, które zapewniają pełny widok 360 stopni z jednego miejsca. Obrazy są zgodne z odwzorowaniem walcowym równoodległościowym (Plate Carrée), który obejmuje 360 stopni w poziomie i 180 stopni w pionie (od prostej do prostej w dół). Otrzymana panorama 360° definiuje odwzorowanie na sferze, a obraz owinięty jest w dwuwymiarową powierzchnię tej kuli.

StreetViewPanorama udostępnia go jako sferę, na której umieszczony jest aparat. Możesz zmieniać StreetViewPanoramaCamera, aby kontrolować powiększenie i orientację (przechylanie i nośnik) kamery.

Pierwsze kroki

Aby skonfigurować pakiet SDK Map na Androida, postępuj zgodnie z przewodnikiem dla początkujących. Następnie dodaj panoramę Street View w sposób opisany poniżej.

Biblioteka klienta SDK usług Google Play zawiera kilka przykładów Street View, które możesz zaimportować do swojego projektu i użyć ich do programowania. Wskazówki dotyczące importowania próbek znajdziesz we wprowadzeniu.

Korzystanie z interfejsu API

Aby dodać panoramę Street View do fragmentu Androida, wykonaj poniższe czynności. To najprostsza metoda dodania Street View do aplikacji. Następnie przeczytaj o fragmentach, widokach i dostosowywaniu panoramy.

Dodaj panoramę Street View

Aby dodać panoramę Street View w ten sposób:

Wersja demonstracyjna panoramy Street View

Podsumowanie:

  1. Dodaj obiekt Fragment do Aktywności, która obsługuje panoramę Street View. Najłatwiej to zrobić, dodając element <fragment> do pliku układu Activity.
  2. Zaimplementuj interfejs OnStreetViewPanoramaReadyCallback i użyj metody wywołania zwrotnego onStreetViewPanoramaReady(StreetViewPanorama), aby uzyskać identyfikator obiektu StreetViewPanorama.
  3. Wywołaj getStreetViewPanoramaAsync() we fragmencie, aby zarejestrować wywołanie zwrotne.

Poniżej znajdziesz więcej informacji o każdym kroku.

Dodaj fragment

Dodaj element <fragment> do pliku układu aktywności, aby zdefiniować obiekt Fragment. W tym elemencie ustaw dla atrybutu class wartość com.google.android.gms.maps.StreetViewPanoramaFragment (lub SupportStreetViewPanoramaFragment).

Oto przykład fragmentu w pliku układu:

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

Dodaj kod Street View

Aby korzystać z panoramy Street View w aplikacji, musisz wdrożyć interfejs OnStreetViewPanoramaReadyCallback i ustawić instancję wywołania zwrotnego w obiekcie StreetViewPanoramaFragment lub StreetViewPanoramaView. W tym samouczku używamy StreetViewPanoramaFragment, ponieważ jest to najprostsza metoda dodawania Street View do aplikacji. Pierwszym krokiem jest wdrożenie interfejsu wywołania zwrotnego:

Java


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

Kotlin


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

W metodzie onCreate() metody Activity ustaw plik układu jako widok treści. Jeśli na przykład plik układu ma nazwę main.xml, użyj tego kodu:

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)
    val streetViewPanoramaFragment =
        supportFragmentManager
            .findFragmentById(R.id.street_view_panorama) as SupportStreetViewPanoramaFragment
    streetViewPanoramaFragment.getStreetViewPanoramaAsync(this)
}

Uchwyć fragment, wywołując FragmentManager.findFragmentById(), przekazując mu identyfikator zasobu elementu <fragment>. Zwróć uwagę, że identyfikator zasobu R.id.streetviewpanorama jest automatycznie dodawany do projektu na Androida podczas tworzenia pliku układu.

Następnie użyj wywołania getStreetViewPanoramaAsync(), aby ustawić wywołanie zwrotne we fragmencie.

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)

Aby pobrać niepuste wystąpienie StreetViewPanorama, które jest gotowe do użycia, użyj metody wywołania zwrotnego onStreetViewPanoramaReady(StreetViewPanorama).

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)
}

Więcej informacji o konfigurowaniu stanu początkowego

W przeciwieństwie do mapy nie można skonfigurować początkowego stanu Street View w formacie XML. Można ją jednak skonfigurować automatycznie, przesyłając obiekt StreetViewPanoramaOptions zawierający określone opcje.

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)
)

Więcej o StreetViewPanoramaFragment

StreetViewPanoramaFragment to podklasa klasy Android Fragment i pozwala umieścić panoramę Street View we fragmencie Androida. Obiekty StreetViewPanoramaFragment pełnią funkcję kontenerów i umożliwiają dostęp do obiektu StreetViewPanorama.

Widok Street View

StreetViewPanoramaView, podklasa klasy Android View, umożliwia umieszczenie panoramy Street View w Androidzie View. View reprezentuje prostokątny obszar ekranu i jest podstawowym elementem składowym aplikacji i widżetów na Androida. Podobnie jak StreetViewPanoramaFragment, StreetViewPanoramaView pełni funkcję kontenera na panoramę, ujawniając główną funkcję za pomocą obiektu StreetViewPanorama. Użytkownicy tej klasy muszą przekazać wszystkie metody cyklu życia aktywności (takie jak onCreate(), onDestroy(), onResume() i onPause())) do odpowiednich metod z klasy StreetViewPanoramaView.

Dostosowywanie funkcji kontrolowanych przez użytkownika

Domyślnie w widoku Street View użytkownik ma do dyspozycji następujące funkcje: panorama, powiększenie i podróżowanie do sąsiednich. Możesz włączać i wyłączać gesty kontrolowane przez użytkownika za pomocą metod w StreetViewPanorama. Zautomatyzowane zmiany są nadal możliwe, nawet gdy gest jest wyłączony.

Ustaw lokalizację panoramy

Aby ustawić lokalizację panoramy Street View, wywołaj StreetViewPanorama.setPosition(), przekazując LatLng. Parametry radius i source możesz też przekazywać jako parametry opcjonalne.

Promień jest przydatny, gdy chcesz poszerzyć lub zawęzić zakres, dla którego Street View będzie szukać pasującej panoramy. Promień 0 oznacza, że panorama musi być dokładnie połączona z określoną wartością LatLng. Domyślny promień to 50 metrów. Jeśli w obszarze dopasowania jest więcej niż jedna panorama, API zwróci najlepsze dopasowanie.

Źródło jest przydatne, jeśli chcesz ograniczyć widok Street View do zdjęć panoramicznych znajdujących się na zewnątrz. Domyślnie widoki Street View mogą się znajdować w takich miejscach jak muzea, budynki publiczne, kawiarnie i firmy. Pamiętaj, że w przypadku danej lokalizacji mogą nie być dostępne panoramy na zewnątrz.

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)

Możesz też ustawić lokalizację na podstawie identyfikatora panoramy, przekazując panoId do StreetViewPanorama.setPosition().

Aby pobrać identyfikator sąsiednich panoram, najpierw użyj metody getLocation() do pobrania StreetViewPanoramaLocation. Ten obiekt zawiera identyfikator bieżącej panoramy i tablicę obiektów StreetViewPanoramaLink, z których każdy zawiera identyfikator połączony z bieżącą.

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)
}

Powiększanie i pomniejszanie

Poziom powiększenia możesz zmienić automatycznie przy użyciu ustawienia StreetViewPanoramaCamera.zoom. Ustawienie powiększenia na 1,0 powoduje powiększenie obrazu o współczynniku 2.

Fragment kodu poniżej wykorzystuje fragment StreetViewPanoramaCamera.Builder(), aby utworzyć nowy aparat z pochyleniem i pozycją istniejącego aparatu, a jednocześnie zwiększyć powiększenie o pięćdziesiąt procent.

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()

Ustawianie orientacji kamery (punkt widzenia)

Orientację kamery Street View możesz określić, ustawiając odpowiednio pochylenie i nachylenie StreetViewPanoramaCamera.

dźwigając
Kierunek, w którym kamera jest skierowana, podana w stopniach od prawej do prawej, w pobliżu jej położenia. Prawdziwa północ to 0, wschód – 90, południe – 180, zachód – 270.
przechyl
Oś Y przechyla do góry lub do dołu. Zakres wynosi od -90 do 90, gdzie -90 to widok pionowy, 0 jest wyśrodkowany na horyzoncie, a 90 to pionowy. Wariant jest mierzony z początkowego domyślnego ustawienia kamery, czyli często (choć nie zawsze) płaskiego poziomego poziomu. Na przykład obraz wykonany na wzgórzu prawdopodobnie będzie miał domyślny ton, który nie jest poziomy.

Fragment kodu poniżej wykorzystuje StreetViewPanoramaCamera.Builder(), aby stworzyć nowy aparat z powiększeniem i kątem nachylenia istniejącej kamery o 30 stopni zmieniający się w lewo.

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()

Ten fragment kodu przechyla kamerę w górę o 30 stopni.

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()

Animacja ruchu kamery

Aby animować ruchy kamery, wywołaj StreetViewPanorama.animateTo(). Animacja nakłada się na bieżące atrybuty kamery. Jeśli chcesz przejść bezpośrednio do kamery bez animacji, możesz ustawić czas trwania na 0.

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)

Poniższa ilustracja przedstawia wynik, jeśli zgodnie z harmonogramem animacja powyżej ma być uruchamiana co 2000 milisekund za pomocą Handler.postDelayed():

Demonstracja animacji Street View