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

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

Normal Mapping with Javascript and Canvas





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

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

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

関連記事

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

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

イタリアの自動車ブランドFiatとゴジラがコラボしたCMのメ...

CGのためのディープラーニング

写真から3Dメッシュの生成・編集ができる無料ツール『Auto...

BlenderのGeometry Nodeで遊ぶ

実写と実写の合成時の色の馴染ませテクニック

ゴジラの造形

viser:Pythonで使える3D可視化ライブラリ

書籍『OpenCV 3 プログラミングブック』を購入

Photo Bash:複数の写真を組み合わせて1枚のイラスト...

ZBrushのお勉強

SONYの自律型エンタテインメントロボット『aibo』

スクレイピング

映画『ジュラシック・ワールド/炎の王国』のVFXブレイクダウ...

OpenCVで動画の手ぶれ補正

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

Autodesk CompositeとAutodesk Ma...

SIGGRAPH ASIAのマスコット

マジョーラ

Blender 2.8がついに正式リリース!

Houdiniのライセンスの種類

3Dスキャンしたテクスチャから照明を除去するUnityツール...

今年もSSII

AmazonEC2のインスタンスをt1.microからt2....

Model View Controller

openMVGをWindows10 Visual Studi...

映画『ゴジラ-1.0』 メイキング情報まとめ

デザインのリファイン再び

オープンソースの取引プラットフォーム

Google App EngineでWordPress

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

ZBrushのUndo Historyをカメラ固定で動画化す...

タマムシっぽい質感

SIGGRAPH 2020はオンライン開催

Mayaのプラグイン開発

Mayaのポリゴン分割ツールの進化

PythonのHTML・XMLパーサー『BeautifulS...

ZBrushCoreのTransposeとGizmo 3D

Open Shading Language (OSL)

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

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

コメント