ReactJS and ChartJS

Whatis ChartJS?
Chart.js is a chart library that is available as a client-side JavaScript package. There are also derivatives for other frontend frameworks, like React, Vue, and Angular. It displays the chart on an HTML canvas element.

Quick Start

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

Then, import and use individual components:

import { Doughnut } from 'react-chartjs-2';<Doughnut data={...} />

After this quick start is done, create a component and add the following boiler plate for the Doughnut Chart.

If you need to work with a different graph chart all you need to change the Doughnut to Bar, Pie, Line.

--

--

Software Engineer / Full-Stack Developer in Ruby, Ruby on Rails, JavaScript, ReactJS, Redux, SQL, HTML5, CSS3

Love podcasts or audiobooks? Learn on the go with our new app.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Luis Castillo

Luis Castillo

13 Followers

Software Engineer / Full-Stack Developer in Ruby, Ruby on Rails, JavaScript, ReactJS, Redux, SQL, HTML5, CSS3