Spice up dry data presentations with an interactive, visually engaging bar chart drawn with the HTML5 Canvas element.
- View Offline
- [Voiceover] Hello, thanks for checking out HTML5 Projects, Interactive Charts. I'm Joe Lowery and I'll be your guide to building an online interactive bar chart. This project is great for web apps where you want to enable the user to easily chart their own progress in a task, and then save it for a future reference, sharing, or just bragging rights. We'll put the powerhouse HTML5 Feature Canvas to work and I'll show you how to import background images, add text, draw primitive shapes, integrate anchor points for single direction dragging, display continuously updated numeric feedback and much more.
You'll see how to incorporate an HTML5 Web Storage Solution to effortlessly keep track of the chart progress from day to day, as well as how to save the entire chart to admire or share. Sound good, then let's get going with HTML5 Projects, Interactive Charts.
- Crafting the HTML
- Initializing the stage
- Adding a legend and labels
- Drawing the bars in the bar chart
- Adding anchors for interactivity
- Connecting the feedback
- Storing user progress