This video is available to students only

Displaying data in a chart

Configuring a chart to display summary information about the data

Displaying data in a chart#

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.

After installing the dependencies, add a state variable to hold the chart data coming from the API.

Store the data in the variable when the API is successful.

Now we can add our chart component at the bottom of the return statement.

Note that the processChartData function merely converts the order_month value from a string to a proper JavaScript Date object.

 
No discussions yet