Skip to content

Latest commit

 

History

History
90 lines (55 loc) · 3.16 KB

README.md

File metadata and controls

90 lines (55 loc) · 3.16 KB
Raw

Worcap2019

Minicurso - Tecnologias Web para dashboards dinâmicos - explorando APIs TerraBrasilis para dados de desmatamento.

É praticamente impossível imaginar qualquer painel sem gráficos e tabelas. Eles apresentam estatísticas complexas de maneira rápida e eficaz. Além disso, um bom gráfico também aprimora o design geral do seu site.

Gráficos interativos

Permite alterar a perspectiva de análise filtrando as dimensões do dado diretamente nos gráficos.

Tecnologias para gráficos na Web

DCjs - uma escolha

Bom conjunto de componentes, integração com D3 + Crossfilter.

Componentes e exemplos de uso.

https://www.tutorialspoint.com/dcjs/dcjs_dashboard_working_example.htm

E os dados?

Dados dos programas de monitoramento da Amazônia e demais biomas, PRODES e DETER

Onde estão os dados? TerraBrasilis

Como obtê-los? via APIs ou Download direto dos dados em formato Shapefile, CSV...

Tecnologias para serviços de dados

Exemplo de consumo de dados

Transformando os dados em informações

Linguagens para Web:

  • HTML
  • CSS
  • JavaScript

Ferramentas e ambiente de desenvolvimento

  • Visual Studio Code ou outro editor de texto
  • Postman
  • DevTools - Painel de inspeção de códigos no navegador

Painéis gráficos

Dashboards TerraBrasilis

Construindo um dashboard simples

  • A estrutura básica de uma página

    HTML + JS + CSS

  • Incluindo as bibliotecas de gráficos
  • Lendo os dados
  • Normalizando os dados
  • Registrando as dimensões do dado no CrossFilter
  • Criando os componentes gráficos - consultar a documentação oficial para customizações.
  • Atribuindo as dimensões do dado às dimensões do gráfico
  • Finalmente desenhando
  • Labels, Legendas, ...

https://andre-carvalho.github.io/Worcap2019/dashboard.html