Pierwsze kroki z funkcją 3D Area Explorer

obraz

Omówienie

Narzędzie 3D Area Explorer to zupełnie nowy sposób odkrywania i poznawania miejsc. To rozwiązanie wykorzystuje możliwości Realistycznego kafelka 3D w Google Maps Platform oraz interfejsu Places API do tworzenia atrakcyjnych, interaktywnych środowisk 3D.

Narzędzie 3D Area Explorer służy do różnych celów:

  • Ulepszenie możliwości zwiedzania okolic: użytkownicy mogą wirtualnie zwiedzać okolice z dużą ilością szczegółów wizualnych oraz uzyskiwać informacje o lokalnych funkcjach i miejscach orientacyjnych.

  • Promowanie treści opartych na lokalizacji: możliwość dodawania punktów zainteresowania z bogatymi opisami umożliwia tworzenie treści opartych na narracji, które edukują i informują użytkowników o konkretnych lokalizacjach.

  • Inspire development using Google Maps 3D capabilities: demonstrates the potential of Google's 3D mapping data for creating immersive, interactive maps

Pierwsze kroki:

Włącz

Kluczowe technologie

W tym rozwiązaniu wykorzystano 2 kluczowe technologie:

Interfejsy API Google Maps Platform:

Aby uzyskać mapę podstawową i dane potrzebne do stworzenia tej funkcji, używamy kilku interfejsów API z Google Maps Platform:

  • Realistyczne kafelki 3D w Mapach Google: modele 3D budynków i terenu o wysokiej rozdzielczości umożliwiają realistyczne i atrakcyjne wizualnie przedstawienie środowisk miejskich.
  • Places API: aplikacja może rozpoznawać i wyświetlać szczegółowe informacje o ciekawych miejscach w obszarze zwiedzania, wzbogacając wrażenia użytkownika o informacje o miejscowości.
  • Autouzupełnianie pomaga użytkownikom wyszukiwać konkretne lokalizacje lub obszary zainteresowań.

CesiumJS

CesiumJS odpowiada za renderowanie i wyświetlanie kuli ziemskiej 3D w wysokiej rozdzielczości. Odpowiada on za wczytywanie i wizualizację fotorealistycznych kafelków 3D Google, które stanowią trójwymiarowy model siatki budynków i terenu.

Zarządzanie kamerą: CesiumJS udostępnia narzędzia do kontrolowania pozycji, orientacji i ruchu kamery. Obejmuje to m.in.:

  • Początkowy punkt widzenia ustawiony na wskazaną okolicę po załadowaniu aplikacji.
  • Wdrożenie dynamicznych ruchów kamery, takich jak automatyczne animacje orbity do eksploracji.
  • obsługa interakcji użytkownika z globusem, jeśli są dostępne takie funkcje (przesuwanie, powiększanie, obracanie);

Dowiedz się, jak kafelki 3D ze zdjęciami 3D mogą działać z wykorzystaniem funkcji renderowania kafelków 3D.

Najważniejsze elementy

Aplikacja jest podzielona na dwie różne aplikacje:

  • Aplikacja Administratora
  • Aplikacja demonstracyjna

Ten diagram przedstawia różnice i zależności między tymi 2 aplikacją:

obraz

Warto dokładniej sprawdzić każdą aplikację:

Aplikacja administratora

Ma ona łatwy w użyciu interfejs, który umożliwia dostosowanie działania 3D:

  • Wyszukiwanie lokalizacji : użyj zintegrowanego paska wyszukiwania Autouzupełniania Google Maps Platform, aby znaleźć obszar, który chcesz wyświetlić. Po wybraniu lokalizacji kamera automatycznie przeniesie się do tego obszaru.

  • Kamera:dostosuj prędkość ruchu kamery i typ orbity, by utworzyć wybrany obraz.

  • Miejsca (POI): określ gęstość, promień wyszukiwania i typy punktów zainteresowania (np. restauracje, kawiarnie, zabytki), które chcesz uwzględnić.

Za pomocą tej aplikacji możesz dostosować sposób obsługi do potrzeb użytkowników.

Szczegółowy opis wszystkich opcji dostosowywania znajdziesz w artykule Dostosowywanie okna 3D Area Explorer.

Aplikacja demonstracyjna

To ostateczna aplikacja widoczna dla użytkowników, która wczytuje konfigurację utworzoną przez Ciebie w tej aplikacji. To immersyjne środowisko 3D pozwala użytkownikom przeglądać wybrane obszary i odkrywać miejsca, które zostały przez Ciebie oznaczone.

Po dostosowaniu wyglądu i stylu za pomocą aplikacji Admin możesz pobrać konfigurację i uruchomić aplikację niestandardową z kodu źródłowego.

Wygoda użytkowników

obraz

