Jquery Charts

My jQuery plugins were created either as experiments or to fulfil some need that I had on a project. I made the plugins available for free on this website - and you can still get them all here now.

I no longer actively support the jQuery plugins for the following reasons...

  • Many of the features can now be achieved without JavaScript using new features of HTML and CSS
  • Some of the features probably shouldn't even have been used, they were just experiments!
  • Not everyone wants to use jQuery - I will create stand alone plugins for the popular stuff that don't enforce any particular framework

Jquery ChartsQuick Links

Want a constant footer without having to include a framework or library - I have a stand alone Charts plugin listed on my JavaScript page!

You can view a demo and grab the code (view source) at...

Charts Demonstration.

Description

The jQuery Charts project is a plugin for the jQuery JavaScript Framework, which converts an HTML table into an HTML and CSS based chart or graph.

JavaScript

$("#example").charts();

The plugin relies on a nicely formatted HTML table, such as this:

<table id="example">
    <caption>Dog Breed Popularity (Made Up Numbers)</caption>
    <thead>
        <tr>
            <th>Breed</th>
            <th>Populatiry</th>
        </tr>
    </thead>
    <tfoot>
        <tr>
            <td>Total</td>
            <td>250</td>
        </tr>
    </tfoot>
    <tbody>
        <tr>
            <td>Mongrel</td>
            <td>90.5</td>
        </tr>
        <tr>
            <td>Labrador</td>
            <td>79.5</td>
        </tr>
        <tr>
            <td>Whippet</td>
            <td>50</td>
        </tr>
        <tr>
            <td>Spaniel</td>
            <td>20</td>
        </tr>
        <tr>
            <td>Terrier</td>
            <td>10</td>
        </tr>
    </tbody>
</table>

You Are Here: Home » Jquery Plugins » Charts