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 udostępnia panoramiczne widoki z wyznaczonych dróg w całej okolicy.

Ten film pokazuje, jak używać Street View, aby zapewnić użytkownikom rzeczywiste wrażenia z adresu na mapie, co pozwoli im poznać ich kontekst i poznać miejsca, które ich interesują.

Zasięg dostępny w interfejsie API Map Google na Androida w wersji 2 jest taki sam 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 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 na GitHubie zawiera przykłady, które pokazują użycie Street View.

Przykładowe treści w języku Java:

Przykład w Kotlinie:

Omówienie Street View w pakiecie Maps SDK na Androida

Maps SDK na Androida zapewnia usługę Street View służącą do pobierania i manipulowania zdjęciami używanymi w Google Street View. Zdjęcia są zwracane jako panoramy.

Każda panorama Street View to zdjęcie (lub zbiór zdjęć), które zapewnia pełny widok 360 stopni z jednego miejsca. Obrazy są zgodne z odwzorowaniem walcowym równoodległościowym (Plate Carrée), które obejmuje 360 stopni widoku poziomego (pełnego) i 180 stopni w pionie (od prawej do dołu). Powstała panorama 360° definiuje projekcję na sferze, a obraz pakuje do dwuwymiarowej powierzchni tej kuli.

StreetViewPanorama udostępnia przeglądarkę, która renderuje panoramę jako sferę z kamerą pośrodku. Elementem sterującym StreetViewPanoramaCamera możesz sterować powiększeniem i orientacją (wychylenia i obrotu) kamery.

Pierwsze kroki

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

Biblioteka klienta pakietu SDK Usług Google Play zawiera kilka próbek Street View, które możesz zaimportować do swojego projektu i użyć ich do programowania. Zapoznaj się z wprowadzeniem.

Korzystanie z interfejsu API

Aby dodać panoramę Street View do fragmentu Androida, wykonaj poniższe instrukcje. To najprostsza metoda dodania Street View do aplikacji. Następnie przeczytaj więcej o fragmentach i widokach danych oraz o dostosowywaniu orientacji.

Dodawanie widoku Street View

Aby dodać panoramę Street View, wykonaj te czynności:

Demonstracja Street View

Podsumowanie:

  1. Do obiektu Aktywność dodaj obiekt Fragment, który będzie obsługiwać panorama Street View. Najłatwiej zrobić to, dodając element <fragment> do pliku układu Activity.
  2. Zaimplementuj interfejs OnStreetViewPanoramaReadyCallback i użyj metody wywołania zwrotnego onStreetViewPanoramaReady(StreetViewPanorama), aby uzyskać nick do obiektu StreetViewPanorama.
  3. Wywołaj getStreetViewPanoramaAsync() w tym 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 w atrybucie 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 swojej aplikacji, musisz zaimplementować interfejs OnStreetViewPanoramaReadyCallback i ustawić instancję wywołania zwrotnego obiektu StreetViewPanoramaFragment lub StreetViewPanoramaView. W tym samouczku używamy StreetViewPanoramaFragment, ponieważ jest to najprostsza metoda dodania 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 ActivityonCreate() 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)
}

Aby uzyskać identyfikator tego fragmentu, wywołaj element FragmentManager.findFragmentById(), podając go jako identyfikator zasobu elementu <fragment>. Zwróć uwagę, że identyfikator zasobu R.id.streetviewpanorama jest dodawany automatycznie do projektu na Androida podczas tworzenia pliku układu.

Następnie użyj wywołania getStreetViewPanoramaAsync() do wywołania zwrotnego danego fragmentu.

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)

Użyj metody wywołania zwrotnego onStreetViewPanoramaReady(StreetViewPanorama), aby pobrać nieustawioną instancję StreetViewPanorama, która jest gotowa do użycia.

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, przekazują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 informacji o Street ViewPanoramaFragment

StreetViewPanoramaFragment to podklasa klasy Android Fragment i umożliwia umieszczenie Panoramy w Street View we fragmencie Androida. Obiekty StreetViewPanoramaFragment działają jako kontenery na potrzeby widoku panoramicznego i zapewniają dostęp do obiektu StreetViewPanorama.

Widok Street View

