Como criar um inspetor de camadas vetoriais no Google Earth Engine

Iago Mendes
OLAB Learning
Published in
6 min readJan 25, 2024

Aprenda a implementar esta funcionalidade e enriqueça ainda mais suas aplicações.

Introdução

O Google Earth Engine (GEE) transformou-se em uma ferramenta indispensável para a análise de dados geoespaciais, oferecendo uma riqueza de recursos para profissionais da área.

Um desses recursos, frequentemente subestimado, é o inspetor nativo do Code Editor, localizado no painel à direita, na aba Inspector.

Independentemente de você ser um usuário experiente do GEE ou estar apenas começando sua jornada com essa ferramenta, este artigo foi feito pensando em você. Aqui, não apenas vou detalhar as funcionalidades do Inspector, como também vou orientar você, etapa por etapa, na criação do seu próprio inspetor personalizado.

A função do Inspector

Ao clicar em Inspector, logo você se depara com a mensagem “Click on the map to inspect the layers”, ou “Clique no mapa para inspecionar as camadas”. E é exatamente isso que ele permite que você faça. Simples assim.

Ao inspecionar camadas raster, a partir da escala atual do mapa, o Inspector retorna o valor do pixel em cada banda nas coordenadas geográficas do ponto clicado.

Resultado da inspeção de camadas raster.

Para camadas vetoriais, o processo é semelhante. Veja como os resultados são apresentados:

Resultado da inspeção de camadas vetoriais.

O Inspector apresenta as informações em dois ou três níveis de informação, a depender do tipo de camada que está sendo inspecionada.

  • Point: fornece informações sobre o ponto clicado, como as coordenadas geográficas, e informações sobre o mapa, como o nível de zoom e a escala.
  • Pixels: fornece informações sobre as camadas raster inspecionadas, como o valor do pixel em cada banda nas coordenadas do ponto clicado.
  • Objects: fornece informações sobre os objetos ee que intersectam o ponto clicado.

Na imagem acima, veja como as propriedades da camada “Layer 1” são reveladas, permitindo uma análise mais aprofundada ao expandir os detalhes.

No desenvolvimento de aplicações, funcionalidades que simulam o Inspector são frequentemente requisitadas. Um exemplo é o app Protected Areas — Legal Amazon, que usa uma implementação alternativa do Inspector para fornecer informações sobre as áreas protegidas na Amazônia Legal.

Implementando o inspetor

Após entendermos a função do Inspector no GEE, vamos nos aprofundar em sua implementação. Neste artigo, focaremos nas camadas vetoriais, que são fundamentais em muitas análises geoespaciais.

Este será o resultado do passo a passo apresentado neste artigo:

Exibição das informações da camada vetorial que está sendo mostrada no mapa.

Começaremos com o carregamento dos dados da coleção World Database on Protected Areas (WDPA), disponíveis no catálogo de dados do GEE. Nosso objetivo é carregar e filtrar esses dados para se concentrar nas áreas protegidas do estado do Amazonas, selecionando um subconjunto específico de propriedades.

var columns = [
'NAME',
'DESIG',
'STATUS YR',
'IUCN_CAT',
'REP_AREA'
];

var protectedAreas = ee.FeatureCollection('WCMC/WDPA/current/polygons')
.filter(ee.Filter.eq('ISO3', 'BRA'))
.filter(ee.Filter.stringEndsWith('SUB_LOC', 'AM'))
.select(columns);

Map.addLayer(protectedAreas);
Map.centerObject(protectedAreas);

A seguir, vamos criar o painel de informações e adicioná-lo ao mapa:

var infoPanel = ui.Panel();

infoPanel.style().set({
whiteSpace: 'pre',
position: 'middle-left'
});

Map.widgets().add(infoPanel);

Agora, criaremos uma função de callback que será disparada toda vez que o usuário clicar no mapa. O registro da função de callback é feito pelo método onClick.

function inspect(coords) {
print('coords', coords);
}

Map.onClick(inspect);

