Nakładki na powierzchnię

Wybierz platformę: Android iOS JavaScript

Nakładki naziemne to nakładki obrazu powiązane ze współrzędnymi szerokości i długości geograficznej, więc można je przesuwać i powiększać.

Przykładowe fragmenty kodu

Repozytorium ApiDemos w GitHubie zawiera próbkę pokazującą nawierzchnie:

Wprowadzenie

Nakładka naziemna to obraz osadzony na mapie. W przeciwieństwie do znaczników nakładki na powierzchni są kierowane na powierzchnię Ziemi, a nie na ekran, więc jej obrócenie, przechylenie lub powiększenie spowoduje zmianę orientacji obrazu. Nakładki naziemne są przydatne, gdy chcesz poprawić jeden obraz w jednym miejscu na mapie. Jeśli chcesz dodać rozbudowane zdjęcia obejmujące dużą część mapy, możesz użyć nakładki z fragmentami mapy.

Dodaj nakładkę

Aby dodać obiekt GroundOverlay, utwórz obiekt GroundOverlayOptions, który określa zarówno obraz, jak i pozycję. Opcjonalnie możesz określić dodatkowe ustawienia wpływające na położenie obrazu na mapie. Po zdefiniowaniu niezbędnych opcji przekaż obiekt do metody GoogleMap.addGroundOverlay(), aby dodać obraz do mapy. Metoda addGroundOverlay() zwraca obiekt GroundOverlay. Jeśli chcesz zmodyfikować go później, musisz zachować odwołanie do niego.

Krok po kroku:

  1. Utwórz instancję nowego obiektu GroundOverlayOptions
  2. Określ obraz jako BitmapDescriptor.
  3. Określ pozycję obrazu, korzystając z jednej z dostępnych metod:
    • position(LatLng location, float width, float height)
    • position(LatLng location, float width)
    • positionFromBounds(LatLngBounds bounds)
  4. W razie potrzeby ustaw dowolne opcjonalne właściwości, takie jak transparency.
  5. Zadzwoń do firmy GoogleMap.addGroundOverlay(), aby dodać obraz do mapy.

Poniższy przykład pokazuje, jak dodać nakładkę ground do istniejącego obiektu GoogleMap.

Java


LatLng newarkLatLng = new LatLng(40.714086, -74.228697);

GroundOverlayOptions newarkMap = new GroundOverlayOptions()
    .image(BitmapDescriptorFactory.fromResource(R.drawable.newark_nj_1922))
    .position(newarkLatLng, 8600f, 6500f);
map.addGroundOverlay(newarkMap);

Kotlin


val newarkLatLng = LatLng(40.714086, -74.228697)
val newarkMap = GroundOverlayOptions()
    .image(BitmapDescriptorFactory.fromResource(R.drawable.newark_nj_1922))
    .position(newarkLatLng, 8600f, 6500f)
map.addGroundOverlay(newarkMap)

Jeśli po dodaniu mapy do mapy chcesz ją zmienić lub usunąć, pamiętaj o utrzymaniu obiektu GroundOverlay. Później możesz zmodyfikować nakładkę, wprowadzając zmiany w tym obiekcie.

Java


// Add an overlay to the map, retaining a handle to the GroundOverlay object.
GroundOverlay imageOverlay = map.addGroundOverlay(newarkMap);

Kotlin


// Add an overlay to the map, retaining a handle to the GroundOverlay object.
val imageOverlay = map.addGroundOverlay(newarkMap)

Usuwanie nakładki

Nakładkę ziemię możesz usunąć, korzystając z metody GroundOverlay.remove().

Java


imageOverlay.remove();

Kotlin


imageOverlay?.remove()

Zmienianie nakładki

Po dodaniu obrazu do mapy możesz zmienić obraz naziemny metodą GroundOverlay.setImage(BitmapDescriptor).

Java


// Update the GroundOverlay with a new image of the same dimension
imageOverlay.setImage(BitmapDescriptorFactory.fromResource(R.drawable.newark_nj_1922));

Kotlin


// Update the GroundOverlay with a new image of the same dimension

// Update the GroundOverlay with a new image of the same dimension
imageOverlay?.setImage(BitmapDescriptorFactory.fromResource(R.drawable.newark_nj_1922))

Metoda setImage() zastąpi istniejący obraz innym obrazem o tych samych wymiarach.

Umieszczanie nakładki naziemnej

Pozycja nakładki na powierzchnię można określić na dwa sposoby:

  • Użycie LatLng do wyśrodkowania nakładki i wymiarów w metrach do określenia rozmiaru obrazu.
  • Atrybut LatLngBounds pozwala określić północno-wschodni i południowy zachód.

Zanim dodasz nakładkę mapy do mapy, musisz określić jej położenie.

Określaj położenie obrazu za pomocą lokalizacji

