Adding Indicators to Customized Options

00:00 Speaker 1: Hello, everybody, and welcome to Part 6 of Section 4 of Data Visualization with Python and Matplotlib. In this tutorial, we're gonna add one more simple indicator to fill out our graph, and then we'll start with further customization. So, what we're gonna do is we're gonna add this indicator called "high minus low." And the idea of high minus low is to track volatility. Now, probably, you would smooth out high minus low with some sort of moving average, or high minus low might be a percentage change, so it's normalized across stocks or whatever. For now, we're gonna keep it really simple and we're just gonna do high minus low. So the idea of high minus low is you take... Let's say we're using daily data, which we are, you take the high of that day minus the low of that day, and you get a range of prices that that instrument varied between for that day. And so, this is useful because the more variance in price, the more really volatile that price was.

00:58 S1: So, we'll go ahead and we'll just add this underneath moving average. And what we're gonna say is, "def high minus low," and to calculate for this, we have highs and we have lows, and that's all we need. And then, all we have to do at this point is return the highs minus the lows. Now, interestingly enough, what we can do is something simple like this is, say, for example, we have a situation where we have highs are equal to 6787689. And then we have some lows. Lows are equal to, and let's just space a couple of times. So, 1232421. So those are our highs and our lows, for example. We can have H_L as equal to, basically saying, "Hey, this is the high minus low." And what we can do, is we can use mapping, and in Python 3, it's more like list mapping. So, what we do is, first, we wanna map the high minus low. And then we pass... So you pass the function, and then you pass any kind of parameters to that function. We have highs, we have lows. And then, basically, we have to convert this to a list if you're in Python 3. If you're following along in Python 2, you should probably get Python 3. But if you're on Python 2, you really... You don't need the list there, but on Python 3, you absolutely do. So then, we could print H_L, and let's save it around that, and let's just... We don't even need to get to the stock to plot.

02:39 S1: So, it prints out this list: 5555268. So that's our high minus low. 555, good. 5268, so, good, that was exactly what we wanted. So we can close out of this, we're not gonna go any further, and we can get rid of this code right here. And now, what we can do is actually apply this code to our pricing data. So, we get all the data here, and then we're defining our moving averages here, cool. And then we start, actually... We recreate the data a little bit here, and then we begin plotting data here. So, like I was saying before, generally, it's a good idea to kinda clump everything together. So, we could actually further clump this. So these are our AX2 stuff. We'll get rid of these. These are our AX3 things. So then up here is where we'll put the AX1 stuff.

03:31 S1: So, first, we need to define the high minus low. So, we would do like H minus L equals... And then, again, this would be a map of high minus low. Oops, that's underscore low. And then, we have the high Ps and the low Ps, okay? And then we need to actually convert this all to a list, so we do list. So, it's a list of all that. Then, what we're gonna do is we just say AX1.plot, and we'll plot the date, and then the H_L. So, with that, let's go ahead and save and run that one, and we'll plot X on again. And now we have the high minus low on the top chart.

04:25 S1: So now we've got a graph. There's a lot of stuff going on here and we've got data that we're using. So, that's pretty cool. Now, again, there are some things that are not the greatest right now. So, some of the things that we're kind of have going on here is our dates. We can't really read the dates. These numbers down here mean nothing to us, these numbers here mean nothing to us, we don't have our labels. If we zoom in to a specific spot on one graph, it doesn't zoom in on the other graph, so we gotta fix that. And we don't have title, and there's probably some other stuff I'm not thinking of it right this minute, but we do have a lot of little stuff that's still wrong with this graph. So, what we need to be doing now in the next... Basically, the rest of this section is dedicated to kinda fixing up this chart and getting it presentable. So we've got a lot of changes to make, but we've got the data and now we just do some customization. So, we'll get this chart looking pretty good in no time. So anyways, that's what you guys have to look forward to with the rest of this section, so stay tuned for that.
00:00 Speaker 1: Hello everybody, and welcome to part seven of section four of our Data Visualization with Python and Matplotlib Tutorial Series. In this part, what we're gonna be talking about is adjusting the dates and fixing a few other issues, and really, that's what we'll be doing for the rest of this section.

