最終更新日：2008.04.22
webmaster@kototone.jp
こととねは、クリエイティブ・コモンズ・ライセンス（表示 - 継承 2.1 日本）の下でライセンスされています。
4月9日のこと、web拍手経由でリクエストをいただいた。いわく、解析画面の下部に表示される過去n日間の解析のグラフを、縦型の表示から横型の表示に変更したいということであった。しかし、そんなことができるのだろうか？ いや、そりゃできるんだけど。それも割と簡単にできてしまう。どちらかといえば手間のかからない改造といえるだろう。
今回の改造は簡単だ。なので、一度に置き換えるべきコードを紹介しよう。なお、置き換えられるもとのコードはkaiseki.cgiの133行目、print "<table border>¥n";からはじまり、168行目、print "</table><br><br>¥n";までの36行分である。これを以下のとおりに書き換えることで、グラフが縦の棒グラフから横の棒グラフに変わるはずだ。
print "<table border>¥n";
print "<thead>¥n<tr><th>日時</th><th>数値</th><th>グラフ</th></tr>¥n</thead>¥n<tbody>¥n";
#---------------グラフ
for ($i = 0; $i <= 13; $i++) {
print '<tr style="height: 2em; font-size: small;">'."¥n";
$day = $i;
&dateload;
print "<td style=¥"text-align: right;¥"><a href=¥"$base?$pass&$i¥">$tomon月$today日</a></td>¥n";
print "<td style=¥"text-align: right;¥">$pasttotal[$i]</td>¥n";
if ($pastmax) {
$graph = $pasttotal[$i] / $pastmax * 400;
print "<td style=¥"width: 400px; text-align: left;¥"><img src=¥"$graph1¥" height=¥"10¥" width=¥"$graph¥" border=¥"0¥"></td>¥n";
} else {
print "<td style=¥"width: 400px; text-align: left;¥"><img src=¥"$graph1¥" height=¥"10¥" width=¥"0¥" border=¥"0¥"></td>¥n";
}
print '</tr>'."¥n";
}
print "</tbody>¥n</table><br><br>¥n";ただ、これを単純に置き換えてしまうと、場合によっては問題が生じる。それは、私の紹介した改造、ログ保存期間を変更するあるいはweb拍手支援cgiのバージョン3をお使いである場合だ。そう、上に紹介したコードのままでは、ログの保存期間を変更したとしても過去14日分のログしか表示されない。だから、ログ保存期間変更の改造をほどこしている場合は、上のコードに少し手を入れてやらなければならない。
まずはその改造箇所を特定する必要がある。なお今回の改造は、web拍手支援cgi 3の改造説明に基づいて説明するので注意いただきたい。
今回置き換えられたコードは、kaiseki.cgiオリジナルでいうところの133行目から168行目までであった。この36行中で変更する必要があったのは、136行目、150行目、159行目の三箇所である。すなわち、上記コードからこの三箇所に同様の部分を見つけ出して、改造してやればいい。そしてそれはどこかというと、forに続いて出現する括弧内、そう、連続したハイフンに続いてグラフと書かれたコメント、その次の行だ。
#---------------グラフ
for ($i = 0; $i <= 13; $i++) {#---------------グラフ
for ($i = 0; $i < $storagelife; $i++) {ログの保存期間（日数）がセットされている変数$storagelifeの名前は、各自名付けたものに変更していただきたい。以上で、縦棒グラフが横棒グラフになり、かつログ保存期間の変更にも対応する。
ここでもう一点改造を加えるとすれば、それは縦グラフと横グラフを切り替えられるようにすることだろう。その方法については特に説明しないが、以前メッセージのランダムと非ランダムを切り替える改造を行った記事が参考になることだろうと思う。そう、縦横を切り替えるスイッチとなる変数を作り、ifで分岐させるというやり方だ。
さらに改造をするというなら、web拍手支援cgi 3を改造し、各種設定変更機能にグラフの方向切り替えのスイッチをつけてやることだろうか。けれどこれは説明が大変そうなので、ここでは扱わないこととする。
< web拍手支援cgi：各種設定変更機能を有効にする web拍手改造：拍手ページに項目を追加する >