A biblioteca Chart.js é uma das mais populares bibliotecas open-source JavaScript para visualização de dados. Não tem tantos recursos quanto D3.js, mas é muito mais simples. Oferece oito tipos de gráficos pré-configurados, responsivos, interativos e animados. É indicada para quem precisa rapidamente publicar visualizações de dados sem precisar enfrentar a acentuada curva de aprendizado do D3.js. Este curso prático explora mostra como criar gráficos interativos com Chart.js, e incorpora-los em aplicações e páginas Web. Os gráficos são apresentados utilizando dados simples e dados públicos reais, disponibilizados em formatos como CSV, XML e JSON.
O curso abrange Chart.js versão 2.
Ao final do curso o aluno deverá ser capaz de:
- Usar dados de repositórios públicos (CSV, JSON) para construir gráficos
- Criar um gráfico de barras simples usando Chart.js
- Manipular arrays e estruturas de dados com JavaScript para que possam ser usados em gráficos do Chart.js
- Construir gráficos usando dados públicos
- Criar gráficos de linha e de área empilhada
- Criar gráficos de torta/pizza, doughnut, radar e área polar
- Criar scatterplots e bubble charts
- Configurar escalas e eixos
- Configurar fontes, cores e layout
- Configurar transições, interatividade, animações e tooltips
- Usar e criar plugins e extensões
- Integrar Chart.js com aplicações Vue.js ou React.js
Este curso é destinado a programadores JavaScript.
- Introdução à Visualização de Dados
- Tecnologias essenciais: HTML5 Canvas e ES2015
- Trabalhando com formatos de dados: CSV e JSON
- Introdução prática a Chart.js
- Gráficos de barras vertical e horizontal
- Gráficos de linha e de área
- Gráficos radiais: área polar e radar
- Gráficos de torta/pizza e doughnut
- Gráficos de dispersão e de bolha
- Escalas, eixos e legendas
- Cores e fontes
- Eventos, interatividade e atualização de dados
- Transições, animação e tooltips
- Plugins
- Integração com frameworks de SPA (React.js ou Vue.js)
![()<>[]{}](../images/argo_logo.svg){kind=logo}
