This video is available to students only
Displaying data in a chart
Configuring a chart to display summary information about the data
Now we'll add a chart to the page to display the data as a line graph. We'll use the free AG Charts library. First install the dependencies.
1
npm i ag-charts-community ag-charts-react
After installing the dependencies, add a state variable to hold the chart data coming from the API.
1
const [chartData, setChartData] = useState<any[]>([]);
Store the data in the variable when the API is successful.
1
setRawData(res.data);
2
setChartData(res.chartData);
This page is a preview of Building Advanced Admin Reporting in React