Oto niektóre z najważniejszych funkcji aplikacji:

  1. Użytkownicy mogą interaktywnie poznawać obszar w 3D, w tym budynki, punkty orientacyjne i teren.
  2. Użytkownicy mogą wyszukiwać i odkrywać pobliskie miejsca (np. muzea, parki, restauracje).
  3. Po wybraniu miejsca użytkownicy mogą wyświetlić szczegółowe informacje lub narracje związane z tą lokalizacją.

  4. Deweloperzy mogą spersonalizować eksplorację za pomocą ustawień i sterowania (jeśli korzystają z aplikacji Admin).

  5. Automatyczne obracanie jest włączone, co pozwala kamerze automatycznie obracać się wokół środka wybranego obszaru.

Wymagania wstępne

  1. Klucz interfejsu API Map Google: musisz mieć prawidłowy klucz interfejsu API z tymi interfejsami API włączonymi:

  2. Serwer WWW: aplikację możesz udostępniać z:

    • lokalny serwer WWW (np. Node.js, http-server);
    • Statyczna usługa hostingu WWW (do aplikacji jest dołączony plik Dockerfile).

Szczegółowy opis opcji wdrażania znajdziesz w sekcji readme projektu w GitHub.

Wdrożenie

Aplikację możesz wdrożyć jako aplikację węzła lub kontener Dockera w dowolnym środowisku kontenera, takim jak GKE czy GAE. Udostępnione demo korzysta z tej architektury:

obraz

  • W tej architekturze kod znajduje się w projekcie GitHub.
  • Cloud Build pobiera kod przy każdym wypchnięciu do głównej gałęzi i uruchamia operację kompilacji.
  • W ramach kompilacji wstrzykuje klucz interfejsu API i tworzy obraz, który jest następnie przechowywany w rejestrze artefaktów.
  • Na koniec wdroży najnowszy stabilny obraz z rejestru komponentów do Cloud Run.
  • Przeprowadzamy też kontrole stanu i monitorujemy stan wdrożonych aplikacji.

Informacje rozliczeniowe

Eksplorator obszarów 3D korzysta z usług Google Maps Platform, aby zapewnić realistyczne i dynamiczne wrażenia. Za korzystanie z niektórych interfejsów API mogą być naliczane opłaty. Oto omówienie interfejsów API i linki do cen.

Google Maps Platform – interfejs API mapek 3D:

Rozwiązanie Storytelling wykorzystuje interfejs 3D Tiles API, aby wzbogacić wizualnie dane geoprzestrzenne. Szczegółowe informacje o cenach interfejsu API 3D Tiles znajdziesz w artykule „Interfejs API 3D Tiles w Google Maps Platform – ceny”.

Google Maps Platform – interfejs Places API:

Interfejs Places API służy do uzyskiwania danych opartych na lokalizacji, dzięki czemu można wzbogacić opowiadanie o danym miejscu. Aby poznać koszty związane z interfejsem Places API,otwórz stronę „Google Maps Platform – Places API – ceny”.

Google Maps Platform – Autocomplete API:

Funkcja autouzupełniania ułatwia interakcję użytkowników. Szczegółowe informacje o cenach interfejsu Autocomplete API Map Google znajdziesz na stronie „Places Autocomplete API – ceny” w Google Maps Platform.

CesiumJS:

CesiumJS służy do wizualizacji kuli ziemskiej w 3D. CesiumJS to system open source, jednak związane z nimi dodatkowe funkcje lub usługi mogą wiązać się z kosztami. Informacje o ofercie premium znajdziesz w dokumentacji CesiumJS.

Koniecznie sprawdź szczegóły cen poszczególnych interfejsów API, ponieważ opłaty są ustalane indywidualnie na podstawie wykorzystania. Pamiętaj, że Google Maps Platform oferuje bezpłatny poziom z określoną ilością bezpłatnego wykorzystania, a szczegółowe ceny mogą się różnić w zależności od czynników takich jak liczba żądań i region.

Najdokładniejsze i najnowsze informacje o kosztach korzystania z Google Maps Platform i CesiumJS znajdziesz na oficjalnych stronach cenowych. Zapewnij zgodność z warunkami określonymi przez te usługi, aby skutecznie zarządzać i rozumieć powiązane wydatki.

Podsumowanie

W tym dokumencie znajdziesz omówienie możliwości, komponentów, interfejsu użytkownika i wymagań technicznych narzędzia Area Explorer 3D.

Dzięki fotorealistycznym kafelkom 3D i interfejsowi Places API od Google użytkownicy mogą wirtualnie zwiedzać okolice, odkrywać ciekawe miejsca i uczyć się historii lokalnych.

Niezależnie od tego, czy chcesz zaprezentować dany obszar, ułatwić eksplorację czy promować cyfrowe opowiadanie historii, możesz wykorzystać do tego narzędzie 3D Area Explorer, które zapewnia atrakcyjną wizualnie platformę.

Wypróbuj wersję demonstracyjną i dostosuj ją za pomocą aplikacji Admin, aby stworzyć atrakcyjne i pouczające środowisko 3D.