So let's see, yeah, this is the one we want. All right, so let's switch over to js-spin, paste that in. And next, to create a chart, we can use the canvas tag, the HTML5 canvas tag. And we'll give this an ID of graph for now. And next, we can switch over to our JavaScript. So the first step, let's track down the canvas. So we could say var graph = document.querySelector(graph). But now in this case, we want to call it getContext('2d'), and that'll give us the context here. And basically, what this does is it returns an object to you.

and that'll give us the context here. And basically, what this does is it returns an object to you that allows you to actually draw on the canvas itself. Okay, so I'm going to reduce this a little bit. We have our context. Next, we need to create our chart. Now, because we pulled this in, we have a new global chart object or function. So we could move that up and then pass in our context. Now, at this point, we can trigger whatever kind of graph we want. For example, if we go to the documentation, you have a bunch of choices.

Now, at this point, we can trigger whatever kind of graph we want. For example, if we go to the documentation, you have a bunch of choices. Line chart, bar, radar, polar area, lots of ones you may not use. But generally, yeah, for the bar and line charts, I use them quite a bit. So why don't we start with a good old line chart? Okay, we can call .line. Now, we'll give it two arguments. The first will be the data for the chart. And then the second would be any options that you want to apply. So for example, in this case, if we take a look,

And then the second would be any options that you want to apply. So for example, in this case, if we take a look, here's all the various options that you could pass as that second argument. For now, I'm going to leave it off. Okay, so we have our context. We've newed up our chart, but we don't yet have the data. Let's do that now. barData. Well, let's begin with our labels. And maybe we're charting monthly expenses or monthly income or monthly signups.

Now, this is where the options come into play. So for example, if we go to our line chart and scroll down, yeah, you can see we can configure basically every possible piece of color. So let's just grab all of that, switch over. And there you go. Now you see that looks a little bit cleaner. So what if we did one more? Maybe this isn't revenue. Maybe this is userStatistics or something like that. And this next one has 10, 50, and how about 2?