Return Main Page
「まさ」のあれこれWeblog
Return Preview Page
フリーCGI/ジョギンググラフ表示


 自身の(毎日?の)ジョギング成果をグラフ表示するCGIです。
例えば、エクセル等でデータ入力・グラフ表示・HTMLに変換・アップロードで、これらのグラフを自分のホームページに表示することはできますよね。
このCGIは日にち・走行距離・時間・調子をWEB上で入力し、そのデータについて範囲指定してあげることで、簡単にグラフの表示ができますので、面倒なHTMLへの変換作業が不要です。データを入れることで、常に新しい走行結果を自身のホームページ上で公開することができます。


サンプルはこちら


ダウンロードはこちらをクリック
Ver 1.00(2003.3.2)新規アップロード




「設置方法 」

■rungraph???.lzhを解凍後、↓のファイルがあるか確認して下さい

ファイル名 パーミッション 説 明 設置ディレクトリ
runinput.cgi 755 データ入力・修正・削除スクリプト cgi
rungraph.cgi 755 グラフ表示スクリプト cgi
admi.htm 644 データ入口パスワード入力 cgi
run.txt 666 データ用空ファイル cgi
cgi-lib.pl 644 フォームデコードライブラリ cgi
jcode.pl 644 日本語コード変換ライブラリ cgi
graph1_?????.gif 644 グラフ用画像(5種) cgi


cgi-lib.pl
フォームデコード用のファイルです。Steven E. Brenner氏によるスクリプトです
jcode.pl
日本語コード変換用ファイルです。Kazumasa Utashiro氏によるスクリプトです。


(1)まずエディター等でruninput.cgiを開いて必要項目の編集をします。(これはデータ入力・修正・削除用スクリプトです)

a.最初の行を自分のサーバーのperlディレクトリに会わせます。分からない場合はプロパイダーもしくはサーバー管理者にお問い合わせください
#!/usr/local/bin/perl

b.ログファイル名の設定 ファイル名を変えたら下記(3)も設定してください。
→$logfile = "./run.txt";
(このままでもかまいませんが、このCGIを使ってる人は、デフォルトがrun.txtであることを知っていますから、あなたのデータを簡単に覗くことができちゃうかもしれません。まぁ、あくまでも覗かれる程度ですが・・このファイル名を変えておくと、その心配は無くなると思います。)

c.管理用パスワードの設定
→$admin_pass = 'pass';
(適当なパスワードに変更しておいてください。データ入力・修正・削除の際使用します。)

d.基本的な各種データの設定。(デフォルトの設定)
→$comm_dist = '12';  (走行距離です。km単位)
→$comm_dist2 = '500'; (走行距離です。100m単位)
→$comm_time = '1';  (走行時間です。時単位)
→$comm_time2 = '30';  (走行時間です。分単位)
(これは入力のデフォルトとして、走行距離が12km500m。走行時間が1時間30分の例です。
データ入力する際に、デフォルトで入っている走行距離や時間です。これを普段の自分の実績にあわせておくと、入力を簡単にすることができます。単位に注意して半角で入力してください。)




(2)続いてエディター等でrungraph.cgiを開いて必要項目の編集をします。(これはグラフ表示用スクリプトです)

a.runinput.cgiと同様に最初の行を自分のサーバーのperlディレクトリに会わせます。分からない場合はプロパイダーもしくはサーバー管理者にお問い合わせください
#!/usr/local/bin/perl

b.ログファイル名の設定 ファイル名を変えたら下記(3)も設定してください。
→$logfile = "./run.txt";
(runinput.cgiと同様にログファイル名を設定します。runinput.cgiで設定したファイル名と同一の物にしてください。このままでもかまいません。)

c.タイトルの設定
→$title = 'Run Graph';
(グラフが表示されるページのタイトルです。)

