Lightbox Info Board : SQLの窓

必要なライブラリ

1) Image_Color : GD が有効になっている必要がある
http://pear.php.net/package/Image_Color2/download

2) Image_Canvas
http://pear.php.net/package/Image_Graph/download

3) Image_Graph
http://pear.php.net/package/Image_Canvas/download

4) Numbers_Roman と Numbers_Words ( おそらくグラフ作成には必要無いと思われます )

5) 日本語を使用する場合は日本語フォント

インストール方法
http://lightbox.matrix.jp/ginpro/patio.cgi?mode=view2&f=154&no=3&w=710&type=ref

↓API マニュアルページです
http://pear.php.net/package/Image_Graph/docs/latest/

↓PEAR からリンクされているサンプル集( 以下のサンプルはここにあったものを加工しています )
http://pear.veggerby.dk/samples/

円グラフの凡例を表示するには、以下のバグを自分で修正する必要があります
http://pear.php.net/bugs/bug.php?id=8055

>[2006-10-30 13:27 UTC] chrismir (Chris van de Wouw)
>I confirm this same bug. In fact I had it some time ago
>and solved it by removing (remarking) two lines.

>In file Image/Graph/Plot/Pie.php

>Line 502: // $this->_clip(true);
>Line 616: // $this->_clip(false);

>I can't remember how I got this, Probably through irc.

IE の右クリックで PNG として保存できるようにするには、Canvas.php の以下をコメントにします


    function show($params = false)
    {
        if ($params === false) {
            header('Expires: Tue, 2 Jul 1974 17:41:00 GMT'); // Date in the past
            header('Last-Modified: '.gmdate('D, d M Y H:i:s').' GMT'); // always modified
//            header('Cache-Control: no-cache, must-revalidate'); // HTTP/1.1
            header('Pragma: no-cache');
        }
    }

折れ線グラフのサンプルコード


<?
// **************************************************************
// * 折れ線グラフのサンプルです。
// * 基本的に、二つのエリアをセットで表示するように設計されて
// * いるようなので、必要に応じて組み合わせます。
// * 
// * フォントは、GD に依存していますので、ファイルを指定できます
// * ( UTF-8 文字列で渡す必要があります )
// * ※ このソースは SHIFT_JIS です
// **************************************************************

require_once 'Image/Graph.php'; 

// (1) キャンバス作成
$param = array(array('width' => 400, 'height' => 400, 'canvas' => 'png'));
$Graph =& Image_Graph::factory('graph', $param); 

// フリー日本語フォント
// PEAR/Image/Canvas/Fonts/fontmap.txt で相対パス指定可能
// ( 例 : elenat,../../../php/elenat.ttf )
// 直接指定ならばパスを指定する
// ( 例 : $Graph->addNew('font', '../../temp/elenat') )
// ( 例 : $Graph->addNew('font', 'C:\\TEMP\\elenat') )
// ( 例 : カレントに置いて、$Graph->addNew('font', 'elenat') )

// (2) フォントオブジェクトを作成
$Font =& $Graph->addNew('font', 'elenat'); 

// (3) キャンバスにフォントを適用
$Graph->setFont($Font); 

// (4) タイトルとデータをプロットするエリアを作成する
$img_text = mb_convert_encoding('日本語でのサンプルです',"UTF-8","SJIS");
$Graph->add( 
	Image_Graph::vertical( 
		// タイトルエリア( 上 )
		Image_Graph::factory('title', array($img_text, 18)),
		// グラフ関連エリア( 下 )
		Image_Graph::vertical( 
			// グラフエリア( 上 )
			$Plotarea1 = Image_Graph::factory('plotarea'),
			// 凡例エリア( 下 )
			$Legend = Image_Graph::factory('legend'),
			90	// グラフの占める縦のパーセンテージ
		),
		20 // タイトルが占める縦のパーセンテージ
	)
);
// (5) データと凡例を関係付ける
$Legend->setPlotarea($Plotarea1);

// (6)プロットするデータを作成( セット1 )
$Dataset1 =& Image_Graph::factory('dataset'); 
$Dataset1->addPoint('a', 19);
$Dataset1->addPoint('b', 12);
$Dataset1->addPoint('c', 16);
$Dataset1->addPoint('d', 7);
$Dataset1->addPoint('e', 21);
$Dataset1->addPoint('f', 14);
$Dataset1->addPoint('g', 16);

// (7) 凡例
$img_text = mb_convert_encoding('Aタイプ',"UTF-8","SJIS");
$Dataset1->setName($img_text);

// (8) エリアにラインとして描画
$Plot1 =& $Plotarea1->addNew('line', array(&$Dataset1)); 
$Plot1->setLineColor('red');

// (9) プロットするデータを作成( セット2 )
$Dataset2 =& Image_Graph::factory('dataset'); 
$Dataset2->addPoint('a', -3); 
$Dataset2->addPoint('b', 10); 
$Dataset2->addPoint('c', 12); 
$Dataset2->addPoint('d', 10); 
$Dataset2->addPoint('e', 15); 
$Dataset2->addPoint('f', 16); 
$Dataset2->addPoint('g', 20); 