Neste ponto, ao executar o código, perceberá que algumas informações são mostradas no Console a cada clique no mapa. Isso acontece porque print('coords', coords) é a única instrução da função inspect.

OK, agora que sabemos que onClick nos permite registrar uma função de callback que é disparada quando clicamos no mapa, e que essa função recebe um objeto que contém as coordenadas do ponto clicado, vamos adicionar um pouco mais de utilidade à função inspect:

function inspect(coords) {
var lon = coords.lon;
var lat = coords.lat;

var clickedPoint = ee.Geometry.Point([lon, lat]);

var filtered = protectedAreas.filterBounds(clickedPoint);

print('filtered', filtered);
}

A versão atualizada de inspect transforma as coordenadas do ponto clicado em um objeto ee.Geometry.Point, filtra a coleção de dados protectedAreas a partir desse ponto com filterBounds e mostra o resultado no Console.

Para alcançarmos nosso objetivo, precisaremos inserir as informações que estão sendo mostradas no Console em nosso painel de informações infoPanel.

function inspect(coords) {
var lon = coords.lon;
var lat = coords.lat;

var clickedPoint = ee.Geometry.Point([lon, lat]);

var selectedFeature = protectedAreas.filterBounds(clickedPoint);

selectedFeature.evaluate(function(selectedFeature) {
// Verifica se há alguma feição no ponto clicado.
if (selectedFeature.features.length > 0) {
// Caso positivo, seleciona a primeira feição.
var protectedArea = selectedFeature.features[0];

// Obtém as propriedades da primeira feição.
var properties = protectedArea.properties;

// Inicializa a lista que armazenará as informações.
var rows = [];

// Itera sobre as chaves (nomes das propriedades) do objeto properties.
Object.keys(properties).forEach(function(property) {
// Obtém o valor da propriedade.
var value = properties[property];

// Cria uma Label com a formatação "Nome da Propriedade: Valor"
var row = ui.Label(property + ': ' + value);

// Adiciona a Label à lista rows.
rows.push(row);
});

// Adiciona as informações no painel de informações.
infoPanel.widgets().reset(rows);
} else {
// Mostra mensagem no painel quando nenhuma feição for selecionada.
infoPanel.widgets().reset([ui.Label('No feature selected.')]);
}
});
}

Aqui, a novidade está no uso do evaluate para processar os dados de forma assíncrona no lado do cliente. Falo um pouco mais sobre o uso do evaluate no artigo Earth Engine Apps: Gerenciador de Camadas [Pt. 1/n].

Para finalizarmos, vamos às explicações:

  • if (selectedFeature.features.length > 0): verifica se o usuário clicou em um ponto onde há áreas protegidas.
  • var protectedArea = selectedFeature.features[0]: caso o teste anterior retorne true, seleciona a primeira feição retornada com [0] e armazena o resultado na variável protectedArea.
  • var properties = protectedArea.properties: acessa as propriedades da feição selecionada anteriormente e armazena o resultado na variável properties.
  • var rows = []: inicializa uma lista vazia.
  • Object.keys(properties): retorna um Array com as chaves do objeto properties.
  • forEach(): usado para iterar sobre o Arrayobtido anteriormente.
  • var value = properties[property] acessa o objeto properties e extrai o valor da chave property.
  • var row = ui.Label(property + ': ' + value) cria uma Label no formato "Nome da Propriedade: Valor" (e.g., NAME: Alto Rio Negro).
  • rows.push(row) adiciona row à lista rows.
  • infoPanel.widgets().reset(rows) substitui as informações do infoPanel pelo conteúdo de rows.
  • else {} define o bloco de código que será executado caso selectedFeature.features.length > 0 seja false.
  • infoPanel.widgets().reset([ui.Label('No feature selected')]) mostra a mensagem “No feature selected” no painel.

Assim, chegamos ao final de mais um artigo da série de desenvolvimento de Apps no Google Earth Engine.

Dúvidas? Encontrou algum erro? Sinta-se à vontade para deixar suas perguntas e considerações nos comentários.

Script | Siga @olablearning

--

--