Fernando Gomez
3 min readDec 5, 2019

What is React Chart Js?

React Chart Js is a tiny open-source library hosted on Github. It makes the process of making different types of charts easier by utilizing HTML5 canvas elements.

Advantages of using data visualization

Visualized Data Is Processed Faster

Visual content is processed much faster and easier than text. A study in Pennsylvania School of Medicine revealed that the human retina process data at 10 million bits per second.

Charts Support Visual Learners

Most of the population (65%) are visual learners

Different type of charts

Doughnut Pie

Line

Bar

Horizontal Bar

Radar

Polar

Scatter

Mixed data

How to install Chart Js on react step by step?

Step 1: Create a React application

npx create-react-app my-app

Step 2: Install the Chart Js library

npm install — save react-chartjs-2 chart.js

Step 3: Import Chart component on wherever component you want the chart to display by importing on the top of the component

Step 4: Get the data to display on the state of our application

Conclusion

Using charts on your application can make the information more appealing and easy to digest for your audience. And by using the Chart Js library creating charts takes just a few minutes.

No responses yet