// (10) 凡例
$img_text = mb_convert_encoding('Bタイプ',"UTF-8","SJIS");
$Dataset2->setName($img_text);

// (11) エリアにラインとして描画
$Plot2 =& $Plotarea1->addNew('line', array(&$Dataset2)); 
$Plot2->setLineColor('blue'); 

// (12) 軸の終点に矢印を描画
$AxisY1 =& $Plotarea1->getAxis('y'); 
$AxisY1->showArrow();
$AxisX1 =& $Plotarea1->getAxis('x'); 
$AxisX1->showArrow();

// (13) グラフを画像として出力
$Graph->done( ); 
?>

実行結果

棒グラフのサンプルコード


<?
// **************************************************************
// * 棒グラフのサンプルです。
// * データをランダムに発生させています
// **************************************************************

require_once 'Image/Graph.php'; 

// キャンバス作成
$param = array(array('width' => 400, 'height' => 400, 'canvas' => 'png'));
$Graph =& Image_Graph::factory('graph', $param); 

// フリー日本語フォント
// PEAR/Image/Canvas/Fonts/fontmap.txt で相対パス指定可能
// フォントオブジェクトを作成
$Font =& $Graph->addNew('font', 'elenat'); 

// キャンバスに適用
$Graph->setFont($Font); 

// タイトルとデータをプロットするエリアを作成する
$img_text = mb_convert_encoding('データをランダムに発生',"UTF-8","SJIS");
$Graph->add( 
	Image_Graph::vertical( 
		Image_Graph::factory('title', array($img_text, 18)),
		Image_Graph::horizontal( 
			$Plotarea1 = Image_Graph::factory('plotarea'), 
			$Plotarea2 = Image_Graph::factory('plotarea'), 
			100		// 二つのグラフのうち最初のグラフの
					// 占める横のパーセンテージ
		),
		20	// タイトルが占める縦のパーセンテージ
	)
);

// データをランダム発生( データ数, 最小, 最大, 0 が必要か )
$Dataset =& Image_Graph::factory('random', array(10, 2, 15, false)); 

// 棒グラフをエリアに描画
$Plot =& $Plotarea1->addNew('bar', array(&$Dataset)); 

// 線の部分(箱)の色
$Plot->setLineColor('gray'); 

// 箱の中の色( 色@濃度 )
$Plot->setFillColor('blue@0.2'); 


// 軸の終点に矢印を描画
$AxisY1 =& $Plotarea1->getAxis('y'); 
$AxisY1->showArrow();
$AxisX1 =& $Plotarea1->getAxis('x'); 
$AxisX1->showArrow();

// グラフを画像として出力
$Graph->done( ); 
?>

実行結果

凡例を使用した折れ線グラフ


<?
// **************************************************************
// * 折れ線グラフのサンプルです。
// * 二つ目のエリアを凡例として使用し、データの表示も行っています
// **************************************************************

require_once 'Image/Graph.php'; 

// キャンバス作成
$param = array(array('width' => 400, 'height' => 400, 'canvas' => 'png'));
$Graph =& Image_Graph::factory('graph', $param); 

// フリー日本語フォント
// PEAR/Image/Canvas/Fonts/fontmap.txt で相対パス指定可能
// フォントオブジェクトを作成
$Font =& $Graph->addNew('font', 'elenat'); 

// キャンバスに適用
$Graph->setFont($Font); 

// タイトルとデータをプロットするエリアを作成する
$img_text = mb_convert_encoding('凡例を使用しています',"UTF-8","SJIS");
$Graph->add( 
	Image_Graph::vertical( 
		Image_Graph::factory('title', array($img_text, 18)),
		Image_Graph::vertical( 
			$Plotarea1 = Image_Graph::factory('plotarea'), 
			$Plotarea2 = Image_Graph::factory('legend'), 
			90		// 二つのグラフのうち最初のグラフの
					// 占める横のパーセンテージ
					// エリアを縦に使っています
		),
		20	// タイトルが占める縦のパーセンテージ
	)
);

// 二つ目のエリアを凡例用に使用
$Plotarea2->setPlotarea($Plotarea1);

// プロットするデータを作成( セット1 )
$Dataset[0] =& Image_Graph::factory('dataset'); 
$Dataset[0]->addPoint('a', 19);
$Dataset[0]->addPoint('b', 12);
$Dataset[0]->addPoint('c', 16);
$Dataset[0]->addPoint('d', 7);
$Dataset[0]->addPoint('e', 21);
$Dataset[0]->addPoint('f', 14);
$Dataset[0]->addPoint('g', 16);
// 凡例のタイトル設定
$img_text = mb_convert_encoding('タイプA',"UTF-8","SJIS");
$Dataset[0]->setName( $img_text );

