Skip to Main Content

Get Chart-tastic with jQuery

Posted on 8.20.2014

Designers are challenged on a daily basis to present a variety of information and content in compelling and interactive ways.

One of the best ways to do so is within charts. While they may be a great way to present information, charts are traditionally boring so it is up to Web designers to make them eye-catching enough to make hurried Web visitors stop and read them.

Here is a list of eight lightweight jQuery plugins to help make charts more engaging and, in some cases, interactive.

Chart.js

Constructed using HTML5, Chart.js enables developers to create six different charts (line, bar, radar, polar area, pie and doughnut) which are all animated as well as interactive. Since charts created with the plugin are also interactive, the screen size changes as does the size of the chart.


HighchartTable

While tables are a great way to inform individuals of data, charts help people to visualize the difference in data. HighchartTable enables developers to create interactive graphs from HTML tables.


 SUBSCRIBE FREE to Website Magazine - 12 Issues 


Sparklines

Using data from either HTML or Javascript, developers can create small inline charts that are interactive.


sDashboard

Charts and tables created using sDashboard are spawned on a dashboard in the form of widgets which are not only interactive, but are also able to be rearranged through drag-and-drop actions.


jqPlot

With a wide variety of interactive charts available, jqPlot offers a lot of options to designers with one of the more interesting being mouse tracking. When users scroll over the chart they will see the value from the X and Y axes for each set point as well as all unspecified points in between.


jqBar

Keeping it simple, jqBar enables developers to create animated horizontal and vertical bar charts.


TufteGraph

With a very basic set of features, TufteGraph gives designers the ability to develop colorful bar charts with labels above each specified point for easy comprehension.


Peity

With three available charts (pie, line and bar), designers can use Peity to make small charts that will easily fit in other content on a Web page (like blogs). 


 (Charts have been enlarged for this post)

WebsiteMagazineMiniLogo

Leave Your Comment

Login to Comment

Become a Member

Not already a part of our community?
Sign up to participate in the discussion. It's free and quick.

Sign Up

 

Leave a comment
    Load more comments
    New code
  • Your Guide to 2017 Sales Tax Changes

    2017 Sales Tax Changes