棒グラフを作りたい

数値だけよりもグラフがあった方が分かりやすい資料というのは、たくさんありますね。そこで、Web上で棒グラフを実現してみましょう。
表計算ソフトなどのグラフをキャプチャして画像にするよりも、HTMLで作っておく方が、書き換え・書き足しが簡単で便利です。

今回ご紹介する方法で作ることのできる棒グラフの例:

時間別アクセス数
00~02時: 1028 1028
02~04時: 427 876
04~06時: 78 322
06~08時: 56 56
09~10時: 258 258
10~12時: 297 297
12~14時: 527 527
14~16時: 494 494
16~18時: 731 731
18~20時: 604 604
20~22時: 621 621
22~24時: 987 987

使用OS
Windows XP: 42% 42
Windows 2000: 13% 13
Windows Me: 8% 8
Windows 98: 12% 12
Windows 95: 2% 2
Mac OS X: 6% 6
Mac OS 9: 3% 3
UNIX: 12% 12
Other: 2% 2

棒グラフが何本でも画像は1つ

さて、上記のグラフは、棒の部分に画像を使用しています。ただし、使用している画像は、それぞれのグラフにつき1つずつ、次の2つだけです。

1:
2:

この画像で、自由な長さで何本でも棒グラフを描けます。
どうやって作成しているのでしょうか。次のページから具体的にご紹介致します。

その方法は、次のページで! →