Os eventos de detecção de embarcações visualizados na interface web do Skylight incluem indicadores visuais de escala e orientação, conforme mostrado na captura de tela abaixo.

1. A orientação da bússola (em graus do norte verdadeiro) pode ser vista no canto superior esquerdo do chip de imagem
2. A escala (em quilômetros) pode ser vista no canto inferior esquerdo

Os metadados associados à orientação e escala do chip de imagem também estão disponíveis por meio da API do Skylight usando o ponto de extremidade de eventos .

Solicitação de API

Uma solicitação ao endpoint de eventos retornará um objeto Events , que pode opcionalmente incluir EventDetails para cada registro na resposta. Entre os campos que podem ser incluídos em EventDetails estão os seguintes:

1. metros_por_pixel (a escala da imagem)
2. orientação (orientação da bússola)

Abaixo está um exemplo de solicitação de API incluindo esses dois campos:

{query:
   events(eventTypes: [viirs], pageSize: 1, startTime: "2025-01-12T00:00:00Z")
   {
       items
       {
           event_id
           event_details {
               data_source
               meters_per_pixel
               orientation
           }
       }
   }
}

Resposta da API

A resposta à solicitação mostrada na seção anterior se parece com isto:

{
   "data": {
       "query": {
           "items": [
               {
                   "event_id": "VNP02DNB_NRT.A2025012.0000.002.2025012021107_-33.99_25.71805",
                   "event_details": {
                       "data_source": "nasa",
                       "meters_per_pixel": 86,
                       "orientation": 351
                   }
               }
           ]
       }
   }
}

No exemplo acima, a orientação é de 351 graus do norte, indicando uma orientação noroeste (um valor de orientação de zero indica o norte verdadeiro).

Exibição da interface do usuário

Usando os dados meters_per_pixel e orientation incluídos na resposta da API, você pode gerar suas próprias exibições de escala e orientação de bússola, semelhantes ao uso na interface da web do Skylight (conforme mostrado no início deste artigo).

Orientação

Você pode usar a propriedade rotate do CSS para controlar como a orientação é exibida, como neste exemplo:

      .rotate-180 {
       transform: rotate(180deg);
     }

No código de interface associado, a tag img relevante pode ser renderizada como no exemplo a seguir:

               <img
                src={directionImg}
                style={{
                  transform: `rotate(${eventDetails.orientation}deg)`,
                }}
                alt="compass"
                className="compass"
              />