Här är några exempel på React Charting -bibliotek med sina respektive funktioner och exempel:
1. React Chartjs 2
- Funktioner: Olika diagramtyper som linje, bar, paj och mer.- Exempel:
- Vertikalt stapeldiagram
- Horisontellt stapeldiagram
- staplat stapeldiagram
- Grupperad stapeldiagram
- områdesdiagram
- Linjediagram
- Multiaxis Line -diagram
- cirkeldiagram
- munkdiagram
- Polärt områdesdiagram
- radarkart
- spriddiagram
- Bubble Chart
- Multitipepe -diagram
- Diagramhändelser
- diagram ref
- Gradientdiagram
2. React Google -diagram
- Funktioner: Olika diagramtyper som område, bar, bubbla och mer.- Exempel:
- områdesdiagram
- bardiagram
- Bubble Chart
- kalender
- Ljusstake -diagram
- kolumndiagram
- kombinationsdiagram
- Gantt
- mätare
- Geo -diagram
- Histogram
- Linjediagram
- org -diagram
- cirkeldiagram
- Sankey
- spriddiagram
- stegad områdesdiagram
- tabell
- tidslinje
- Trädkarta
- ordträd
- Animationer
- Diagramredaktör
- kontroller
- interaktioner
- Layout
- kalkylblad
- verktygsfält
3. Apexcharts.js
- Funktioner: Olika diagramtyper som linje, kolumn, bar, paj och mer.- Exempel: Inkluderar källkod för alla exempel för att spara utvecklingstid.
4. Canvasjs
- Funktioner: Interaktiva, lyhörda diagram med animering, zoomning, panorering, evenemang, export, borrdown och realtidsuppdateringar.- Exempel:
- raddiagram
- Spline- och steglinjediagram
- områdesdiagram
.
- kolumndiagram
- bardiagram
.
- cirkeldiagram
- Donut / Donut -diagram
- Tratt- och pyramiddiagram
- Ljusstake och OHLC
- Sprid- och bubbeldiagram
- Box- och Whisker -diagram
- Fel- och fellinjediagram
- Dynamiska diagram
- Lagerdiagram med intervallväljare, navigator och flera diagram
5. Tanstack/React-Charts
- Funktioner: Olika diagramtyper som linje, bar, bubbla och mer.- Exempel: Inkluderar exempel för enkla, linje, bar, bubbla, område, anpassade stilar, anpassade verktygstips, axelalternativ, mörkt läge, mousserande, borstning, grupperingslägen, verktygstipalternativ och mer.
Dessa bibliotek ger omfattande exempel och mallar som hjälper dig att komma igång med att skapa diagram i din React -applikation. Du kan välja den som bäst passar dina behov baserat på de typer av diagram du vill skapa och den anpassningsnivå du behöver [1] [2] [3] [4] [5].
Citeringar:[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