WebGL では GLSL というシェーダ言語を用いて、画像にフィルタをかけることが可能です。
半年くらい前から jsdo.it というサイトで色々試していましたが、本数が多くなって分かりにくくなってきたので、少しまとめてみました。
※ サンプルは 2019年のjsdo.it 終了に伴い github に移行しました。
サンプルは主に、以下からの移植したものとなっています。
■ Shadertoy BETA
https://www.shadertoy.com/■ GLSL Sandbox Gallery
http://glslsandbox.com/■ Filters〜世界一面白いカメラフィルターが、ここから生まれる。〜
http://filters.kayac.com
| タイトル | 画像 | サンプル | ソース |
|---|---|---|---|
| GLSL で画像にフィルタをかけてみるテスト |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（改） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（改2） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（改3） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（改4） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（改5） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（改6） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（改7） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（改8） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（改9） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（改10） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（改11） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その２） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その３） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その４） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その４改） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その４改2） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その５） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その５改） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その５改2） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その５改3） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その６） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その６改） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その７） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その７改） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その８） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その９） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その１０） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その１１） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その１２） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その１３） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その１４） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その１４改） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その１５） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その１５改） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その１５改2） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その１６） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その１７） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その１８） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その１９） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その２０） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その２０改） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その２０改2） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その２０改3） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その２１） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その２２） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その２３） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その２４） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その２５） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その２６） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その２７） |  |
Link | Link |
| GLSL で画像にフィルタをかけてみるテスト（その２８） |  |
Link | Link |