Create Cool Charts And Graphs Via HTML5 Using Chart.js

Nick Downie has created and developed a script that allows you to generate charts and graphs for internal data (like traffic) and content using JavaScript and HTML5. This HTML5 charts library uses the canvas element hence making all charts drawn using it scalable at any height or width. The [charts] data is passed as a JavaScript array, which at the same time allows color scheme customizations at the same time.

Instead of rendering multiple DOM nodes per char element like SVG charting libraries, it uses a single canvas node. And because of its single-node rendering, it only has one hook for event listeners, which consequently “involves keeping track of any areas requiring interaction in memory, and iterating through these while checking against the current mouse position,” Downie says. “It’s a whole load of looping every time a user moves their mouse. It also means regular clearing/redrawing of the canvas if we draw the tooltips directly onto the canvas itself,” he continued.

The code is open source, is straightforward, and is dependency free – meaning it’s portable! It comes with an easy-to-use input interface that makes these charts handy. This is the very first version of its release.

It supports the following chart types:

  • Bar
  • Pie
  • Line
  • Radar
  • Polar
  • Doughnut

You can find more details about this awesome script over at its official page or perhaps fork it over at GitHub.

Incoming search terms for the article:

Related Posts

How To Create A Basic Social Sharing Button

Add Clippy.js To Your Website For Instant MSWord Nostalgia

Quirk Tools Cloud-Based Tool

Active Admin For Ruby On Rails

Leave a Reply









CommentLuv Enabled