d.色設定
→$bg_color="FFFFFF";  (バックグランドの色です。)
→$title_bgcolor="#696969" ; (1番上のタイトルのバックグランドカラー)
→$title_ftcolor="#FFFFFF" ; (1番上のタイトルのフォントカラー)
→$under_bgcolor="#808080"; (グラフタイトルのバックグランドカラー)
→$under_size="600"; (グラフタイトルの横幅(ピクセル)
→$point="#FFFF00"; (グラフタイトルのポイント(■)の色)
→$items="#FFFFFF"; (グラフタイトルのフォントカラー)
→$graph_word_font_color="#696969" ;(グラフ日付・☆・値のフォントカラー)
→$graph1 = "./graph1_brown.gif"; (棒グラフのデザイン)
(各種色の設定です。ご自身の好みに応じて設定してください。)

d.「戻る」ボタンの表記
→$back_word = "戻る";
(戻るのリンクの表記の仕方です。backとしてもいいと思います。)

e.下タイトルの設定
→$footer_title= "www2a.biglobe.ne.jp/~motohasi/";
(グラフが表示されるページの下に書かれるタイトルです。)

f.グラフタイトル
→$graph1_title="日毎ランニング距離(km)";
→$graph2_title="日毎ランニング累計距離(km)";
→$graph3_title="月毎ランニング距離(km)";
→$graph4_title="月毎ランニング累計距離(km)";
→$graph5_title="日毎ランニング時間(分)";
→$graph6_title="日毎ランニング累計時間(分)";
→$graph7_title="月毎ランニング時間(分)";
→$graph8_title="月毎ランニング累計時間(分)";
(用意されているグラフ毎のタイトルです。)

g.グラフ横軸MAX
→$graph1_max=20; (1日の最大ランニング距離(km))
→$graph2_max=200;(日毎累計の合計ランニング距離(km))
→$$graph3_max=200;(1月の最大ランニング距離(km))
→$graph4_max=2000;(月毎累計の合計ランニング距離(km))
→$graph5_max=180;(1日の最大ランニング時間(分))
→$graph6_max=3600;(日毎累計の合計ランニング時間(分))
→$graph7_max=3600;(1月の最大ランニング時間(分))
→$graph8_max=36000;(月毎累計の合計ランニング時間(分))
(各グラフの横軸の最大値の設定です。単位に注意して半角で入れてください。)

h.グラフ表示の可否
→$graph1_ok="OK";
→$graph2_ok="OK";
→$graph3_ok="OK";
→$graph4_ok="OK";
→$graph5_ok="OK";
→$graph6_ok="OK";
→$graph7_ok="OK";
→$graph8_ok="OK";
(これをOK以外にしておくと、URL上でグラフ表示を命令しても表示はされません。第3者に自分の意図しないグラフを見せないようにする処置です。)

i.フィーリング表示の可否
→$feeling_op="OK";
(これをOK以外にしておくと、URL上でフィーリング表示を命令しても表示はされません。第3者に自分の意図しないグラフを見せないようにする処置です。)


(3)データファイルを作成します。(1)・(2)のところでデフォルトのデータファイル名(run.txt)を変更した場合は解凍してできた空ファイル(run.txt)の名前をそれに変更してください。
もしくは下記方法であらたに空ファイルを作ってください。
空ファイルの作り方はいろいろありますが、一番簡単なのは、windowsのアクセサリーに付属しているメモ帳を利用があります。
メモ帳を開いて、何も書きこみをしないまま、名前を付けて保存を選びます。そこで、(1)・(2)の
runinput.cgi、rungraph.cgi中のデータファイル名の設定で指定したファイル名を入力して、空ファイルを作成します。

(4)続いて今修正した二つのファイルを含む解凍してできた11のファイルをcgiというディレクトリにアップロードします。また、パーミッションを以下のように設定してください。

runinput.cgi  
755
rungraph.cgi  
755
admi.htm  
644
cgi-lib.pl  
644
jcode.pl  
644
run.txt  
666 *ファイル名を変えている場合はそのファイルのパーミッションを設定。
graph1_?????.gif  
644

(5)以上まとめると以下のようなディレクトリー構造になります
------
 |
 -cgi
   |runinput.cgi
   |rungraph.cgi
   |admi.htm
   |cgi-lib.pl
   |jcode.pl
   |run.txt  もしくは設定したファイル
   |graph1_?????.gif
   |  :
   |  :
   |

「使用方法 」

==データ入力・修正・削除==
(1)admi.htmにアクセスします。

(2)パスワード入力画面が出てきますので、runinput.cgiに入力したパスワードを入力してください。

(3)「データの入力」
     走行した年月日、距離、時間及びその時の調子(フィーリング)を入力します。

   「データの閲覧・修正・削除」
     既に入力してあるデータを閲覧・修正・削除できます。修正・削除したい場合は該当するデータをチェックした後、修正または削除してください。


==グラフ表示==
(1)以下のようなURLにアクセスすれば自動的にグラフ表示されます。
あなたのHPのURLに次のようなオプションを付加します。

(あなたのHPのURL)/cgi/rungraph.cgi?no=1&from=20030131&to=20030331&feel=1

   no・・・グラフの種類です。

no グラフ名
1 日毎ランニング距離
2 日毎ランニング累計距離
3 月毎ランニング距離
4 月毎ランニング累計距離
5 日毎ランニング時間
6 日毎ランニング累計時間
7 月毎ランニング時間
8 月毎ランニング累計時間
   from・・・データの開始年月日です。(例:2002年9月15日なら20020915)
   to・・・データの終了の年月日です。(例:2003年12月1日なら20031201)
   feel・・・調子表示付きをする場合は1を入れます。

(例)
1のグラフを2003年1月31日から2003年3月31日まで調子表示付きでグラフ化
   ....../rungraph.cgi?no=1&from=20030131&to=20030331&feel=1
2のグラフを2002年1月1日から2003年12月31日までグラフ化
   ....../rungraph.cgi?no=2&from=20020101&to=20031231&feel=0


「参考」
・実際のグラフはデータが入っているところから始まります。
つまり、グラフの表示範囲を2002年1月1日にしたとしても、データが2月15日から入っていれば、2月15日から表示が開始されます。
・同様に最終のデータのところまでしかグラフ表示しません。
表示範囲が12月31日まででも、実際のデータが10月1日までしか入っていなければ、それ以上はグラフ化されません。
・意味もなくデータの範囲は広げないでください。例えばデータ範囲を1900年1月1日から2100年12月31日とかの設定もできますが、ずーっと、その範囲を計算しています。つまり無意味にサーバーのCPUを動かすことになりますので、できるだけ必要な範囲を指定してあげてください。
・グラフの種類(no)や、調子表示指定(feel)を設定しても、rungraph.cgiの中で、表示しないという設定をしている場合は、表示することができません。


作者ブログはこちら