00:18 S1: So first of all, we find that when we plot this graph, one of the first things that we notice is, we just have a lot of overlap going on here. So, the dates are being shown on ax2. They really need to show on ax3 and we can just get rid of the other dates that are showing up at all; we don't even want those. So the first thing that we're gonna go ahead and do is we'll close out of this for now. And first of all, we'll come down to where we define stuff for ax2, and we don't even... We really don't want that at all, so let's cut that. So Ctrl+X, cut, come down to ax3, and then Ctrl+V for paste. And change this to ax3, ax3, ax3. So now what we're doing is we're plotting hopefully those labels on ax3. Let's check to make sure everything is the way we expect. And sure enough, now we just have the numbers there, not dates and numbers here, not dates and... Here, we have dates. So looks good. So we're off to a relatively decent start.

01:33 S1: So now what we wanna do is we want to get rid of the X labels on ax1 and ax2. So what we can do is we can say this. We can say plt.setp, and what we're gonna do here is ax1.get_xticklabels. And then what we're gonna do is we're gonna set them visible=false. So what this will do is get rid of the X ticks for axis 1. And then we do the exact same thing. Actually, let's do it here. We'll come down to ax2. This is where we graphed, we grid, we add the box in the annotation box, and then we'll come down here, and we'll do the exact same thing. So, plt.setp. This time, ax2. Still get_xticklabels. And we're gonna set visible=false. So now let's save and run that, and let's see what we get now. So, now what we have is we still have this plus time there, but we'll handle for that in a little bit. But we don't have any more of those numbers on the chart.

02:56 S1: So the next thing that we wanna go ahead and do is we'll come down here. So with the moving average, for example, just to kind of incorporate what we've learned so far, what if we wanted to show what these moving averages actually meant? So the way moving averages work, these may not be the best moving average for this company, but the way the moving averages work is basically when the faster moving average, so this blue one, is below the slower moving average, that means price is trending down. It's falling. And that's true. And then once this faster moving average crosses above the slower moving average, that means price is trending up. So again, if we line this up, yeah, that's true. And then again, it crosses over at this point, and then it's down. So at this mark right in this area, that's bad, price is going down. This mark, good. Price is going up. Bad.

03:50 S1: So let's talk about creating a custom fill that will fill this red, this green, and this red. Well, the way that we can do this is coming down to... We'll be doing this in ax3. We are plotting here and basically... First, let's set these. The lines are a little thick for what we're gonna end up doing, so let's say linewidth=1. And again, we'll do linewidth here equals 1. Next, what we wanna do is after we've plotted, let's go ahead and do an ax3.fill_between and we fill between the date, and then "-start:", we fill between there, and then that's... Well, at least that's the X. And then what are we filling between? Well, we're filling between the ma2 of the "-start:" To the "ma1-start:". Where? And then here, let's say this is the downward one. This would be where "ma2-start:" is greater than... And then we'll just use greater than or equal to "ma1-start:". So that'll be our fill between. And so this is the where statement, and then we can add comma here, and we can say that face color here will be equal to red. And then we can say the edge color is equal to red. And then finally we can add the alpha, and we'll just use 0.5 for now.

05:42 S1: So then we do the exact same thing again coming down here, where we're gonna say ax3.fill_between and then date, and then the same thing again. So the X. And then what are we filling between? Well, we're filling between the "ma2-start:" And the "ma1-start:". And this time, the where statement is where the ma2 of the "-start:" is less than or equal to the "ma1-start:". And then here, the face color will be equal to green, the edge color will be equal to green, and then again, the alpha will set as 0.5. So this is kind of our way of filling in to easily see where our buys and sells might be. So again, we'll plot Exxon. Oh, we've got an error. Let's bring this up. Where is not defined. Let's close out of this. Right, okay. So it needs to be "where=". "Where=", okay. So let's try this again. We'll plot Exxon, and we'll bring up the chart. And now we have the fill. So this is the good time, sell time, and then good time, sell time.

