とりぷるぷぅ技術メモ: [CakePHP][pChart]pChart を使用してグラフを描く

pChart を利用して棒グラフとレーダーチャートを描く。
Example: views の exam_all.ctp

<body>
<table>
  <tr>
    <th>Name</th>
    <th>Math</th>
    <th>English</th>
    <th>Physics</th>
  </tr>
  <?php
 foreach ($users as $user) {
  echo "<tr>\n";
  echo "<td>" . $user['User']['username'] . "</td>\n";
  echo "<td>" . $user['Exam']['math'] . "</td>\n";
  echo "<td>" . $user['Exam']['english'] . "</td>\n";
  echo "<td>" . $user['Exam']['physics'] . "</td>\n";
  echo "</tr>\n";
 }
  ?>
</table>
<img src="exam_all_graph" />
<img src="exam_all_radar" />
</body>

Example: exams_controller.php

function exam_all() {
 $users = $this->User->find('all');

 $this->set('users', $users);
 Cache::write('users', $users);
}

function exam_all_graph() {
 /* pChart を使用する */
 App::import('Vendor', 'pchart/pdata');
 App::import('Vendor', 'pchart/pchart');

 $font_path = "c:\Windows\Fonts\sazanami-gothic.ttf";

 /* Cache に保存された値を読み込む */
 $users = Cache::read('users');
 if ($users == false) {
  /* DB から値を取得 */
  $users = $this->User->find('all');
 }
 else {
  /* exam_all_radar() でも使用するので cache を削除しない */
 }

 $mathScore = array();
 $englishScore = array();
 $physicsScore = array();
 $name = array();

 foreach ($users as $user) {
  array_push($mathScore, $user['Exam']['math']);
  array_push($englishScore, $user['Exam']['english']);
  array_push($physicsScore, $user['Exam']['physics']);
  array_push($name, $user['User']['username']);
 }

 $data = new pData;
 $data->AddPoint($mathScore, "math");
 $data->AddPoint($englishScore, "english");
 $data->AddPoint($physicsScore, "physics");
 $data->AddPoint($name, "name");
 $data->AddSerie("math");
 $data->AddSerie("english");
 $data->AddSerie("physics");
 $data->SetAbsciseLabelSerie("name");
 $data->SetSerieName("数学", "math");
 $data->SetSerieName("英語", "english");
 $data->SetSerieName("物理", "physics");

 $chart = new pChart(700, 230);
 $chart->setFontProperties($font_path,8);
 $chart->setGraphArea(50, 30, 680, 200);

 /* グラフに背景色をつける */
 $chart->drawFilledRoundedRectangle(7,7,693,223,5,240,240,240);

 /* グラフ背景に縁をつける */
 $chart->drawRoundedRectangle(5,5,695,225,5,230,230,230);

 /* グラフ領域に背景色をつける */
 $chart->drawGraphArea(255,255,255,TRUE);

 $chart->drawScale($data->GetData(),$data->GetDataDescription(),SCALE_START0,150,150,150,TRUE,0,2,TRUE);

 /* グリッド線を表示する */
 $chart->drawGrid(4,TRUE,230,230,230,50);

 /* chart に data を配置しグラフを描く */
 /* 棒グラフの場合は drawBarGraph */
 $chart->drawBarGraph($data->GetData(), $data->GetDataDescription(), TRUE);

 /* 凡例を追加する */
 $chart->setFontProperties($font_path,8);
 $chart->drawLegend(596,150,$data->GetDataDescription(),255,255,255);

 /* グラフタイトルを追加する */
 $chart->setFontProperties($font_path,10);
 $chart->drawTitle(50,22,"テスト結果",50,50,50,585);

 /* 画像として出力する */
 $chart->Stroke();
}

function exam_all_radar() {
 /* pChart を使用する */
 App::import('Vendor', 'pchart/pdata');
 App::import('Vendor', 'pchart/pchart');

 $font_path = "c:\Windows\Fonts\sazanami-gothic.ttf";

 /* Cache に保存された値を読み込む */
 $users = Cache::read('users');
 if ($users == false) {
  /* DB から値を取得 */
  $users = $this->User->find('all');
 }
 else {
  Cache::delete('users');
 }

 $scores = array();
 $name = array();

 foreach ($users as $user) {
  $score = array();
  $username = $user['User']['username'];
  array_push($score, $user['Exam']['math']);
  array_push($score, $user['Exam']['english']);
  array_push($score, $user['Exam']['physics']);
  $scores[$username] = $score;
  array_push($name, $username);
 }

 $data = new pData;
 $i = 0;
 foreach ($name as $username) {
  $data->AddPoint($scores[$username], "serie" . $i);
  $data->AddSerie("serie" . $i);
  $data->SetSerieName($username, "serie" . $i);
  $i++;
 }
 $data->AddPoint(array("math", "english", "physics"), "subject");
 $data->SetAbsciseLabelSerie("subject");

 $chart = new pChart(400, 400);
 $chart->setFontProperties($font_path,8);
 $chart->setGraphArea(30, 30, 370, 370);

 /* グラフに背景色をつける */
 $chart->drawFilledRoundedRectangle(7,7,393,393,5,240,240,240);

 /* グラフ背景に縁をつける */
 $chart->drawRoundedRectangle(5,5,395,395,5,230,230,230);

 /* chart に data を配置しグラフを描く */
 /* レーダーチャート */
 $chart->drawRadarAxis($data->GetData(), $data->GetDataDescription(), TRUE, 20, 120, 120, 120, 230, 230);
 $chart->drawFilledRadar($data->GetData(), $data->GetDataDescription(), 50, 20);

 /* 凡例を追加する */
 $chart->setFontProperties($font_path,8);
 $chart->drawLegend(15, 15, $data->GetDataDescription(), 255, 255, 255);

 /* グラフタイトルを追加する */
 $chart->setFontProperties($font_path,10);
 $chart->drawTitle(0,22,"テスト結果",50,50,50,400);

 /* 画像として出力する */
 $chart->Stroke();
}

とりぷるぷぅ技術メモ

2013年5月19日日曜日

[CakePHP][pChart]pChart を使用してグラフを描く

0 件のコメント:

コメントを投稿