Sean Barton’s Blog

I came across Google Charts the other day and wanted to let people know what it’s all about. I found it incredibly easy to use to make a simple chart but a little more complicated to make something more complex.

The hello world example is given as follows:

http://chart.apis.google.com/chart?cht=p3&chd=t:60,40&chs=250x100&chl=Hello|World (should be used within an <img src=”" /> tag)

To be clear, Google Charts does not use an API key system like Google Maps which takes a layer of complication away.

Let me break up the key parts of the url used to generate the above example…
The first part http://chart.apis.google.com/chart? should always be the same followed by a combination of the following:

• cht = Type of chart you want to make (Common types are p3, lc, bhs, bvs)
• chd = Chart data stream(s), usually in the form of t:item1,item2,item3
• chs = Chart size (widthxheight)
• chl = Chart Label separated by a | per dataset

The next logical step is to look at bar charts because you can do all sorts with datasets/axis/labelling and colouring. See the following example (it’s not as complicated as it looks as I will show):

http://chart.apis.google.com/chart?chs=300x 120&cht=bvg&chg=0,10,1,5&chds=0,25&chxt=y&chxl=0:||5|10|15|20|25&chbh=60&chd=t:10,24, 6&chm=t10,000000,0,0,11|t24,000000,0,1,11| t6,000000,0,2,11&chl=14/08/08|15/08/08 |18/08/08

This one is different in more ways that the obvious fact that it’s not a pie chart any more; it has labels on the axis, background lines, it’s scaled and there are labels per bar. The additional parts of the url are structured in the following manner:

• cht=bvg (it was p3 before meaning 3D pie chart, this one is a vertical bar instead)
• chg = Chart grid accepts 4 arguments: x step, y step, line length, blank length
• chds = Data scale, arguments are minimum and maximum (this example 0-25)
• chxt = Defines which axis have labels on (x, y, r)
• chxl = Defines the labels for above in the form id:label1|label,id:label1|label2
• chbh = Bar height (or width in this case as we are using a vertical chart)
• chm  = Labels for each bar, arguments are id, colour, dataset id, dataset index

This has been a very simple guide to understanding how to use Google Charts. There are Infinitely more resources available at: http://code.google.com/apis/chart/

Google Charts, Statistics, Time Savers Google Charts

I have just finished work on a new Wordpress plugin to add to the Your Brand group of products. We have called it Your Minder and basically what it does it stops people account sharing.

The idea of giving your login details to a friend so they can benefit from your increased access level is not uncommon in any system, especially those you have to pay for. We decided to write it as the perfect companion for the Your Members plugin which turns your wordpress blog into an (optionally) paid membership site.

Your Minder works by stopping logins from multiple IP addresses over a period of time. If multiple logins are detected in the (fully configurable) time period then you have the option for it to perform one of many actions including lock out both accounts for either a time period or until the activation link (sent via email) is clicked among others.

Yes, like many of the plugins i’ve written it’s not free but it certainly won’t break the bank at under a tenner (09/08/08) and will ensure a greater income from your members over time.

Take a look at the full spec and screenshots on newmedias to find out more! http://www.newmedias.co.uk/your-minder/

wordpress wordpress, your brand, your minder