DEV Community

Cover image for How to use Chart.js in React
Harshil Parmar
Harshil Parmar

Posted on • Updated on

How to use Chart.js in React

Liquid syntax error: Variable '{{ labels: props.chartLabels, datasets: [ { data: props.chartData, label: "Activity", borderColor: "#3333ff", fill: true, backgroundColor: "#CAA6DB", }' was not properly terminated with regexp: /\}\}/

Top comments (10)

Collapse
 
wolfdominion profile image
Hannah

Thanks for making a clear and well-documented tutorial. Super helpful!

Collapse
 
harshilparmar profile image
Harshil Parmar

I glad you liked it 😊

Collapse
 
sakhnyuk profile image
Michael Sakhniuk

Nice article πŸ‘

To get highlighted code in Markdown you can do like this:
code example

Collapse
 
harshilparmar profile image
Harshil Parmar

Thanks...!! I'm glad you liked it πŸ˜€ I will use that markdown in next article.

Collapse
 
dance2die profile image
Sung M. Kim

There is also an Editor Guide for more comprehensive examples (embeding youtube, codesandbox etc) you could check out~

Thread Thread
 
harshilparmar profile image
Harshil Parmar

Thanks !!!

Collapse
 
uma profile image
Uma

This is amazing. I was always curious about how charts works from scratch? This article is definitely helpful.

Collapse
 
harshilparmar profile image
Harshil Parmar

I glad you like it πŸ™Œ

Collapse
 
phutngo profile image
Phu Ngo

What are your thoughts on using react wrapper vs using chartjs directly?

Collapse
 
harshilparmar profile image
Harshil Parmar

Sorry for late reply @phutngo. Sorry I don't have an idea regarding React wrapper.