From the course: Python Data Structures and Algorithms

Use the Grid Tracer app - Python Tutorial

From the course: Python Data Structures and Algorithms

Use the Grid Tracer app

- [Instructor] So I'm just going to quickly talk you through that grid tracer app, in case you want to use it yourself. So you'll find it in the GUI Code under grid tracer, and if you just click on index.html then if you hover over here in PyCharm, you'll get the option to open it using whatever browser you like. But just before we do that, let's just look at the other files. We got script, that's the js, and we got some styling as well, you don't need to touch that really. Script, the only time you might want to touch that is a couple of things, one is you might want to change the size of the grid. So it's always going to be square, the way I set it up, but you might want more than three cells by three. So let's change that to four for example. And then I've just got some different options down here for display. So later on in the course, there's going to be a situation where I want to start my grid from K rather than A, and there's a reason for that I'll go into then. But if you want letters from A than these two lines should be uncommented. That's lines 24 and 25. However, if you want to actually have grid coordinates, you can recomment those. And you can uncomment line 27. So let's look at that version now. So I've uncommented, line 27, I've set the grid size on line three to four. So now when I open my app by going into index.html and clicking Chrome, then you'll see that it opens up in Chrome. However, you might want to make it larger than this. So the way I do that is I do Ctrl plus on my keyboard a few times until it's the size I want it. And then you can see you've got basically just the same app, but instead of having letters for the sales, we've got coordinates, which is quite useful if you still need to practice those. And also, if you want to trace the way the algorithm is working in one of our implementations where we're actually using coordinates, but basically same principle so we can color squares. And like I said, in the previous video, I've got a convention that anything that's been put onto the stack or later on the queue and the priority queue. I'm going to first of all, color in blue. And then when it's discovered, I'm going to color it red. And I'm using the goal as being green, but that's a purely arbitrary choice. But I guess it's good to be consistent, if you want to go with that. And also, we can use black for obstacles. So we might want to create a bit of a maze like effect. So we can do something like this. So they'll see we did ends and they'll have to be a bit more backtracking. First, basically how you use it. And I do encourage you to use this app. Because the more experience you can get tracing these algorithms, the easier it becomes to understand how the code works, and just to be able to understand the big picture of what we're trying to do here.

Contents