07:25 S1: So, that's us incorporating the fill part that we learned. So really lastly, the only thing we would maybe want to fix about this would be something like those times, so let me bring that up. So these little times here. Now, we could try to remove them. Also, if we change the high minus low, for example, instead of plot, we do plot date, and then we'll add one more little parameter here, which is that dash. That way, it plots a line rather than a scatter. So if we add that, we can see that it gets rid of it for this top plot, but still not this bottom plot because this is a candlestick. So one of the things we could do is for example, we could just come over here in the header space, just get rid of the header space. And the header can just cover that price and that's totally fine. We can do something like that, so we could say hspace instead of 0.2 or we could do 0.04, something like that. And then now, it's just not really that a big of an issue there. So, eventually, I think it's probably best just to keep the header space zero 'cause even when you make it huge, it's still in the way, but if you make it too little, it'll run over this annotation.

08:45 S1: But like with anything in graphics, what ends up happening is, for example, we could say hspace equals 0.0. And right now, it's running over a little bit this axes. So then the question would be well, what if we annotated it right here, take this, cut, and then just before we show everything, do it in that order. So what happens if we try that? So we can see that there are properties to the axes that pretty much always makes it so the axes takes precedent over whatever. And we saw this was the case when axes were overlapping dates and all of this. So you do have to kind of keep that in mind because a lot of times, the order that things will appear is the order that they were created. But in our case, that's not really what's happening here because an axes always gets priority, and that's really just kind of to save you from covering over stuff accidentally and stuff. Just keep that in mind. The only thing that can cover another axes is another axes. So anyways, we'll change this back. But if you leave it at zero, for example, and then we do this, it's totally fine, if you full-sized the graph. The other things that are a problem still would be the overlapping of the Y values here, which we're gonna be talking about very shortly.

10:08 S1: So, anyways, that's it for this tutorial. Stay tuned to the next tutorial, where we'll be talking about labels and cleaning up markers and all that. So stay tuned in for that. Thanks for watching.

00:00 Speaker 1: Hello, everybody, and welcome to part eight of section four. In this part, what we're gonna be talking about is cleaning things up a little bit and adding labels. So first of all, let's add our labels so people know what they're looking at. So for example here, we have ax1 and well, basically our... Actually, we come up here at the definitions, and right here, we labeled for ax2. Let's go ahead and label for ax1. So plt.ylabel here would be something like H minus L, or high minus low. Then for our axes 3, we might do plt.ylabel, and here we would say probably MAVGZ, so moving averages, something short so it would fit on that Y axes, 'cause if you recall, our Y axes are pretty small on at least the top and the bottom chart.

01:00 S1: Next, what we wanna go ahead and do is let's bring this up, and we'll talk about what we're gonna do next. So plot Exxon. And okay, so now we've got our labels, and this is why. So if we made MAVGZ much bigger, it would be too big for the axes. So the next thing that we wanna talk about now is these numbers here. So first of all, we have a little too many numbers on these axes, and we can make the font smaller, but even if we made the font smaller, we would still have the overlap of the bottom axes and this middle axes, and the middle axes and this top axes. That would still be happening no matter what we did to the font size, pretty much. Maybe you can make it, but you can see it's a perfect overlap. They're just taking each other's places. So there's two things we wanna do. One is at least for the top and the bottom axes, we actually wanna have less markers here, and that's totally doable. And then we also wanna trim possibly one of these markers here and one of the markers here so we don't have this overlap going on. So that's what we're gonna be talking about now, is doing those two things.

