Home Arrow Icon Knowledge base Arrow Icon Global Arrow Icon Reacționează cod de exemplu de grafic


Reacționează cod de exemplu de grafic


Iată câteva exemple de biblioteci React Charting cu caracteristicile și exemplele lor respective:

1. React Chartjs 2

- Caracteristici: diverse tipuri de diagrame precum linie, bar, plăcintă și multe altele.
- Exemple:
- Grafic de bare verticale
- grafic de bare orizontale
- grafic de bare stivuite
- Grafic de bar grupat
- Graficul zonei
- Grafic de linie
- Grafic de linie multiaxis
- Grafic de plăcintă
- Grafic de gogoși
- Graficul zonei polare
- Diagrama radar
- Grafic de împrăștiere
- Diagrama cu bule
- graficul multitype
- Evenimente grafic
- Graficul Ref
- grafic gradient

#########React Google Charts
- Caracteristici: diverse tipuri de diagrame precum zonă, bar, bule și multe altele.
- Exemple:
- Graficul zonei
- grafic de bar
- Diagrama cu bule
- Calendar
- Diagrama de lumânări
- Diagrama coloanei
- Grafic combo
- Gantt
- Gauge
- Graficul Geo
- Histogramă
- Grafic de linie
- grafic org
- Grafic de plăcintă
- Sankey
- Grafic de împrăștiere
- Grafic în zona în trepte
- Tabel
- Cronologie
- Harta copacilor
- Arbore de cuvânt
- Animații
- Editor de diagrame
- Controluri
- interacțiuni
- Aspect
- Foaie de calcul
- bara de instrumente

3. Apexcharts.js

- Caracteristici: diverse tipuri de diagrame precum linie, coloană, bară, plăcintă și multe altele.
- Exemple: include codul sursă pentru toate exemplele pentru a economisi timp de dezvoltare.

1. Canvasjs

- Caracteristici: diagrame interactive, receptive cu animație, zoom, panoramare, evenimente, export, foraj și actualizări în timp real.
- Exemple:
- Graficele de linie
- diagrame de linie spline și pas
- Graficele de zonă
- Zona spline, zona stivuită, zona stivuită 100, zona de trepte, zona de gamă și graficele de zonă spline
- Graficele de coloane
- Graficele de bare
- Coloana stivuită, coloana stivuită 100%, coloana de rază, bara stivuită, bara stivuită 100%, bara de gamă și graficele cascadei
- diagrame de plăcintă
- diagrame de gogoși / gogoși
- diagrame de pâlnie și piramidă
- diagrame de sfeșnic și OHLC
- Diagrame de împrăștiere și bule
- diagrame cu cutie și bici
- Graficele de linie de eroare și eroare
- diagrame dinamice
- Graficele de stocuri cu selectorul de gamă, navigator și mai multe diagrame

5. Tanstack/React-Charts

- Caracteristici: diverse tipuri de diagrame precum linie, bară, bule și multe altele.
- Exemple: Include exemple pentru simplă, linie, bară, bule, zonă, stiluri personalizate, scule personalizate, opțiuni de axe, mod întunecat, spumant, moduri de perie, grupă, opțiuni de instrumente și multe altele.

Aceste biblioteci oferă exemple și șabloane ample pentru a vă ajuta să începeți cu crearea de diagrame în aplicația dvs. React. Îl puteți alege pe cel care se potrivește cel mai bine nevoilor dvs. în funcție de tipurile de diagrame pe care doriți să le creați și de nivelul de personalizare de care aveți nevoie [1] [2] [3] [4] [5].

Citări:
[1] https://react-chartjs-2.js.org/examples/
[2] https://www.react-google-charts.com/examples
[3] https://apexcharts.com/react-chart-demos/
[4] https://canvasjs.com/react-charts/
[5] https://codesandbox.io/examples/package/react-charts