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

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

Normal Mapping with Javascript and Canvas





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

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

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

関連記事

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

OpenCVで顔のランドマークを検出する『Facemark ...

『スター・ウォーズ 最後のジェダイ』のVFXブレイクダウン ...

Kornia:微分可能なコンピュータービジョンライブラリ

Theia:オープンソースのStructure from M...

MFnDataとMFnAttribute

Physically Based Rendering

動的なメモリの扱い

UnityのGlobal Illumination

Physics Forests:機械学習で流体シミュレーショ...

3D Gaussian Splatting:リアルタイム描画...

ニューラルネットワークで画像分類

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

ブログの復旧が難航してた話

uGUI:Unityの新しいGUI作成システム

SIGGRAPH Asia

Python拡張モジュールのWindows用インストーラー配...

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

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

Super Resolution:OpenCVの超解像処理モ...

『Geocities-izer』 どんなWebページも一昔前...

トランスフォーマー :リベンジのメイキング (デジタルドメイ...

ZBrushでアヴァン・ガメラを作ってみる 脚のポーズ調整

HerokuでMEAN stack

参考書

PureRef:リファレンス画像専用ビューア

Mitsuba 2:オープンソースの物理ベースレンダラ

この本読むよ

COLMAP:オープンソースのSfM・MVSツール

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

Amazon EC2ログイン用の秘密鍵を無くした場合の対処方...

スクレイピング

ZBrushでアヴァン・ガメラを作ってみる 首回りの修正・脚...

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

Windows10でPyTorchをインストールしてVSCo...

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

クラスの基本

NumSharp:C#で使えるNumPyライクな数値計算ライ...

Accord.NET Framework:C#で使える機械学...

Caffe:読みやすくて高速なディープラーニングのフレームワ...

UnrealCV:コンピュータビジョン研究のためのUnrea...

Unityをレンダラとして活用する

コメント