Gráfico incrível.js
Uma lista com curadoria de coisas incríveis relacionadas ao Chart.js
- Recursos
- Gráficos
- Plug-ins
- Adaptadores
- Integrações
- Ferramentas
Suporte a Chart.js. Existem três versões principais do Chart.js atualmente em uso. Consulte os emblemas de versão abaixo para verificar se uma biblioteca oferece suporte à sua versão do Chart.js. (Além disso, "❕" significa que uma versão não é suportada.)
- Chart.js v. 4️⃣ – lançado em novembro de 2022
- Chart.js v. 3️⃣ – lançado em abril de 2021
- Chart.js v. 2️⃣ — lançado em abril de 2016
Recursos
- Guia Oficial | O guia do usuário e site de documentação.
Gráficos
| Apoiar | Nome | Descrição |
|---|
| 2️⃣ ❕ ❕ | funil de barra | Adiciona tipo de gráfico de funil de barras |
| 2️⃣3️⃣4️⃣ | boxplot | Adiciona tipo de gráfico boxplot e violin plot |
| 2️⃣3️⃣4️⃣ | barras de erro | Adiciona diversas variantes de barras de erro de tipos de gráficos padrão |
| 2️⃣3️⃣❕ | financeiro | Adiciona tipos de gráficos financeiros, como castiçal |
| ❕3️⃣4️⃣ | funil | Adiciona tipo de gráfico de funil |
| 2️⃣3️⃣4️⃣ | localização geográfica | Adiciona tipos de gráficos de mapas geográficos, como coroplético e mapa de bolhas |
| 2️⃣3️⃣4️⃣ | gráfico | Adiciona tipos de gráficos, como gráfico direcionado à força |
| 2️⃣3️⃣4️⃣ | matriz | Adiciona tipo de gráfico de matriz |
| 2️⃣3️⃣4️⃣ | PCP | Adiciona tipo de gráfico de coordenadas paralelas |
| ❕3️⃣4️⃣ | sankey | Adiciona tipo de gráfico de diagrama sankey |
| 2️⃣ ❕ ❕ | ferreiro | Adiciona tipo de gráfico Smith |
| 2️⃣3️⃣4️⃣ | empilhado100 | Desenha um gráfico de barras 100% empilhado |
| 2️⃣3️⃣4️⃣ | mapa de árvore | Adiciona tipo de gráfico de mapa de árvore |
| ❕3️⃣4️⃣ | Venn | Adiciona tipo de gráfico Venn e Euler |
| ❕3️⃣4️⃣ | nuvem de palavras | Adiciona tipo de gráfico de nuvem de palavras |
Plug-ins
Estilo
| Apoiar | Nome | Descrição |
|---|
| ❕3️⃣4️⃣ | cores automáticas | Geração automática de cores |
| 2️⃣ ❕ ❕ | esquemas de cores | Permite coloração automática usando esquemas de cores predefinidos |
| ❕3️⃣4️⃣ | gradiente | Gradientes fáceis |
| 2️⃣ ❕ ❕ | duro | Desenha gráficos em um estilo esboçado e desenhado à mão usando Rough.js |
| 2️⃣ ❕ ❕ | estilo | Oferece opções de estilo, como efeitos de sombra, chanfro, brilho ou sobreposição |
| ❕ ❕ 4️⃣ | pilha de tempo | Adiciona formatação de escala de tempo opinativa com divisões de tempo "legais" |
Características
| Apoiar | Nome | Descrição |
|---|
| 2️⃣3️⃣4️⃣ | anotação | Desenha linhas, caixas, pontos, rótulos, polígonos e elipses na área do gráfico |
| 2️⃣3️⃣❕ | mira | Adiciona uma mira de dados aos gráficos de linhas e de dispersão |
| 2️⃣3️⃣4️⃣ | rótulos de dados | Exibe rótulos em dados para qualquer tipo de gráfico |
| 2️⃣ ❕ ❕ | rótulo de donut | Exibir um rótulo de texto no centro de um gráfico de rosca |
| 2️⃣3️⃣4️⃣ | hierárquico | Adiciona escalas hierárquicas que podem ser recolhidas, expandidas e focadas |
| ❕ ❕ 4️⃣ | rótulo de imagem | Exibe rótulos de imagem em dados para gráficos de rosca |
| 2️⃣ ❕ ❕ | rótulos externos do gráfico de pizza | Exibe rótulos fora de um gráfico de pizza/rosquinha |
| 2️⃣ ❕ ❕ | regressão | Calcular e desenhar regressões estatísticas (linhas de tendência) |
| ❕ ❕ 4️⃣ | linha de tendência | Desenhe linhas de tendência |
| 2️⃣ ❕ ❕ | cachoeira | Permite o uso fácil de gráficos em cascata |
Interações
| Apoiar | Nome | Descrição |
|---|
| ❕ ❕ 4️⃣ | lenda a11y | Fornece acessibilidade de teclado para legendas de gráficos |
| ❕3️⃣4️⃣ | chart2music | Melhora a acessibilidade do gráfico com navegação e sonificação do teclado |
| 2️⃣3️⃣4️⃣ | adiado | Adia a atualização inicial do gráfico até que o gráfico role para a janela de visualização |
| 2️⃣3️⃣4️⃣ | arrastar dados | Permite que os usuários arrastem pontos de dados no gráfico |
| 2️⃣3️⃣4️⃣ | ampliar | Permite zoom e panorâmica em gráficos |
Fontes de dados
| Apoiar | Nome | Descrição |
|---|
| 2️⃣3️⃣4️⃣ | fonte de dados-prometheus | Exibe séries temporais do Prometheus |
| 2️⃣3️⃣❕ | transmissão | Adiciona suporte para dados de streaming ao vivo |
Além disso, muitos plugins podem ser encontrados no registro npm.
Adaptadores
| Apoiar | Nome | Descrição |
|---|
| 2️⃣3️⃣4️⃣ | data-fns | adaptador data-fns |
| 2️⃣3️⃣4️⃣ | dia js | adaptador dayjs |
| 2️⃣3️⃣4️⃣ | Luxon | Adaptador Luxon |
| 2️⃣3️⃣4️⃣ | momento | Adaptador Moment.js |
| ❕3️⃣4️⃣ | espaço-tempo | Adaptador espaço-tempo |
Integrações
JavaScript
| Apoiar | Nome | Descrição |
|---|
| 2️⃣ ❕ ❕ | gráfico ember-cli | Ember CLI |
| ❕ ❕ 4️⃣ | gráficos_frescos | Fresco |
| 2️⃣ ❕ ❕ | lwcc | Componente Web do Lightning |
| 2️⃣3️⃣4️⃣ | gráficos ng2 | Angular v2+ |
| 2️⃣3️⃣❕ | gráfico omi | Omi |
| 2️⃣3️⃣4️⃣ | react-chartjs-2 | Reagir |
| ❕3️⃣4️⃣ | gráfico sólido js | SolidJs |
| ❕3️⃣4️⃣ | esbelto-chartjs | Esbelto |
| 2️⃣3️⃣4️⃣ | vue-chartjs | Vue.js |
Outros
| Apoiar | Nome | Descrição |
|---|
| ❕3️⃣ ❕ | BlazorChartjs | Blazor |
| ❕3️⃣4️⃣ | pax.BlazorChartJs | Blazor (com isolamento de JavaScript) |
| 2️⃣3️⃣4️⃣ | charba | GWT/J2CL |
| 2️⃣ ❕ ❕ | gráfico.java | Java |
| ❕ ❕ 4️⃣ | modelo chartjs-java | Java |
| 2️⃣ ❕ ❕ | chartjs-ocaml | OCaml |
| 2️⃣3️⃣❕ | chartjs-ror | Ruby, simplifica o uso de Chart.js em visualizações Rails |
| ❕3️⃣4️⃣ | gráfico-js-rs | Chart.js digita API em Rust (WIP em Alpha/incompleto) |
| 2️⃣ ❕ ❕ | Django-chartjs | Django |
| figma | Componentes de design |
| 2️⃣3️⃣4️⃣ | ipychart | Pitão |
| 2️⃣3️⃣4️⃣ | laravel-chartjs | Laravel |
| 2️⃣ ❕ ❕ | liquidificar | Visualização rápida e multithread de dados de fluxo com Angular |
| 2️⃣ ❕ ❕ | nova-chartjs | Laravel Nova |
| 2️⃣3️⃣4️⃣ | gráfico rápido | API Web para gráficos estáticos |
| 2️⃣ ❕ ❕ | gráficos perversos | Wrapper para aplicativos da web Java |
| ❕3️⃣ ❕ | symfony/ux-chartjs | Pacote Symfony UX |
Ferramentas
| Apoiar | Nome | Descrição |
|---|
| ❕3️⃣ ❕ | xhub | Extensão de navegador para Chart.js (e mais) nas páginas do GitHub |
