Questa pagina contiene informazioni sulle funzionalità chiave delle mappe 3D fotorealistiche in Maps JavaScript che ti consentono di creare esperienze 3D interattive e immersive. La seguente documentazione riguarda:
- Gestire gli eventi dell'interfaccia utente per un'interazione senza interruzioni.
- Sono inclusi i controlli di esplorazione per la navigazione negli spazi 3D.
- Utilizzo di percorsi della fotocamera preimpostati per le visite guidate.
- Applicazione di limitazioni alla videocamera per mantenere l'attenzione su un'area specifica.
Eventi dell'interfaccia utente
Questa sezione illustra gli eventi interattivi e le notifiche di modifica dello stato che puoi ascoltare e gestire in modo programmatico quando lavori con le mappe 3D. JavaScript all'interno del browser è basato su eventi, il che significa che risponde alle interazioni degli utenti generando eventi che il programma può ascoltare ed eseguire il codice di conseguenza.
Esistono due tipi principali di eventi:
- Gli eventi di interazione utente (ad esempio i clic del mouse) vengono propagati dal viewport della mappa 3D al codice. Questi eventi ti consentono di rispondere alle azioni dirette degli utenti all'interno dell'ambiente della mappa 3D. Visualizza sample.
- Le notifiche relative alla modifica dello stato riflettono gli aggiornamenti ai modelli di dati delle mappe 3D sottostanti e allo stato di rendering, utilizzando uno schema di denominazione
property_changedconvenzionale.
Ogni oggetto dell'API di mappatura 3D espone un insieme di eventi denominati per i quali il programma può registrare ascoltatori di eventi ed eseguire la logica quando si verificano questi eventi utilizzando la funzione addEventListener() integrata. L'esempio seguente illustra gli eventi comuni attivati quando un utente interagisce con una mappa 3D.
L'esempio seguente mostra quali eventi vengono attivati quando un utente interagisce con la mappa:
Controlli di esplorazione
Le mappe visualizzate nelle mappe 3D fotorealistiche nell'API Maps JavaScript contengono elementi dell'interfaccia utente che supportano l'interazione dell'utente con la mappa. Questi elementi sono noti come controlli utente. I controlli di esplorazione sono inclusi per impostazione predefinita, ma puoi scegliere di eliminarli nella tua applicazione.
L'immagine seguente mostra i controlli predefiniti visualizzati dalle mappe 3D fotorealistiche in Maps JavaScript:
Di seguito è riportato l'elenco completo dei controlli nelle mappe 3D fotorealistiche in JavaScript di Maps:
- Il controllo zoom mostra i pulsanti "+" e "-" per modificare il livello di zoom della mappa.
- Il controllo inclinazione ti consente di modificare l'inclinazione della fotocamera.
- Il controllo di rotazione ti consente di modificare l'orientamento della fotocamera.
- Il controllo di spostamento mostra i pulsanti "←", "→", "↑" e "↓" per cambiare il centro della mappa.
Controlli della fotocamera e animazione
Percorsi della fotocamera preimpostati
Le mappe 3D fotorealistiche in Maps JavaScript forniscono due percorsi della fotocamera preimpostati. I percorsi della videocamera possono essere personalizzati modificando la durata dell'animazione (aumentando o diminuendo la velocità) o combinandoli per creare esperienze più cinematografiche.
Le mappe 3D fotorealistiche in Maps JavaScript supportano i seguenti percorsi della fotocamera:
- L'animazione
FlyCameraTovola dal centro della mappa a una destinazione specificata. - L'animazione
FlyCameraAroundruota attorno a un punto sulla mappa per il numero di volte specificato.
I due percorsi disponibili possono essere combinati per volare fino a un punto d'interesse, ruotarlo e poi fermarsi quando vuoi.
Limitazioni della fotocamera
Potresti voler controllare la panoramica della fotocamera, l'altitudine massima o creare limiti lat/lng che limitino il movimento di un utente in una determinata mappa. Puoi farlo utilizzando le limitazioni della fotocamera.
Per un esempio di come funzionano e vengono implementate le limitazioni delle videocamere, guarda la demo.