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

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

Normal Mapping with Javascript and Canvas





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

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

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

関連記事

ZBrushで手首のモデリングをリファイン

OpenMVS:Multi-View Stereoによる3次...

ZBrushでアヴァン・ガメラを作ってみる 腕の作り込み

Stanford Bunny

HD画質の無駄遣い

オープンソースのロボットアプリケーションフレームワーク『RO...

Mayaのシェーディングノードの区分

CEDEC 3日目

Raspberry Pi 2を買いました

Point Cloud Libraryに動画フォーマットが追...

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

MB-Lab:Blenderの人体モデリングアドオン

OpenCVでiPhone6sのカメラをキャリブレーションす...

Verilog HDL

OANDAのfxTrade API

fSpy:1枚の写真からカメラパラメーターを割り出すツール

ラクガキの立体化 胴体の追加

素敵なパーティクル

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

AMIMOTO(PVM版)で作成したインスタンスをAMIMO...

Digital Emily Project:人間の顔をそっく...

ZBrushでゴジラ2001を作ってみる 身体のシルエット出...

Iterator

PolyPaint

Unite 2014の動画

iPhone欲しいなぁ

フリーで使えるスカルプト系モデリングツール『Sculptri...

第1回 3D勉強会@関東『SLAMチュートリアル大会』

MeshroomでPhotogrammetry

OpenCVでPhotoshopのプラグイン開発

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

Amazon Web ServicesでWordPress

ちょっと凝り過ぎなWebキャンペーン:全日本バーベイタム選手...

ZBrushのお勉強

網元AMIで作ったWordpressサイトのインスタンスをt...

ZBrush4新機能ハイライト 3DCG CAMP 2010

WordPressのサーバ引っ越し方法を考える

Houdiniのライセンスの種類

Shader.jp:リアルタイム3DCG技術をあつかうサイト

3D復元技術の情報リンク集

Adobe Photoshop CS5の新機能

今年もSSII

コメント