Incorporating Canvas into a real page


show more Incorporating Canvas into a real page provides you with in-depth training on Developer. Taught by Joe Marini as part of the HTML5: Graphics and Animation with Canvas show less
please wait ...

Incorporating Canvas into a real page

In this example, we're going to see how to incorporate a canvas into a real web page. And to do that, we are going to use the Explore California example site that comes with your exercise files. So, here I've got the ExploreCalifornia exercise files ready to go. Let me first show you the page that we are going to build. So, if I bring up the index page, this is the Explore California web site that we've been working with. And I am going to click on the TOURS section, and you can see down here there is a list of tours.

What we are going to do is we are going to build a canvas-based tour finder, and here is what we are going to do. Let's go to the TOUR FINDER page. So, right now, you can see this example is empty, but let me show you the finished version so you can see what it is going to look like. Okay, it's going to look like this. So, we will have a canvas which displays a graph of some attributes of a given tour, and it will show us things like the duration, elevati...

Incorporating Canvas into a real page
Video duration: 13m 36s 3h 7m Intermediate

Viewers:

Incorporating Canvas into a real page provides you with in-depth training on Developer. Taught by Joe Marini as part of the HTML5: Graphics and Animation with Canvas

Subjects:
Developer Web
Software:
HTML
Author:
please wait ...