データファイルからPHPでチャートを描画する
ちょっとした目的からデータファイルを入力として、チャートを描画するものが欲しくなった。色々と探してみたのだが、そのままドンぴしゃというものが無いので、頭の体操がてら作ってみた。
仕様は簡単なもので、数値をCSV形式で保持し、コメント部分を拡張してそこにチャート属性情報を埋め込むというもの。
# Comment #title: Main Title #x-title: X Title #x-range: 1., 7. #x-labels: a,b,c,d #y-scale: log #y-title: Y Title #y-range: 1.,20. #graph-type: line-dot,area, bar #data-label: one, two, three #data-color: #0066cc, #6600cc, yellow Jan,2., 3., 4 Feb,3., 4., 7 Mar,5., 10., 1 Apr,6., 2., 10 May,7., 1., 15 Jun,8., 9., 4
#で始まる行をコメント行として、そのコメント行の内で、以下の形式を持つものをチャート属性として読み取り、チャートへ反映するものである。
#attribute: value
以下に、各属性(attribute)について示す。
- title
- タイトル文字列
- x-title
- X軸のタイトル。Pieチャートとレーダチャートでは無視される。
- x-range
- X軸の表示範囲を指定する。半角カンマで最小値と最大値を区切って与える。
- x-scale
- log 又はlin,text,intにより、ログスケール又はリニアスケール、文字列表示、整数値スケールを指定する。文字列表示、整数値スケール指定はチャートエンジンにjpgraphを指定した場合のみ有効。デフォルトはリニアスケール。
- y-title
- Y軸のタイトル。Pieチャートとレーダチャートでは無視される。
- y-range
- Y軸の表示範囲を指定する。半角カンマで最小値と最大値を区切って与える。パイチャートでは無視される。
- y-scale
- log 又はlin,intにより、ログスケール又はリニアスケール、整数値スケールを指定する。整数値スケールはチャートエンジンにjpgraphを指定した場合のみ有効。デフォルトはリニアスケール。
- graph-type
- チャート種別を指定する。 bar/line/line-dot/dot/area/areadotと、チャートエンジンにjpgraphを指定時のみpolar/radar/pie/spline/spline-dot/errorbarが指定可能。
- data-label
- 半角カンマで区切って、各データ系列のラベル文字列を指定する。
- data-color
- 半角カンマで区切って、各データ系列の色を指定する。色の指定はHTMLのCSSと同じで#RRGGBBの形式である。
graph-type,data-colorの指定個数が、データ列数よりも少ない場合は、最後の値が繰り返し指定されたものとして扱われる。例えばgraph-type:barとして一つだけ指定した場合、全てのデータ列はバーチャートとして描画される。
実際の描画を行うエンジンとしては、当初GLE - Graphics Layout Engineを、別の目的もあって採用していた。途中で、単純にチャートを作成するだけであるなら、外部コマンドであるGLEを用いるより、オーバーヘッドが少なく描画オプションが豊富なJpGraphを用いることにした。これに伴い、描画エンジンをオプションとして選択できる仕組みとした。更に別の理由から、描画エンジンの使い方として外部起動コマンド型をして出来るようにした(cmd:接頭子)。これについては別の機会に示そうと思う。
なお、利用に当たって、注意する点がいくつかあるので、以下にまとめておく。
- graph-typeとして、pie/polar/radarを指定する場合は、その指定のみをgraph-type属性へ指定すること。
- polarタイプを利用する時は、データポイント数は偶数でなければならない。
- errorbarタイプを利用する時は、errorbarに指定したデータ列の各値として、Yの最小値と最大値を半角コロン':'で接続したものを指定すること
- データの一列目に文字列をX軸のラベル値として利用するときは、x-rangeを指定してはならない。
- データの一列目にX軸ラベルが指定された時、x-labelsの設定は無視される。
- splineタイプを利用する時は、x-labelsの指定及びデータの一列目に文字列を使用してはならない
以下に、作成したPHPスクリプトの使用例を以下に示す。
require_once('dataHandling.php');
require_once('makeGraph.php');
$datastr1=<<<EOD
#title: test test
#x-title: x
#y-scale: log
#y-title: y
#y-range: 1.,20.
#graph-type: line-dot,area, bar
#data-label: one, two, three
#data-color: #0066cc, #6600cc, yellow
Jan,2., 3., 4
Feb,3., 4., 7
Mar,5., 10., 1
Apr,6., 2., 10
May,7., 1., 15
Jun,8., 9., 4
EOD;
$lines=preg_split( '/\n/', $datastr1);
$data= new dataHandling( );
$data->parseString( $lines);
$graph= new makeGraph("jpgraph", $data);
$img= $graph->doPlot();
header('content-type:image/png');
print $img;
ここで、dataHandling.phpはテキストファイル又は文字列から、チャート属性及びCSV形式データを取り出し、格納するオブジェクトクラスである。
インストールは、makeGraph-20071019.tar.gzをダウンロードし、一つのフォルダー内に展開し、以下の手順を行う。
- jpgraphをインストールする。インストール場所はrequire('jpgraph/...')によりアクセス可能な場所である。
- PEAR::Logをインストールする。
タイトルに日本語を利用したい場合は、jpgraphのマニュアルに従い、日本語フォントの設定を行う。例えばFC6の場合は/usr/share/pear/jpgraph/jpg-config.inc.phpの以下の記述を確認・修正する。
DEFINE("MBTTF_DIR","/usr/share/fonts/japanese/TrueType/");
// Japanese TrueType font used with FF_MINCHO, FF_PMINCHO, FF_GOTHIC, FF_PGOTHIC
DEFINE('MINCHO_TTF_FONT','sazanami-mincho.ttf');
DEFINE('PMINCHO_TTF_FONT','sazanami-mincho.ttf');
DEFINE('GOTHIC_TTF_FONT','sazanami-gothic.ttf');
DEFINE('PGOTHIC_TTF_FONT','sazanami-gothic.ttf');
続いて、makeGraph-config.phpのfonts settingを変更する。詳しくはmakeGraph-config.phpのコメント参照のこと。
なお、さざなみフォントを使用した場合、X及びY軸のタイトルも日本語を利用できるが、Y軸タイトルが横書きとなり使用には耐えない。一般利用者向けIPAフォントaを使うと縦書きにも対応できるが、文字間隔が少し変である。
| 固定リンク

コメント