HTML5 Projects: Interactive Charts
Video: WelcomeSpice up dry data presentations with an interactive, visually engaging bar chart drawn with the HTML5 Canvas element.
- Next steps
Spice up dry data presentations with interactive and visually engaging charts. This installment of HTML5 Projects shows how to build interactive bar charts, dynamically drawn with HTML5 Canvas. The user-friendly chart elements allow visitors to record different data scenarios by dragging bars. Author Joseph Lowery also shows how to automatically save the data from day to day. Altogether, this course offers a great introduction to HTML5 form elements with Canvas, integrated drag and drop, and local storage technologies.
- 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
(music playing). 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.
There are currently no FAQs about HTML5 Projects: Interactive Charts.