CanvasはHTML5においてWebの表現力を飛躍的に高めてくれるAPIですが、その使い方に慣れるまでが意外と面倒なものに感じます。通常のDOMのようにスタイル設定ですぐに表示を変化できるのではなく、描画した内容をリフレッシュしながら使わなければなりません。
そんなCanvasに柔軟性を持たせてくれそうなライブラリがcanvas-areaになります。
canvas-areaの使い方
デモです。まずはドラッグ。マウスで表示領域を変えられます。
次にズームイン/アウト。スクロールで表示する大きさを変えられます。
さらにCanvas自体の大きさをマウスで変えられます。
canvas-areaを使うと表示が静的に思えたCanvasが柔軟にコントロールできるようになります。マウスのドラッグやスクロールを使うので操作が直感的で、様々な場面で使えそうです。
canvas-areaはHTML5/JavaScript製のオープンソース・ソフトウェア（MIT License）です。
MOONGIFTの関連記事
コメント
