Cat Paw Software

この文書は読取専用です。文書のソースを閲覧することは可能ですが、変更はできません。もし変更したい場合は管理者に連絡してください。

====== HTML Canvas ======
HTML Canvasは、動的なビットマップデータの処理、表示をサポートするHTML要素。[[http://www.w3.org/TR/2dcontext/|HTML Canvas 2D Context]]はCanvas要素でビットマップ画像の描画と操作を行うためのAPI仕様である。

元々はAppleがDashboardのためにWebkitに追加したものだが、Firefox、Operaが採用し、[[HTML5]]で標準仕様化されることになった。

IEには実装されていないが、Googleからcanvasの一部機能をエミュレートする[[http://excanvas.sourceforge.net/|ExplorerCanvas]]というライブラリが提供されている。IE9で実装された。

===== 使用例 =====
画像をcanvasに貼り付けることができる。
  * canvasでimageに反射効果を加えるjQueryプラグイン、[[http://paulownia.jp/sample/jquery/reflect/|jquery.reflect.js]]

scaleメソッド
  * [[http://dev.paulownia.jp/sample/canvas/stretch.html|拡大縮小]]

画素を直接編集することもできる（Firefox 3、Opera 9.5、safari 4以降で対応）。画素の編集にはImageDataオブジェクトを使う。
  * [[http://dev.paulownia.jp/sample/canvas/grayscale.html|画像をグレースケール化]]
  * [[http://dev.paulownia.jp/sample/canvas/nega.html|ネガ反転]]
  * [[http://dev.paulownia.jp/sample/canvas/nearest.html|ニアレストネイバー法による画素サンプリング]]
  * [[http://dev.paulownia.jp/sample/canvas/bilinear.html|バイリニア法による画素サンプリング]]
  * [[http://dev.paulownia.jp/sample/canvas/average.html|画素平均法による画像縮小]]
  * [[http://dev.paulownia.jp/sample/canvas/blur.html|ぼかし処理]]

その他のサンプル
  * [[http://dev.paulownia.jp/sample/canvas/frame.html|画像を枠を付ける]]