Google Chart API

I typically don’t blog about new Google stuff, especially APIs (application programming interfaces). However, this one is particularly cool because it allowed me to easily finish up a project that I had shelved for several months (maybe years? I’ll just call it ‘a while back’).

A while back, I had this idea to chart monthly blog frequency. I had found some code that did a pretty bang up job of making graphs using just PHP. However, it wasn’t the sleek looking graph I was hoping for. I had bookmarked a few sites that had Macromedia Flash applications that you could just drop the data into, but I never got around to playing with them.

Finally, Google introduced the Google Chart API. In a nut shell, I can easily create graphs such as:

This chart shows my blogging frequency for the month of November. The code I’m using on the back end is pretty crappy (I literally just patched some code I already had) and it can only handle a single month at a time.

Technical details to follow…

<?php
/*
Plugin Name: Graph Posts
Plugin URI: https://www.andrewferguson.net
Description: Graph the numbers of posts in a given time period
Version: 0.2
Author: Andrew Ferguson
Author URI: http://www.andrewfergson.net
*/

/*
Copyright (c) 2006-2007 Andrew Ferguson
*/

function afdn_graphPostsMonth($month = NULL) {
	if($month ==  NULL){
		echo "Month was NULL.";
		$month = strtotime(date("M 1 Y"));
		echo "Set to ".date("M, Y", $month);
	}
	else{
		echo "Month is ".date("M Y", $month);
		}	
	
    global $wpdb;
        $numberPosts = $wpdb->get_results("SELECT id, post_date FROM $wpdb->posts  WHERE (post_status = 'publish' OR post_status = 'private') AND (post_date < '".date("Y", $month)."-".date("m", $month)."-".date("t", $month)." 23:59:59' AND post_date > '".date("Y", $month)."-".date("m", $month)."-01 00:00:00') ORDER BY post_date ASC");
		

	$baseline = strtotime(date("M 1 Y", strtotime($numberPosts[0]->post_date)));
	$countPosts = 0;
	foreach($numberPosts as $thisPost){
		$thisArray[$countPosts] =1/(strtotime(date("M t Y", strtotime($numberPosts[count($numberPosts)-1]->post_date))) - $baseline))*100;
		$countPosts++;
	}

	$buildURL = "http://chart.apis.google.com/chart?chs=500x370&chd=t:";
	foreach($thisArray as $myArray){
		$buildURL .= $myArray.",";
	}
	$buildURL = rtrim($buildURL, ",");
	$buildURL .= "|";
	
	for($a = 1; $a<=$countPosts; $a++){
		$buildURL .= $a*(100/$countPosts).",";
	}
	$buildURL = rtrim($buildURL, ",");

	$buildURL .=  "&cht=s&chxt=x,y&chxl=0:|";

	for ($i=1; $i<=date("t", strtotime($numberPosts&#91;count($numberPosts)-1&#93;->post_date)); $i++){
		$buildURL .= "$i|";
	}

	$buildURL .=  "1:";
	
	for($i=0; $i<=$countPosts; $i++){
		$buildURL .= "|$i";
	}

	echo "<img src='$buildURL' />";

}
?>

If you end up dissecting the code, you end up getting a call to http://chart.apis.google.com/chart? with the following parameters (these are also described more in depth on the Google Chart API page; however, I figured that my use might make a good example and documentation/explanation is always nice) :

• chs=500×370
• chd=t: [string of CSV>]|[string of CSV]
• cht=s
• chxt=x,y
• chxl= 0:[string of pipe separated values]|1:[string of pipe separated values]
• chtt=Blog%20Posts%20for%20Nov.%202007

Which, in a nutshell, does this:

• chs is the chart size, not to exceed 300,000 square pixels in total.
• chd is the chart data. The t: part tells Google that the input will be a data string. The data string “consists of floating point numbers from zero (0.0) to 100.0, minus one (-1), and the pipe character (|).”
• cht is the chart type. s stands for scatter plot.
• chxt is the chart axis type. This information is used for labels.
• chxl is the chart axis label. This is an indexed array based on the chart axis types. 0: is the first element, 1: is the second element, and on and on. After the index is called, the chart axis label data should follow. For example: 0:|Jan|Feb|Mar|Apr|May|
• chtt is the chart title (not to be confused with the chart type either). This is just set to whatever you want the title be. As note, the chart title is not set in my code. I manually appended the chart title parameter later; so don’t look for it.

I hope to develop the plugin more, now that I have a nice way to display the graphs.

via Scoble’s Link Blog who saw it on Jeremy Zawodny’s blog

0

---

1. (strtotime($thisPost->post_date) - $baseline ↩