Earth Engine fornisce l'accesso ai widget dell'interfaccia utente (UI) lato client tramite il pacchetto ui
. Utilizza il pacchetto ui
per creare interfacce grafiche per i tuoi script di Earth Engine. Queste interfacce possono includere semplici widget di input come pulsanti e caselle di controllo, widget più complessi come grafici e mappe, riquadri per controllare il layout dell'interfaccia utente e gestori di eventi per le interazioni tra i widget dell'interfaccia utente. Esplora la funzionalità completa dell'API ui
nella scheda
Documentazione sul lato sinistro dell'editor di codice. L'esempio seguente utilizza
il pacchetto ui
per illustrare le funzioni di base per creare un widget, definire
il comportamento quando l'utente fa clic sul widget e visualizzarlo.
Ciao mondo!
Questo esempio mostra una semplice interfaccia utente di un pulsante visualizzato nella console. Se fai clic sul pulsante, il messaggio "Hello, world!" viene stampato nella console:
// Make a button widget. var button = ui.Button('Click me!'); // Set a callback function to run when the // button is clicked. button.onClick(function() { print('Hello, world!'); }); // Display the button in the console. print(button);
Tieni presente che innanzitutto il pulsante viene creato con un unico argomento: l'etichetta. Successivamente, viene chiamata la funzione onClick()
del pulsante. L'argomento per
onClick()
è un'altra funzione che verrà eseguita ogni volta che viene fatto clic sul pulsante. Questo meccanismo di una funzione da chiamare (una funzione di "callback") quando si verifica un
evento è chiamato "gestore eventi" ed è ampiamente utilizzato nella libreria dell'interfaccia utente. In questo
esempio, quando si fa clic sul pulsante, la funzione stampa "Hello, world!" nella console.
Mutabilità
Tieni presente che, a differenza degli oggetti nello spazio dei nomi ee.*
, gli oggetti nello spazio dei nomi
ui.*
sono mutabili. Di conseguenza, non è necessario riassegnare l'oggetto a una variabile ogni volta che chiami una funzione di istanza sull'oggetto. La semplice chiamata della funzione consente di modificare il widget. Se aggiungi il seguente codice all'esempio precedente, viene registrato un altro callback per l'evento di clic del pulsante:
// Set another callback function on the button. button.onClick(function() { print('Oh, yeah!'); });
Copia questo codice alla fine dell'esempio precedente e fai clic su Esegui. Ora quando fai clic sul pulsante, entrambi i messaggi vengono stampati nella console.
Utilizza le pagine UI per scoprire di più sulla creazione di interfacce utente per i tuoi script Earth Engine. La
pagina Widget offre un tour visivo e descrive le funzionalità di base
dei widget nel pacchetto ui
. La pagina Pannelli
e layout descrive i contenitori e i layout di primo livello che puoi utilizzare per organizzare
e disporre i widget. La pagina Eventi contiene dettagli sulla configurazione del comportamento e dell'interazione dei widget nell'interfaccia utente.