// プロットするデータを作成( セット2 )
$Dataset[1] =& Image_Graph::factory('dataset'); 
$Dataset[1]->addPoint('a', -3); 
$Dataset[1]->addPoint('b', 10); 
$Dataset[1]->addPoint('c', 12); 
$Dataset[1]->addPoint('d', 10); 
$Dataset[1]->addPoint('e', 15); 
$Dataset[1]->addPoint('f', 16); 
$Dataset[1]->addPoint('g', 20); 
// 凡例のタイトル設定
$img_text = mb_convert_encoding('タイプB',"UTF-8","SJIS");
$Dataset[1]->setName( $img_text );

// エリアにラインとして描画
$Plot =& $Plotarea1->addNew('line', array($Dataset)); 

// データ別の色指定
$FillArray =& Image_Graph::factory('Image_Graph_Line_Array'); 
$FillArray->addColor('blue'); 
$FillArray->addColor('red'); 
$Plot->setLineColor($FillArray); 

// データの値を表示
$Marker =& $Plot->addNew('Image_Graph_Marker_Value', IMAGE_GRAPH_VALUE_Y); 
$Plot->setMarker($Marker);     
$Plot->setDataSelector(Image_Graph::factory('Image_Graph_DataSelector_NoZeros')); 

// 軸の終点に矢印を描画
$AxisY1 =& $Plotarea1->getAxis('y'); 
$AxisY1->showArrow();
$AxisX1 =& $Plotarea1->getAxis('x'); 
$AxisX1->showArrow();

// グラフを画像として出力
$Graph->done( ); 
?>

実行結果

凡例付き円グラフ

↓元は　http://pear.veggerby.dk/samples/show/id/misc03/ : のコードです


<?php 
/** 
 * Usage example for Image_Graph. 
 *  
 * Main purpose:  
 * Demonstrate radial gradient fillings 
 *  
 * Other:  
 * None specific 
 *  
 * $Id: misc03.php,v 1.4 2005/08/03 21:21:53 nosey Exp $ 
 *  
 * @package Image_Graph 
 * @author Jesper Veggerby <pear.nosey@veggerby.dk> 
 */ 

require_once 'Image/Graph.php'; 

// create the graph 
$Graph =& Image_Graph::factory('graph', array(400, 300)); 

// add a TrueType font 
$Font =& $Graph->addNew('font', 'elenat'); 
// set the font size to 7 pixels 
$Font->setSize(12); 

$Graph->setFont($Font); 
     
// create the plotarea 
$Graph->add( 
    Image_Graph::vertical( 
        Image_Graph::factory('title', array('このソースは utf-8n', 12)), 
        Image_Graph::horizontal( 
            $Plotarea = Image_Graph::factory('plotarea'), 
            $Legend = Image_Graph::factory('legend'), 
            70 
        ), 
        5             
    ) 
); 

$Legend->setPlotarea($Plotarea); 
//$Legend->setShowMarker(false);
         
// create the 1st dataset 
$Dataset1 =& Image_Graph::factory('dataset'); 
$Dataset1->addPoint('日本語', rand(1, 10)); 
$Dataset1->addPoint('表示', rand(1, 10)); 
$Dataset1->addPoint('凡例', rand(1, 10)); 
$Dataset1->addPoint('の', rand(1, 10)); 
$Dataset1->addPoint('テスト', rand(1, 10)); 
// create the 1st plot as smoothed area chart using the 1st dataset 
$Plot =& $Plotarea->addNew('pie', array(&$Dataset1)); 
$Plotarea->hideAxis(); 

// create a Y data value marker 
$Marker =& $Plot->addNew('Image_Graph_Marker_Value', IMAGE_GRAPH_PCT_Y_TOTAL); 
// create a pin-point marker type 
$PointingMarker =& $Plot->addNew('Image_Graph_Marker_Pointing_Angular', array(-40, &$Marker)); 
// and use the marker on the 1st plot 
$Plot->setMarker($PointingMarker);     
// format value marker labels as percentage values 
$Marker->setDataPreprocessor(Image_Graph::factory('Image_Graph_DataPreprocessor_Formatted', '%0.1f%%')); 

$Plot->Radius = 2; 

$FillArray =& Image_Graph::factory('Image_Graph_Fill_Array'); 
$Plot->setFillStyle($FillArray); 
$FillArray->addNew('gradient', array(IMAGE_GRAPH_GRAD_RADIAL, 'white', 'green')); 
$FillArray->addNew('gradient', array(IMAGE_GRAPH_GRAD_RADIAL, 'white', 'blue')); 
$FillArray->addNew('gradient', array(IMAGE_GRAPH_GRAD_RADIAL, 'white', 'yellow')); 
$FillArray->addNew('gradient', array(IMAGE_GRAPH_GRAD_RADIAL, 'white', 'red')); 
$FillArray->addNew('gradient', array(IMAGE_GRAPH_GRAD_RADIAL, 'white', 'orange')); 

$Plot->explode(5); 
        
$PointingMarker->setLineColor(false); 
$Marker->setBorderColor(false); 
$Marker->setFillColor(false); 
        
// output the Graph 
$Graph->done(); 
?>