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

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


スポンサーリンク

Normal Mapping with Javascript and Canvas





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

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

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


スポンサーリンク

関連記事

UnityでShaderの入力パラメータとして行列を渡す
BSDF: (Bidirectional scattering distribution funct...
Raytracing Wiki
Raspberry PiのGPIOを操作するPythonライブラリ『RPi.GPIO』の使い方
PyMC:Pythonのベイズ統計ライブラリ
C++始めようと思うんだ
ラクガキの立体化 背中の作り込み・手首の移植
ラクガキの立体化 分割ラインの変更・バランス調整
Google App Engine上のWordPressでFlickrの画像を貼る
ポリゴンジオメトリ処理ライブラリ『pmp-library (Polygon Mesh Process...
Faceshiftで表情をキャプチャしてBlender上でMakeHumanのメッシュを動かすデモ
ヒーローに変身なりきりアーケードゲーム『ナレルンダー』
Python.NET:Pythonと.NETを連携させるパッケージ
リメイク版ロボコップスーツのメイキング
MRenderUtil::raytrace
CEDEC 3日目
ポリ男をリファイン
html5のcanvasの可能性
網元AMIで作ったWordpressサイトのインスタンスをt1microからt2microへ移行した
ZBrushでUndo Historyを動画に書き出す
OpenVDB:3Dボリュームデータ処理ライブラリ
第20回 文化庁メディア芸術祭『3DCG表現と特撮の時代』
Unityの薄い本
『ローグ・ワン/スター・ウォーズ・ストーリー』"あのキャラクター"のメイキング
トランスフォーマー/ロストエイジのメイキング
スターウォーズ エピソードVIIの予告編
インタラクティブにComputer Visionコーディングができるツール『Live CV』
WordPressのサーバ引っ越し方法を考える
Point Cloud Libraryに動画フォーマットが追加されるらしい
トランスフォーマーの変形パターンを覚えるのは楽しいと思うんだ
プログラムによる景観の自動生成
Raspberry Piでセンサーの常時稼働を検討する
ブログのデザイン変えました
Blender 2.81でIntel Open Image Denoiseを使う
MeshLab:3Dオブジェクトの確認・変換に便利なフリーウェア
生物の骨格
Siggraph Asia 2009 カンファレンスの詳細
Windows Server 2008にAutodesk Maya 2009をインストール
UnityプロジェクトをGitHubで管理する
書籍『3次元コンピュータビジョン計算ハンドブック』を購入
株式会社ヘキサドライブの研究室ページ
ZBrush4新機能ハイライト 3DCG CAMP 2010

コメント