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

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

Normal Mapping with Javascript and Canvas





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

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

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

関連記事

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

konashiのサンプルコードを動かしてみた

Windows Server 2008にAutodesk M...

SVM (Support Vector Machine)

ZBrushで仮面ライダー3号を造る 仮面編 横顔のシルエッ...

ZScript

Blender 4.2以降のWindowsPortable版...

After Effects全エフェクトの解説(6.5)

Subsurface scatteringの動画

Houdiniのライセンスの種類

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

この本読むよ

ZBrush 2018へのアップグレード

BlenderProc:Blenderで機械学習用の画像デー...

Mask R-CNN:ディープラーニングによる一般物体検出・...

WordPressプラグインによるサイトマップの自動生成

WordPressプラグインの作り方

CreativeCOW.net

ブラウザ操作自動化ツール『Selenium』を試す

WinSCP

Python for Unity:UnityEditorでP...

OpenMayaRender

Swark:コードからアーキテクチャ図を作成できるVSCod...

ZBrushのZmodelerとDynamic Subdiv...

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

Zibra Liquids:Unity向け流体シミュレーショ...

動的なメモリの扱い

世界一下品なクマと世界一紳士なクマ

トランスフォーマー/ロストエイジのメイキング

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

WordPress on Google App Engine...

C++始めようと思うんだ

ZBrushで仮面ライダー3号を造る 仮面編 PolyGro...

BlenderのGeometry Nodeで遊ぶ

粘土をこねるようなスカルプトモデリング

Adobe Photoshop CS4 Extendedの3...

ラクガキの立体化 進捗

布地のシワの法則性

ポリ男からMetaHumanを作る

Raspberry Pi

ラクガキの立体化 反省

Gource:バージョン管理の履歴を可視化するツール

コメント