法線マップを用意してCanvas上でShadingするサンプル

何かこのページだいぶ前にメモったつもりだったんだけどな。

Normal Mapping with Javascript and Canvas





まあ、ラスタライズ後の処理だけ実装した感じだよね。これがあるだけで立体感がまるで違う。この例ではマウスでライトを制御してるけど、もちろん自動でライトの方向を三次元的にグルグル動かすことも可能なはず。(オブジェクトが動かないだけ)

これのサンプルコード見てて知ったんだけど、JavaScriptって関数の中に関数を記述する『クロージャ』ってのがあるのね。クロージャについてはもう少し勉強しよう。

ついでに
Realtime Raytracing in Javascript!
Path tracing a cornell box in Javascript

関連記事

Raytracing Wiki

TensorFlowでCGを微分できる『TensorFlow...

ジュラシック・パークの続編『ジュラシック・ワールド』

python-twitterで自分のお気に入りを取得する

iOSデバイスのためのフィジカル・コンピューティングツールキ...

Maya LTでFBIK(Full Body IK)

ZBrushでアヴァン・ガメラを作ってみる 壊れたデータの救...

Maya 2015から標準搭載されたMILA

クラスの基本

シン・ゴジラのファンアート

AnacondaとTensorFlowをインストールしてVi...

ラクガキの立体化 分割ラインの変更・バランス調整

SIGGRAPH論文へのリンクサイト

ラクガキの立体化 モールドの追加

昔Mayaでモデリングしたモデルをリファインしてみようか

Russian3DScannerのトポロジー転送ツール『Wr...

AndroidもopenGLも初心者さ (でもJavaは知っ...

フリーで使えるスカルプト系モデリングツール『Sculptri...

プログラミングスキルとは何か?

WordPress on Google App Engine...

IronPythonを使ってUnity上でPythonのコー...

NeRF (Neural Radiance Fields):...

OpenCVのfindEssentialMat関数を使ったサ...

SIGGRAPH 2020はオンライン開催

書籍『メイキング・オブ・ピクサー 創造力をつくった人々』を読...

OpenCVの三角測量関数『cv::triangulatep...

iPhone 3GSがますます欲しくなる動画

PGGAN:段階的に解像度を上げて学習を進めるGAN

UnityでLight Shaftを表現する

プロシージャル手法に特化した本が出てるみたい(まだ買わないけ...

ZBrushでアヴァン・ガメラを作ってみる モールドの彫り込...

胡散臭いデザインの参考サイト

『ピクサー展』へ行ってきた

タマムシっぽい質感

Managing Software Requirements...

ZBrushでUndo Historyを動画に書き出す

2012 昨日のクローズアップ現代を見た

ZBrushでアヴァン・ガメラを作ってみる 口のバランス調整

Raspberry Pi

OpenCV 3.1とopencv_contribモジュール...

Mean Stack開発の最初の一歩

ブログが1日ダウンしてました

コメント