Let's take another step. What if we pull Chart.js in through NPM, and then leverage Browserify, so that we may write modern ES6+ code? Let's get started on that workflow in this episode.
Chart.js can automatically generate a chart "legend" for you; however, it's up to you to insert it into the DOM and add any applicable styling. I'll show you the basic workflow in this lesson.
Imagine that your boss assigns you the task of rendering a graph to display the company's monthly revenue. Well, it sounds like we'll need to perform the proper database query (which groups and sums the revenue for the month), and then we'll of course pass that data to our
graph component. Let's get started.
View the source for this lesson on GitHub.
How might we make our graphs more dynamic? Maybe we want to limit revenue to only
x number of days; and, further, we should be able to modify this range on the fly, without requiring a page reload. Well, I'll show you how!
View the source code for this lesson on GitHub.