Image Image Image Image Image Image Image Image Image Image

JasonSlater.co.uk Technology News Blog | November 4, 2013

Scroll to top

Top

How to use Google Chart API

Including a dynamic image, such as a chart, on a web page can be useful and help to express an idea visually and simply. Fortunately, Google provide a useful Chart API (Application Programming Interface) which can be accessed to quickly and easily produce highly customisable charts.

For example, to get a simple pie chart on the screen click on the link below:

You may find it produced the following image:

The image is embedded into a web page by making the URL the image source, so for the example above:

In the example above several parameters were passed through:

  • cht is the chart type (we use p3 which is a 3d pie chart, we could use just p which is a 2d pie chart)
  • chd is the data (we use t:60,30,10 where t: indicates text encoding)
  • chs is the image size in pixels (we use 250 by 100)
  • chl is the chart labels (we use Apples|Oranges|Bananas where the pipe symbol is the separator)

A number of chart options are available including line charts, pie charts, bar charts, venn diagrams, radar charts and 2d barcodes (QR Codes).

This is the same chart above but shown using various different parameters:

Using the Bar chart parameter cht=bhs

using the Venn diagram parameter cht=v

Using the Google-O-Meter parameter cht=gom

QR codes are interesting as QR code readers are becoming available in mobile devices – so for example a free subscription offer could be made available by letting the user scan an image rather than typing in a long URL. For example the RSS subscription URL for Jason Slater Weblog is but could be shown as

You can read more about the Google Charting API at

Further Reading

Comments

  1. Nice work on this. A gentleman named Dean Collins also did an impressive job explaining Google’s API for QR on his blog awhile back. Thanks.

Submit a Comment