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

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

Normal Mapping with Javascript and Canvas





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

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

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

関連記事

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

BlenderのPython環境にPyTorchをインストー...

ヒーローに変身なりきりアーケードゲーム『ナレルンダー』

ブログのデザイン変えました

Iterator

WordPressプラグインの作り方

PythonでBlenderのAdd-on開発

OpenGVのライブラリ構成

ZBrush 4R7

Polyscope:3Dデータ操作用GUIライブラリ

MeshLab:3Dオブジェクトの確認・変換に便利なフリーウ...

ラクガキの立体化 モールドの追加

Konashiを買った

PolyPaint

書籍『ゼロから作るDeep Learning』で自分なりに学...

中学3年生が制作した短編映像作品『2045』

Mitsuba 3:オープンソースの研究向けレンダラ

ラクガキの立体化 分割ラインの変更・バランス調整

映画『ミュータント・タートルズ』を観てきた

ZBrushトレーニング

ハリウッド版「GAIKING」パイロット映像

Theia:オープンソースのStructure from M...

Google XML Sitemap Generatorプラ...

Google App EngineでWordPress

JavaによるCGプログラミング入門サイト (日本語)

ニューラルネットワークで画像分類

UnityでARKit2.0

テスト

UnityのGlobal Illumination

Iridescence:プロトタイピング向け軽量3D可視化ラ...

第20回 文化庁メディア芸術祭『3DCG表現と特撮の時代』

Houdiniのライセンスの種類

フォトンの放射から格納までを可視化した動画

COLMAP:オープンソースのSfM・MVSツール

Unityをレンダラとして活用する

CycleGAN:ドメイン関係を学習した画像変換

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

シン・ゴジラのファンアート

ZBrushでゴジラ2001を作ってみる 頭の概形作り

プロシージャル手法に特化した本が出てるみたい(まだ買わないけ...

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

SONY製のニューラルネットワークライブラリ『NNabla』

コメント