Earth Engine cung cấp quyền truy cập vào các tiện ích giao diện người dùng (UI) phía máy khách thông qua gói ui. Sử dụng gói ui để tạo giao diện đồ hoạ cho tập lệnh Earth Engine. Các giao diện này có thể bao gồm các tiện ích đầu vào đơn giản như nút và hộp đánh dấu, các tiện ích phức tạp hơn như biểu đồ và bản đồ, bảng điều khiển để kiểm soát bố cục của giao diện người dùng và trình xử lý sự kiện cho các hoạt động tương tác giữa các tiện ích giao diện người dùng. Khám phá toàn bộ chức năng của API ui trong thẻ Tài liệu ở bên trái Trình soạn thảo mã. Ví dụ sau đây sử dụng gói ui để minh hoạ các hàm cơ bản để tạo tiện ích, xác định hành vi khi người dùng nhấp vào tiện ích và hiển thị tiện ích.
Xin chào mọi người!
Ví dụ này thể hiện giao diện người dùng đơn giản của một nút hiển thị trong bảng điều khiển. Khi nhấp vào nút này, dòng chữ "Hello, world!" (Xin chào thế giới!) sẽ được in ra bảng điều khiển:
// 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);
Trước tiên, hãy quan sát rằng nút được tạo bằng một đối số duy nhất: nhãn của nút. Tiếp theo, hàm onClick() của nút sẽ được gọi. Đối số cho onClick() là một hàm khác sẽ được chạy mỗi khi người dùng nhấp vào nút. Cơ chế của một hàm được gọi (hàm "gọi lại") khi một sự kiện xảy ra được gọi là "trình xử lý sự kiện" và được sử dụng rộng rãi trong thư viện giao diện người dùng. Trong ví dụ này, khi người dùng nhấp vào nút, hàm sẽ in "Hello, world!" (Xin chào thế giới!) vào bảng điều khiển.
Khả năng biến đổi
Lưu ý rằng không giống như các đối tượng trong không gian tên ee.*, các đối tượng trong không gian tên ui.* có thể thay đổi. Vì vậy, bạn không cần chỉ định lại đối tượng cho một biến mỗi khi gọi hàm thực thể trên đối tượng. Bạn chỉ cần gọi hàm này để thay đổi (thay đổi) tiện ích. Việc nối mã sau vào ví dụ trước sẽ dẫn đến việc đăng ký một lệnh gọi lại khác cho sự kiện nhấp của nút:
// Set another callback function on the button. button.onClick(function() { print('Oh, yeah!'); });
Sao chép mã này vào cuối ví dụ trước rồi nhấp vào Run (Chạy). Bây giờ, khi bạn nhấp vào nút này, cả hai thông báo sẽ được in vào bảng điều khiển.
Hãy sử dụng các trang về giao diện người dùng để tìm hiểu thêm về cách tạo giao diện người dùng cho tập lệnh Earth Engine. Trang Tiện ích cung cấp một hướng dẫn trực quan và mô tả chức năng cơ bản của các tiện ích trong gói ui. Trang Bảng điều khiển và bố cục mô tả các vùng chứa và bố cục cấp cao nhất mà bạn có thể sử dụng để sắp xếp và bố trí các tiện ích. Trang Sự kiện có thông tin chi tiết về cách định cấu hình hành vi và hoạt động tương tác của các tiện ích trong giao diện người dùng.