position: absolute;

選択されているタグ : canvas

canvasでの画像加工 最初の一歩

GraphicalWeb (CSS, SVG, WebGL etc) Advent Calendar 2012

adventar

GraphicalWeb Advent Calendar 2012 の 5日目の記事です。

(おそらく)はじめまして、よろしくお願いします。GraphicalWeb Advent Calendar 2012のエントリーとしてcanvasについて書きます。

canvasについては改めて説明はしませんが、これからcanvasについて知ろうという方はHTML5.jpの記事が参考になると思います。

というわけでcanvasで行う画像の加工について書きます。元々描画機能もありますし、画像の重ねあわせというのも可能ですが、今回はcanvas内の画像の各ピクセルの情報取得とその編集/変更についてになります。

※今回のデモなどは一応HTML5が動作するブラウザを想定して作成していますが、あらゆる環境での動作を保証するものではありません。ご理解の程おねがいします。