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

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

Normal Mapping with Javascript and Canvas





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

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

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

関連記事

UnityでShaderの入力パラメータとして行列を渡す

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

ZBrushの練習 手のモデリング

ZBrushでゴジラ2001を作ってみる 身体のバランスを探...

MPC社によるゴジラ(2014)のVFXブレイクダウン

Mechanizeで要認証Webサイトをスクレイピング

ZBrushでリメッシュとディティールの転送

Maya API Reference

PyDataTokyo主催のDeep Learning勉強会

ZBrushでゴジラ2001を作ってみる 頭の概形作り

CycleGAN:ドメイン関係を学習した画像変換

タマムシっぽい質感

Pythonのソースコードに特化した検索エンジン『Nulle...

タダでRenderManを体験する方法

SIGGRAPH Asia

MFnMeshクラスのsplit関数

WordPressの表示を高速化する

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

UnityでOpenCVを使うには?

テスト

Twitter APIのPythonラッパー『python-...

スターウォーズ エピソードVIIの予告編

SONY製のニューラルネットワークライブラリ『NNabla』

Mayaのシェーディングノードの区分

TeleSculptor:空撮動画からPhotogramme...

Runway ML:クリエイターのための機械学習ツール

ZBrushでゴジラ2001を作ってみる 姿勢の変更

SDカードサイズのコンピューター『Intel Edison』

OpenCVの超解像(SuperResolution)モジュ...

KelpNet:C#で使える可読性重視のディープラーニングラ...

UnityのGameObjectの向きをScriptで制御す...

ZBrushトレーニング

AMIMOTO(PVM版)で作成したインスタンスをAMIMO...

Maya LTでFBIK(Full Body IK)

iOSで使えるJetpac社の物体認識SDK『DeepBel...

SIGGRAPH ASIAのマスコット

白組による『シン・ゴジラ』CGメイキング映像が公開された!

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

MythTV:Linuxでテレビの視聴・録画ができるオープン...

マルコフ連鎖モンテカルロ法

ZBrushでアヴァン・ガメラを作ってみる 歯を配置

日立のフルパララックス立体ディスプレイ

コメント