【info】いつもいろいろなテストなどをページ内のあちこちでやっているので、重かったり、壊れていたりするf^^;ことも多いです。実験用ですので、カオス(混沌)をあえて意図したりもしますので、標準やValidとは無縁だったりしますが、何卒、ご了承ください ( _ _ b
こんなの作ってみました。
http://jsgt.org/lib/vector/graph/sample1.htm
この感動の、nanto_vi (なんと) さんのDrawingCanvas クラスを使わせていただきました。
先月のこの「かも日記」トップページのアクセスカウンターデータをJavaScriptでグラフ化しています。このサンプルは、単なる静的データの読込みですが、、、AjaSQLの遊び道具がまた増えた気が、、、。SafariやFirefox1.5b未満は、マシンしだいでちょと重いかも。
追記
高速化版
http://jsgt.org/lib/vector/graph/sample21.htm
追記 2008
jQuery版
http://jsgt.org/lib/jquery/plugin/jqchart/sample/v003/test-use-gradient.html
ども。結構いろいろ使えそうな気がしますよね。
ちなみに、
うちのP4 2.6G + WinIE6で、
ページのロード開始から描画終了まで0.078秒
P4 2.6G + Firefox 1.5b2で
ページのロード開始から描画終了まで0.032秒
P4 2.6G + Opera8.02で
ページのロード開始から描画終了まで0.015秒
iMac + Safari1.25
ページのロード開始から描画終了まで0.305秒
ただ、このベンチマークは、確かにページの最初でカウント開始して終わりでストップしているんですが、ブラウザのレンダリングは、その後始まるようですので、そこで、ブラウザごとの体感速度の開きがでてきます。Macは、そこがちょっと不得意な感じです。
高橋 ( 2005年10月09日 23:48 )これで、今までサーバー側の役割だったSQLも、グラフィックもJavaScript側で操作できることになったわけです、、、。ちょっとした、構造変革な気がします。
( 2005年10月10日 11:15 )DELLノート INSPIRON 4100 PEN3 1000MHz メモリ384MB
WinXP + IE6 一回目
ページのロード開始から描画終了まで6.349秒
二回目
ページのロード開始から描画終了まで0.42秒
二回目が早い理由はどこかなぁ。。
>y <= 200
あ〜、、、f^^;;ありがとうございます。面目ない。と、よく見たらy軸の上下も勘違いしてたので直しました(^^;;。
>Operaには動的なSVG要素の生成に回数制限
なぜ、なんでしょうね。。。
| 日 | 月 | 火 | 水 | 木 | 金 | 土 |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | 4 | 5 | 6 | |
| 7 | 8 | 9 | 10 | 11 | 12 | 13 |
| 14 | 15 | 16 | 17 | 18 | 19 | 20 |
| 21 | 22 | 23 | 24 | 25 | 26 | 27 |
| 28 | 29 | 30 |



