WordPress Chart Plugin

By evan on May 07, 2014

Screen-Shot-2014-05-07-at-11.50.17-AMI hadn’t been able to find a decent plugin to create charts in WordPress, so I wrote my own.

It uses HandsOnTable for the backend, to provide an excel-like editor, and Charts.js for the front end.

Long story short, I used the “onChange” callback of HandsOnTable to update a hidden form field with a serialized array of the table. Every time the table is edited it updates the hidden input field. When the post is saved, it saves the hidden field as a custom field. Then when the post editor is opened again, the serialized data is re-objectified parsed using JSON.parse(), and the “data” attribute of handsontable is set.

The front end needs that data massaged a bit, to split it into the x-axis and y-axis. A couple loops later though and we get decent results like on the right.

I’ve implemented a line chart, a bar chart, and a pie chart now, more may follow.

Unfortunately no source code release at this time since it’s a work project. Simple enough concept, just took a few days to learn the libraries and work out the kinks.


[verb_graph id=”446″]

Leave a Reply

Your email address will not be published. Required fields are marked *