2016/02/14 シェーダだけで世界を創る！three.jsによるレイマーチング GPU の熱でチョコも溶けちゃう！？ GLSL シェーダテクニック勉強会 @gam0022
2016/02/14 シェーダだけで世界を創る！three.jsによるレイマーチング GPU の熱でチョコも溶けちゃう！？ GLSL シェーダテクニック勉強会 @gam0022
Build and Share your best shaders with the world and get Inspired Latest contributions: "fractal glow 2" by nayk 10 minutes ago, "glow fractal " by nayk 13 minutes ago, "Jitter blend" by fakeljl 55 minutes ago, "Smokey Trail [287 Chars]" by SnoopethDuckDuck 1 hour ago, "infinite nested frame" by yufengjie 2 hours ago
こんにちは。tomohiroです。 概要 最近の4k/64k introでよく使われているレイマーチング(Ray marching)法について説明する。 レイマチーングとはレイトレーシング法の一種である。 レイマーチングではレイの始点から少しづつ進みながらシーン内のオブジェクトとの交点を求める。 シーン内のオブジェクトはDistance functionという関数で記述される。 なぜレイマーチング, Distance functionを使うのか Distance functionは数行程度のコードによって実装できるので, 小さなデータで3D形状を表現する事ができる。 複雑な形状も関数をいくつか組み合わせる事によって作る事ができる。 しかし三角形ポリゴンほど汎用的に形状を表現するのは難しい。 レイマーチングを使うと Distance functionで表現された形状を少しのコードでレンダリン
今日は、GLSLによるカートゥーンを紹介しようと思います。割と簡単にでき、それなりに見栄えがするからです。その応用として、輪郭線も描画します。 カートゥーンの原理 カートゥーンはセルアニメ調のレンダリングです。左下の図に示すように、頂点vにおいて、法線と光源ベクトル（頂点から光源へのベクトル）との内積（照度）を、右下の図のようなテクスチャのs座標に当てはめることで簡単に実現できます。 更に、次の図の左のように、視線ベクトルと法線の内積を考えると、輪郭となる部分はほぼ0になります。そのため、その内積をt座標に割り当てることで、輪郭線を実現できます。 s座標もt座標も単位ベクトル同士の内積で計算できますが、その範囲は-1～1になるため、テクスチャマッピング（glTexParameterによる指定）をクランプに設定する必要があります。 バーテックスシェーダ（頂点シェーダ） 今回は、頂点シェーダで
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
