Teraz możesz zacząć pisać kod JavaScriptu w Earth Engine. Skopiuj poniższy kod do edytora kodu:
Edytor kodu (JavaScript)
// Instantiate an image with the Image constructor. var image = ee.Image('CGIAR/SRTM90_V4'); // Zoom to a location. Map.setCenter(-112.8598, 36.2841, 9); // Center on the Grand Canyon. // Display the image on the map. Map.addLayer(image);
U góry edytora kodu kliknij przycisk Uruchom i zobacz, że na mapie pojawi się bardzo szary obraz. Nie martw się, wkrótce będzie wyglądać lepiej. Jeśli składnia którejkolwiek części tego przykładu jest Ci nieznana, zapoznaj się z samouczkiem JavaScript w Earth Engine.
Konstruktor obrazów
Pierwszą nowością w tym przykładzie jest konstruktor obrazu
ee.Image(). Argumentem przekazanym do konstruktora jest identyfikator ciągu znaków obrazu w katalogu danych Earth Engine. (Pełną listę możliwych argumentów konstruktora obrazu znajdziesz na karcie Docs po lewej stronie edytora kodu. Karta Dokumenty zawiera najbardziej aktualne informacje o możliwościach Earth Engine).
Aby znaleźć identyfikator obrazu, wyszukaj go w katalogu danych Earth Engine za pomocą narzędzia wyszukiwania u góry Edytora kodu. Na przykład wpisz w polu wyszukiwania „elevation” i zwróć uwagę, że wyświetli się lista rastrów. Kliknij wpis „SRTM Digital Elevation Data Version 4”, aby wyświetlić więcej informacji o tym zbiorze danych. Po prawej stronie opisu zbioru danych znajduje się pole Identyfikator obrazu. Zwróć uwagę, że identyfikator obrazu w przykładzie jest skopiowany z identyfikatora obrazu widocznego w opisie zbioru danych.
Zamiast kopiować i wklejać identyfikatory obrazów, możesz użyć przycisku Importuj w opisie zbioru danych lub linku importuj po prawej stronie wyników wyszukiwania. Jeśli klikniesz link lub przycisk importu, w specjalnej sekcji o nazwie „Imports” u góry skryptu zostanie automatycznie utworzona zmienna. Aby zmienić nazwę zmiennej, kliknij ją w sekcji importów.
Konfigurowanie mapy
Drugą nową częścią tego przykładu jest wywołanie Map.setCenter(). Ta metoda obiektu Map, który reprezentuje wyświetlanie mapy w edytorze kodu, wyśrodkowuje mapę na podanej długości i szerokości geograficznej (w stopniach dziesiętnych) oraz na poziomie powiększenia, gdzie 1 oznacza oddalenie, tak aby mapa pokazywała całą powierzchnię Ziemi. Większe liczby powiększają obraz. Poznaj wszystkie metody obiektu Map, sprawdzając sekcję Mapa na karcie Dokumenty po lewej stronie edytora kodu.
Dodawanie warstwy do mapy
Ostatnia linia w przykładzie mówi: użyj metody MapobiektuaddLayer(), aby dodać obraz do wyświetlania mapy w edytorze kodu.
Gratulacje! Udało Ci się utworzyć pierwszy skrypt Earth Engine. W następnej sekcji dowiesz się, jak poprawić wygląd tego obrazu.
Dygresja: obrazy w Earth Engine
Obrazy w Earth Engine (więcej informacji znajdziesz na tej stronie) składają się z co najmniej 1 pasma. Każde pasmo na obrazie ma własną nazwę, wartości pikseli, rozdzielczość pikseli i projekcję. Jak wkrótce się przekonasz, obraz SRTM ma 1 pasmo: „elevation”.
Gdy dodajesz obraz do mapy za pomocą Map.addLayer(), Earth Engine musi określić, jak zmapować wartości w pasmach obrazu na kolory na wyświetlaczu. Jeśli do mapy zostanie dodany obraz jednopasmowy, Earth Engine domyślnie wyświetli pasmo w skali szarości, gdzie wartość minimalna jest przypisana do koloru czarnego, a wartość maksymalna do koloru białego.
Jeśli nie określisz wartości minimalnej i maksymalnej, Earth Engine użyje wartości domyślnych. Na przykład obraz, który właśnie został dodany do mapy, jest wyświetlany jako obraz w skali szarości rozciągnięty na pełny zakres danych lub jako 16-bitowa liczba całkowita ze znakiem [-32768, 32767]. (float pasma są domyślnie rozciągane do zakresu [0, 1], a byte pasma do zakresu [0, 255]).
Typ danych obrazu możesz sprawdzić, drukując go i sprawdzając obiekt obrazu na karcie Konsola. Na przykład wklej ten kod po poprzednim:
Edytor kodu (JavaScript)
print('SRTM image', image);
Po kliknięciu „Uruchom” w konsoli pojawi się obiekt. Aby sprawdzić właściwości obiektu, rozwiń go, klikając ikonę z suwakiem (
) po lewej stronie obiektu lub właściwości. Rozwiń obiekt obrazu, właściwość „bands”, pasmo „elevation” w indeksie „0” i właściwość „data_type” pasma „elevation”, aby dowiedzieć się, że jest to typ danych signed int16.
Dostosowywanie wizualizacji warstwy
Aby zmienić sposób rozciągania danych, możesz podać inny parametr w wywołaniu funkcji Map.addLayer(). Drugi parametr, visParams, umożliwia określenie minimalnej i maksymalnej wartości do wyświetlenia. Aby dowiedzieć się, jakich wartości użyć, otwórz kartę Inspekcja i klikaj różne miejsca na mapie, aby poznać zakres wartości pikseli. Możesz też użyć menedżera warstw, aby interaktywnie rozciągać dane, a potem obserwować wartości minimalne i maksymalne odpowiadające rozciągnięciom percentyli lub odchylenia standardowego. Załóżmy, że w wyniku takich eksperymentów stwierdzisz, że dane powinny być rozciągnięte do zakresu [0, 3000]. Aby wyświetlić obraz w tym zakresie, użyj tego kodu:
Edytor kodu (JavaScript)
Map.addLayer(image, {min: 0, max: 3000}, 'custom visualization');
Pamiętaj, że parametr visParams jest obiektem, którego właściwości określają min i max. (Więcej informacji o obiektach JavaScript znajdziesz w samouczku JavaScript lub w tym zewnętrznym materiale referencyjnym). Pamiętaj, że trzeci parametr funkcji Map.addLayer()
to nazwa warstwy wyświetlana w menedżerze warstw. Wynik powinien wyglądać podobnie do tego na rysunku 1. Najedź kursorem na pole Warstwy po prawej stronie, aby zobaczyć efekt zmiany nazwy tej warstwy.
Aby wyświetlić pojedyncze pasmo za pomocą palety kolorów, dodaj właściwość palette do obiektu visParams:
Edytor kodu (JavaScript)
Map.addLayer(image, {min: 0, max: 3000, palette: ['blue', 'green', 'red']}, 'custom palette');
Wynik powinien wyglądać podobnie jak na rysunku 2.
Dygresja: palety
Palety umożliwiają ustawienie schematu kolorów dla obrazów jednopasmowych. Paleta to lista ciągów znaków kolorów oddzielonych przecinkami, które są interpolowane liniowo między wartościami maksymalną i minimalną w parametrach wizualizacji (lub wartościami domyślnymi w zależności od typu pasma, jak opisano wcześniej). Na przykład piksele o wartości mniejszej lub równej wartości minimalnej będą wyświetlane w pierwszym kolorze na liście, a piksele o wartości większej lub równej wartości maksymalnej będą wyświetlane w ostatnim kolorze na liście. Kolory pośrednie są liniowo rozciągane do pośrednich wartości pikseli.
Kolory są zdefiniowane za pomocą standardowego schematu wartości kolorów CSS (więcej informacji znajdziesz w tym zewnętrznym materiale). Kolory można określać za pomocą nazwy lub jako ciągi szesnastkowe wskazujące kombinację czerwieni, zieleni i błękitu. Najniższa wartość na dowolnej z 3 pozycji to 00 (odpowiadająca liczbie dziesiętnej 0), a najwyższa to FF (odpowiadająca liczbie dziesiętnej 255). Ciąg znaków „000000” oznacza kolor czarny, „FFFFFF” – biały, „FF0000” – czerwony, „00FF00” – zielony, a „0000FF” – niebieski. Więcej informacji znajdziesz w sekcji dotyczącej palet kolorów. Inne rozciągnięcia są możliwe dzięki użyciu opisów warstw stylizowanych, jak opisano w tej sekcji.
W dalszej części tego samouczka dowiesz się, jak wyświetlać obrazy wielopasmowe. Najpierw jednak przejdź na następną stronę, aby dowiedzieć się, jak wykonywać obliczenia na obrazach.