HTML5のcanvasを使ってみた

Canvasを使っているのでRSSリーダーからは見れないと思います。

マウスイベントのclientXとclientYは、クライアント座標であって、canvasの左上を(0,0)とした座標ではないので、四角形を出現させる位置がずれていた。、offsetTopとoffsetLeftを使って修正したが、これは規格にはない。どうしたものか。

かなりやっつけ仕事。canvas上をクリックすると、どんどん四角形が増えていく。ドラッグすると面白いことになる。回転軸が四角形の中央でないのは仕様。バグだったけど、動きが面白かったので、あえて修正しなかった。

一つだけ気にくわない点がある。いわゆる拡大縮小や回転、移動は、行列で行えるのだが、"The transformations must be performed in reverse order."ってどういう事だ。なぜ逆なんだ。逆にしたら分かりやすくなるとでも思っているのか？　どう考えても混乱するだけだろ。あと、Identity Matirxにするメソッドぐらいほしい。なんでIdentity Matirxのような基本的なものを、手動で書かなければならないんだ。まあ、canvasが普及すれば、javascriptによるベクトルや行列計算のライブラリが発展するだろうが、それでも、FlashやSilverLightに勝てるとは思えない。