Podczas dodawania obrazu określasz LatLng, do którego kotwica ma być przymocowana, i szerokość nakładki (w metrach). anchor jest domyślnie środkiem obrazu. Opcjonalnie możesz podać wysokość nakładki (w metrach). Jeśli wysokość nakładki nie zostanie podana, zostanie ona automatycznie obliczona tak, aby zachować proporcje obrazu.

Poniższy kod umieszcza obraz na pozycji 40.714086, -74.228697 8,6 km szerokości i 6,5 km wysokości. Obraz jest zakotwiczony w lewym dolnym rogu.

Java


GroundOverlayOptions newarkMap = new GroundOverlayOptions()
    .image(BitmapDescriptorFactory.fromResource(R.drawable.newark_nj_1922))
    .anchor(0, 1)
    .position(new LatLng(40.714086, -74.228697), 8600f, 6500f);

Kotlin


val newarkMap = GroundOverlayOptions()
    .image(BitmapDescriptorFactory.fromResource(R.drawable.newark_nj_1922))
    .anchor(0f, 1f)
    .position(LatLng(40.714086, -74.228697), 8600f, 6500f)

Ustawianie położenia obrazu za pomocą LatLngBounds

Podajesz LatLngBounds zawierające obraz. Obiekt LatLngBounds ustawia północny wschód i zachód od obrazu. Po narysowaniu obrazu zostanie on obrócony tak, aby mieścił się w granicach. Jeśli granice nie będą zgodne z pierwotnym współczynnikiem proporcji, obraz będzie zniekształcony.

Wymieniony poniżej kod umieszcza obraz na mapie z rogiem południowego zachodu do 40.712216,-74.22655 oraz z północno-wschodnim narożnikiem 40.773941, -74.12544.

Java


LatLngBounds newarkBounds = new LatLngBounds(
    new LatLng(40.712216, -74.22655),       // South west corner
    new LatLng(40.773941, -74.12544));      // North east corner
GroundOverlayOptions newarkMap = new GroundOverlayOptions()
    .image(BitmapDescriptorFactory.fromResource(R.drawable.newark_nj_1922))
    .positionFromBounds(newarkBounds);

Kotlin


val newarkBounds = LatLngBounds(
    LatLng(40.712216, -74.22655),  // South west corner
    LatLng(40.773941, -74.12544)   // North east corner
)
val newarkMap = GroundOverlayOptions()
    .image(BitmapDescriptorFactory.fromResource(R.drawable.newark_nj_1922))
    .positionFromBounds(newarkBounds)

Powiąż dane z nawierzchnią

Możesz wywołać GroundOverlay.setTag(), aby zapisać dowolny obiekt danych z nakładką gruntową i pobrać obiekt danych za pomocą GroundOverlay.getTag().

Ten przykładowy kod przechowuje opis ciągu z nakładką ziemi:

Java


GroundOverlay sydneyGroundOverlay = map.addGroundOverlay(new GroundOverlayOptions()
    .image(BitmapDescriptorFactory.fromResource(R.drawable.harbour_bridge))
    .position(new LatLng(-33.873, 151.206), 100)
    .clickable(true));

sydneyGroundOverlay.setTag("Sydney");

Kotlin


val sydneyGroundOverlay = map.addGroundOverlay(
    GroundOverlayOptions()
        .image(BitmapDescriptorFactory.fromResource(R.drawable.harbour_bridge))
        .position(LatLng(-33.873, 151.206), 100f)
        .clickable(true)
)
sydneyGroundOverlay?.tag = "Sydney"

Oto kilka przykładowych sytuacji, w których można przechowywać i pobierać dane za pomocą nakładek lądowych:

  • Twoja aplikacja może zaspokoić różne potrzeby w zakresie nakładek podstawowych, dlatego musisz traktować je w inny sposób, gdy użytkownik je kliknie.
  • Być może wchodzisz w interakcję z systemem, który ma unikalne identyfikatory rekordów, w których nakładki reprezentują określone rekordy w tym systemie.
  • Dane nakładki mogą wskazywać priorytet określania kolejności nakładania elementów.

Obsługa nakładek na powierzchni

Domyślnie nakładek naziemnych nie można klikać. Aby włączyć lub wyłączyć klikalność, wywołaj funkcję GroundOverlay.setClickable(boolean).

Aby odsłuchiwać zdarzenia kliknięcia za pomocą klikalnej nakładki na powierzchni, użyj narzędzia OnGroundOverlayClickListener. Aby ustawić ten detektor na mapie, wywołaj GoogleMap.setOnGroundOverlayClickListener(OnGroundOverlayClickListener). Gdy użytkownik kliknie nakładkę na powierzchni ziemię, otrzymasz wywołanie zwrotne onGroundOverlayClick(GroundOverlay).