WordPress内のデータをGoogle Chart APIで動的にグラフ作成。
ふと急にGoogle Chart APIを使ってみたくなり、WordPress内のデータを使って動的にGoogle Chart APIでグラフを出力するテストをしてみた。
とりあえず、カテゴリごとの記事の割合をグラフにしてみる…こういう目的ならタグクラウドで十分な気もするけど、将来的に応用できそうなので、メモということで。
※先に言ってしまうと、Google Chart APIはまだ日本語対応が十分でなく、ひらがなとカタカナしか表示できません…しかもフォントも微妙。カテゴリースラッグにアルファベット入れてあれば下のコード内のnameの代わりにslagに差し替えて即使えます。
※漢字が文字化け…こちらの開発メンバーによるコメントでは「取り組んでるけど、簡単じゃないよ」とのことです。。。
【追記 2008-12-11】
今は漢字に対応しているようですよ。試していませんが→
Google Chart API で漢字を含む日本語が通るようになった れぶろぐ
ということで日本語はまだ使えないですが、以下解説。
■やっていること：
Google Chart APIは、imgタグのsrcにパラメータ付きのURLを埋め込んでやるだけで簡単にグラフ画像を取得できます（ユーザー登録など不要）。なので、そのURLのパラメータをつくってあげます。カテゴリごとの記事数を取得して、記事の総数に対するパーセンテージを割り出し、APIの書式に従って出力します。
■ソース：
ver.2.3以上（2.5で確認）
global $wpdb;
//記事の総数を取得のため
$allposts = new WP_Query(”showposts=-1″);
$sql = “SELECT * FROM ” .$wpdb->terms .” t “;
$sql.= ” LEFT JOIN “.$wpdb->term_taxonomy .” tt ON t.term_id = tt.term_id “;
$sql.= ” WHERE tt.taxonomy != ‘link_category’ “;
$sql.= ” GROUP BY t.term_id “;
$sql.= ” ORDER BY tt.count DESC “;
$mycat = $wpdb->get_results($sql);
//カテゴリごとの記事数のパーセンテージを記事総数から割り出してカンマ区切りで並べる。
//同時に、対応するカテゴリ名を「|」区切りで並べる。
//カウントが0のカテゴリは拾わない。
for($i = 0; $i < count($mycat); $i++){
if ( $mycat[$i]->count != 0 ){
if ($i != 0 ){
$count = $count .”,”;
$cat_list = $cat_list .”%7C”;
}
//post_countで記事総数を取得
$count = $count .round($mycat[$i]->count / $allposts->post_count *100 );
$cat_list = $cat_list .$mycat[$i]->name;
}
}
$url =”＜img src=’http://chart.apis.google.com/chart?”;
$url.=”cht=p”;
$url.=”&chtt=Google%20Chart%20TEST”;
$url.=”&chs=450×190″;
$url.=”&chd=t:” . $count; // ←カテゴリごとのパーセンテージを挿入
$url.=”&chco=0000ff”;
$url.=”&chl=” .$cat_list; // ←それぞれのカテゴリ名をラベルとして挿入
$url.=”‘ alt=’Google Chart TEST’ /＞”;
echo $url;
?＞
■ver2.2以前（ME2.2.3で動作確認）※テーブル構造が違うため
global $wpdb;
//記事の総数を取得のため
$allposts = new WP_Query(”showposts=-1″);
$sql = “SELECT * FROM ” .$wpdb->categories;
$sql.= ” ORDER BY category_count DESC “;
$mycat = $wpdb->get_results($sql);
//カテゴリごとの記事数のパーセンテージを記事総数から割り出してカンマ区切りで並べる。
//同時に、対応するカテゴリ名を「|」区切りで並べる。
//カウントが0のカテゴリは拾わない。
for($i = 0; $i < count($mycat); $i++){
if ($mycat[$i]->category_count != 0){
if ($i != 0 ){
$count = $count .”,”;
$cat_list = $cat_list .”%7C”;
}
//post_countで記事総数を取得
$count = $count .round($mycat[$i]->category_count / $allposts->post_count *100 );
$cat_list = $cat_list .$mycat[$i]->cat_name;
}
}
$url =”＜img src=’http://chart.apis.google.com/chart?”;
$url.=”cht=p”;
$url.=”&chtt=Google%20Chart%20TEST”;
$url.=”&chs=450×190″;
$url.=”&chd=t:” . $count; // ←カテゴリごとのパーセンテージを挿入
$url.=”&chco=0000ff”;
$url.=”&chl=” .$cat_list; // ←それぞれのカテゴリ名をラベルとして挿入
$url.=”‘ alt=’Google Chart TEST’ /＞”;
echo $url;
?＞
以上
■結果：
出力した結果は先の図…文字化けしています。カテゴリごとの記事のパーセンテージが円グラフになり、それぞれに対応するカテゴリ名がラベルとして出力されます。グラフの形や色などパラメータについてはこちらのDeveloper’s guideにいろいろ解説されています。
カスタムフィールドに設定した値を集計してあげれば、いろいろ応用できそうですね。ページごとのアクセス数の推移などもプラグインを併用すれば比較的簡単にグラフ化できそうです。そしてログインしたクライアントにのみ表示する、など。
参考記事）
Google Hacks: Pacman graph with Google Charts Matt Cutts: Gadgets, Google, and SEO (2008/4/24)
WEB API - Google Code Chart キター 404 Blog Not Found (2007/12/7)
コメント/質問お待ちしています