canvas : 画像の合成方法いろいろ - WebOS Goodies

使い方がわかったところで、実際に試してみましょう。以下のサンプルでは、合成モードを変更して効果の違いを確かめられます。ついでに描画する図形（パス or ビットマップ画像）、透明度、描画色なども変更できますので、それぞれを組み合わせてどのような効果が得られるかも確認できるようにしておきました。 ※ペンギンの画像は Image * After で公開されていたものを Flickr に保存して利用しています。 ディスティネーション画像の下半分は半透明で描画しています。ただし Opera では画像に対する半透明指定は機能しません。また、透明部分が確かめやすいように背景画像を設定していますが、この背景は CSS の background-image プロパティーによるものであるため、 globalCompositeOperation の影響を受けずに描画されます。ソースは以下のようになっています（簡

[field_combat]

レイヤー効果が使えるらしい。試すこと

[tsukkee]

やっぱIEエンジンはいけてない

[wacky]

canvas要素による画像合成の指定方法と効果の解説。現時点の実装バグについても。

[adamrocker]

canvas は JavaScript で高度なグラフィック処理ができる新しい HTML 要素。

[hokousya]

canvasで使える合成モードのご紹介とデモがあります。