02:06 S1: So first of all, on ax1, let's just go to where we're actually plotting stuff, so it'd be right here. And we set the ticks, the X ticks to false. Now what we're gonna go ahead and do is we'll go one more down and we'll do ax1.yaxes.set_major_locator, and then we set them to mticker.MaxNLocator. And then here we say the number. So nbins, so this is number of bins, and let's say we want it to be five. Okay. So now, let's save and run that. Same thing, plotting Exxon. Oh, what did we do? [chuckle] Micher? Alrighty. Mticker. Okay, try that one more time. Okay, cool. So now we can see that we have less, and they're not running over each other. We still have this overlap here, but they're not running over each other. So now we're gonna fix this overlap on this top. So the way that we can do that is with one more parameter. So we have nbins=5. And then we can add this other little parameter, and it's prune, and we say we wanna prune the lower value. So we can save and run it, and we'll plot Exxon again. And now we can see there's no overlap at all. So 84, 86, 88, 90, 92, 94, and then we start the other one.

03:42 S1: So now we got the overlap on the bottom, and we may or may not wanna actually fix this one, too, this 94. You could get rid of that, too, so there's a little more space 'cause it's almost like, it looks like 94 could be part of this one, too. But anyway, we'll close out of this, and we'll do the exact same thing here. So we're gonna come down to ax2 and ax2 basically works this chunk. So then what we'll do is we'll take ax2.yaxes.set_major_locator, and then again, mticker.MaxNLocator. So make sure to heed the cases there. Max locator, and then nbins, so number of bins, and again, we'll just say five, and then we'll prune equal to the upper. So that we won't have that overlap on the upper value as well.

04:41 S1: Let's plot a different style. Let's do TSLA for Tesla. Okay. So now we've got the price here, no more overlap up here, cool. And then looking down here, where we've got our moving averages they still have to be fixed up, but no problem for us. We know how to do that, so we will. And everything else, looking pretty good. So, let's close out of this. And now finally, we do the same thing that we've been doing to axes 3, and while we're at it, let's go ahead and put this annotation back where it belongs. So highlight that, Control X, put it back up here 'cause it belongs to axes 2. I just wanted to bring it down there to show you guys that not always are you gonna be able to overwrite things. Anyway, so ax3.yaxes.set_major_locator, and then in here, we put mticker.MaxNLocator. And then as usual, we'll just do the nbins=5, and let's prune that upper one, upper.

05:47 S1: Okay. So we can now, let's go ahead and save and run this, let's plot Tesla again. Alright. So now we've done that, and we still seem to have a slight overlap there. If you make it big, you don't really have that full overlap, but maybe you wanna get rid of... You might wanna get rid of the lower one on here as well. It almost looks like we didn't even prune the upper one on moving averages. It should be right here, I suppose, and it would be way overlaps. Anyway, we know we've done it because we set the bins to five, and we only have four values here. Anywho. So closing out of there, that's basically it as far as cleaning up the chart. We don't necessarily need to do much more to clean up the chart, besides maybe that overlap. But for example, let's plot, let's do another stock. Let's do GOOG for Google. And you can see here, there's no really overlap issue going on necessarily there, or we could go back to... Let's do Exxon again and see what Exxon's doing for us. So here's Exxon, and it's not really a problem here, either.

07:02 S1: So anyway, we've got quite the cleanup going on there. And now what we wanna be able to do is we're looking at this chart, let's say, and then we decide, "Hey, I want to zoom into this point." We wanna be able to zoom into this point and have everything come together. So we're gonna add that "share X axes" to this graph, and we're also missing a bit of volume here. So adding another... Volume is not really an indicator, but it's another pricing point. Or not pricing point, but it's information on the stock. So we wanna add volume, and there's kind of a cool thing that we can do and show with Matplotlib when we add volume. So we'll be adding those two things as we move forward. And then we'll be talking about legends too because we don't have any legends here at all. So that's what you guys have to look forward to, so stay tuned for that. Thanks for watching.