Aqui estão alguns exemplos de bibliotecas de gráficos do React com seus respectivos recursos e exemplos:
1. React ChartJs 2
- Recursos: vários tipos de gráficos, como linha, barra, torta e muito mais.- Exemplos:
- gráfico de barras verticais
- gráfico de barras horizontais
- gráfico de barras empilhadas
- gráfico de barras agrupadas
- gráfico de área
- gráfico de linha
- gráfico de linha multiaxis
- gráfico de pizza
- gráfico de donut
- gráfico de área polar
- gráfico de radar
- gráfico de dispersão
- gráfico de bolhas
- gráfico multitutype
- Eventos de gráfico
- Gráfico ref
- gráfico de gradiente
2. React Google Gráficos
- Recursos: vários tipos de gráficos, como área, bar, bolha e muito mais.- Exemplos:
- gráfico de área
- gráfico de barras
- gráfico de bolhas
- Calendário
- gráfico de velas
- gráfico de coluna
- gráfico de combinação
- Gantt
- Medidor
- gráfico geo
- Histograma
- gráfico de linha
- gráfico de org
- gráfico de pizza
- Sankey
- gráfico de dispersão
- gráfico de área escalonada
- Mesa
- Linha do tempo
- mapa de árvores
- Árvore de palavras
- Animações
- Editor de gráficos
- Controles
- Interações
- layout
- Planilha
- Barra de ferramentas
3. ApexCharts.js
- Recursos: vários tipos de gráficos, como linha, coluna, barra, torta e muito mais.- Exemplos: inclui código -fonte para todos os exemplos para economizar tempo de desenvolvimento.
4. Canvasjs
- Recursos: gráficos interativos e responsivos com animação, zoom, panning, eventos, exportação, perfuração e atualizações em tempo real.- Exemplos:
- gráficos de linha
- gráficos de linhas de spline e etapa
- gráficos de área
- Área de spline, área empilhada, área empilhada 100, área de etapa, área de alcance e gráficos de área de spline de gama
- gráficos de colunas
- gráficos de barras
- Coluna empilhada, coluna empilhada 100%, coluna de alcance, barra empilhada, barra empilhada 100%, barra de alcance e gráficos de cascata
- gráficos de pizza
- gráficos de donuts / donuts
- gráficos de funil e pirâmide
- gráficos de velas e OHLC
- Gráficos de dispersão e bolhas
- gráficos de caixa e bigode
- Gráficos da linha de erro e erro
- gráficos dinâmicos
- gráficos de estoque com seletor de alcance, navegador e vários gráficos
5. TanStack/React-Charts
- Recursos: vários tipos de gráficos, como linha, barra, bolha e muito mais.- Exemplos: Inclui exemplos para simples, linha, barra, bolha, área, estilos personalizados, dicas de ferramentas personalizadas, opções de eixo, modo escuro, brilho, escovação, modos de agrupamento, opções de dica de ferramentas e muito mais.
Essas bibliotecas fornecem exemplos e modelos extensos para ajudá -lo a começar a criar gráficos no seu aplicativo React. Você pode escolher o que melhor atende às suas necessidades com base nos tipos de gráficos que deseja criar e no nível de personalização que você precisa [1] [2] [3] [4] [5].
Citações:[1] https://react-cartjs-2.js.org/examples/
[2] https://www.react-google-charts.com/examples
[3] https://apexcharts.com/react-chart-dmoss/
[4] https://canvasjs.com/react-charts/
[5] https://codesandbox.io/examples/package/react-charts