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

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


スポンサーリンク

Normal Mapping with Javascript and Canvas





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

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

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


スポンサーリンク

関連記事

ManimML:機械学習の概念を視覚的に説明するためのライブラリ
Physics Forests:機械学習で流体シミュレーションを近似する
自前Shaderの件 解決しました
『スター・ウォーズ フォースの覚醒』のVFXブレイクダウン まとめ
1枚の画像からマテリアルを作成できる無料ツール『Materialize』
PythonのHTML・XMLパーサー『BeautifulSoup』
ZBrushで仮面ライダーBLACK SUNを作る 頭部~バストの概形
ゴジラ三昧
自前のShaderがおかしい件
Raspberry PiのGPIOを操作するPythonライブラリ『RPi.GPIO』の使い方
ArUco:OpenCVベースのコンパクトなARライブラリ
CycleGAN:ドメイン関係を学習した画像変換
ZScript
ラクガキの立体化 1年半ぶりの続き
写真に3Dオブジェクトを違和感無く合成する『3DPhotoMagic』
AndroidもopenGLも初心者さ (でもJavaは知ってるよ)
WordPressの表示を高速化する
WebGL開発に関する情報が充実してきている
Houdiniのライセンスの種類
池袋パルコで3Dのバーチャルフィッティング『ウェアラブル クロージング バイ アーバンリサーチ』
ブラウザ操作自動化ツール『Selenium』を試す
BlenderのPython環境にPyTorchをインストールする
libigl:軽量なジオメトリ処理ライブラリ
OpenCVで顔のランドマークを検出する『Facemark API』
画像生成AI Stable Diffusionで遊ぶ
ZBrushで仮面ライダー3号を造る 仮面編 PolyGroupを分割する
SONY製のニューラルネットワークライブラリ『NNabla』
CGWORLD CHANNEL 第21回ニコ生配信は『シン・ゴジラ』メイキングスペシャル!
実写と実写の合成時の色の馴染ませテクニック
まだ続くブログの不調
OpenCVの超解像(SuperResolution)モジュールを試す
Javaで作られたオープンソースの3DCGレンダラ『Sunflow』
ZBrushで仮面ライダー3号を造る 仮面編 ZRemesher
Cartographer:オープンソースのSLAMライブラリ
After Effects全エフェクトの解説(6.5)
読みやすくて高速なディープラーニングのフレームワーク『Caffe』
Webページ制作のためのメモ
Seleniumを使ったFXや株の自動取引
.NETで使えるTensorFlowライクなニューラルネットワークライブラリ『NeuralNetwo...
ROSの薄い本
ZBrushでUndo Historyを動画に書き出す
Photo Bash:複数の写真を組み合わせて1枚のイラストを制作する

コメント