StreetViewPanoramaView, podkategoria klasy Android View, umożliwia umieszczenie widoku Street View w Androidzie View. Element View reprezentuje prostokątny obszar ekranu i stanowi podstawowy element konstrukcji aplikacji i widżetów na Androida. Podobnie jak StreetViewPanoramaFragment, StreetViewPanoramaView działa jako kontener na potrzeby panoramicznego dostępu do obiektu podstawowego przez obiekt StreetViewPanorama. Użytkownicy tej klasy muszą przekazać wszystkie metody cyklu życia aktywności (takie jak onCreate(), onDestroy(), onResume() i onPause()) do odpowiednich metod w klasie StreetViewPanoramaView).

Dostosowywanie funkcji kontrolowanej przez użytkownika

Domyślnie użytkownik oglądający panoramę Street View ma do dyspozycji te funkcje: przesunięcie, powiększenie i podróż do sąsiednich widoków. Gesty kontrolowane przez użytkownika możesz włączać i wyłączać za pomocą metod w StreetViewPanorama. Po wyłączeniu gestu zmiany automatyczne są nadal możliwe.

Ustaw lokalizację zdjęcia panoramicznego

Aby ustawić lokalizację widoku Street View, wywołaj metodę StreetViewPanorama.setPosition() z przekazem LatLng. Możesz też przekazać parametry radius i source jako parametry opcjonalne.

Promień jest przydatny, jeśli chcesz rozszerzyć lub zawęzić obszar, w którym Street View będzie szukać pasującej panoramy. Promień 0 oznacza, że panorama musi być połączona z określonym miejscem LatLng. Domyślny promień to 50 metrów. Jeśli występuje więcej niż 1 panorama w pasującym obszarze, interfejs API zwróci najlepsze dopasowanie.

Źródło jest przydatne, gdy chcesz ograniczyć widok Street View tylko do zdjęć sferycznych na zewnątrz. Domyślnie widoki Street View można znaleźć w obiektach takich jak muzea, budynki publiczne, kawiarnie i firmy. Pamiętaj, że w przypadku określonej lokalizacji mogą nie istnieć widoki zewnętrzne.

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 panoramicznego, przesyłając właściwość panoId do StreetViewPanorama.setPosition().

Aby pobrać identyfikator panorama z sąsiednich widoków, najpierw użyj polecenia getLocation(), aby pobrać StreetViewPanoramaLocation. Ten obiekt zawiera identyfikator bieżącej panorama i tablicę obiektów StreetViewPanoramaLink, z których każdy zawiera identyfikator połączonej z bieżącą panoramą.

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 lub pomniejszanie

Poziom powiększenia możesz zmienić automatycznie przez ustawienie opcji StreetViewPanoramaCamera.zoom. Jeśli ustawisz powiększenie na 1,0, powiększysz obraz o 2.

Fragment kodu z poniższego fragmentu kodu korzysta z StreetViewPanoramaCamera.Builder(), aby stworzyć nowy aparat z pochyleniem i pozycją dotychczasowej kamery, a jednocześnie zwiększa 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)

Aby określić orientację aparatu Street View, ustaw w StreetViewPanoramaCamera położenie i pochylenie.

łożysko
Kierunek, w którym kamera jest skierowana w kierunku ruchu wskazówek zegara od prawej do północy, wokół kierunku kamery. Rzeczywista północna to 0, wschód to 90, południe to 180, zachodnia to 270.
przechyl
Oś Y przechyla się w górę lub w dół. Zakres od -90 do 90 Wariant jest mierzony z początkowego domyślnego ustawienia kamery, które często (ale nie zawsze) płasko w poziomie. Na przykład zdjęcie zrobione na wzgórzu może mieć domyślną wartość, która nie jest pozioma.

Fragment kodu z kolei wykorzystuje StreetViewPanoramaCamera.Builder() do stworzenia nowego aparatu z powiększeniem i pochyleniem istniejącej kamery, a jednocześnie zmienia kąt nachylenia o 30 stopni 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()

Fragment poniżej przechyla aparat o 30 stopni w górę.

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

Animowanie ruchu kamery

Aby animować ruchy kamery, wywołaj StreetViewPanorama.animateTo(). Animacja współdziała z bieżącymi i nowymi atrybutami aparatu. 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, gdy zaplanujesz wyświetlanie powyższej animacji co 2000 milisekund (Handler.postDelayed()):

Prezentacja animacji w Street View