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

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


スポンサーリンク

Normal Mapping with Javascript and Canvas





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

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

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


スポンサーリンク

関連記事

Raspberry Piでセンサーの常時稼働を検討する
viser:Pythonで使える3D可視化ライブラリ
Raytracing Wiki
CGALDotNet:計算幾何学ライブラリ CGALのC#ラッパー
TeleSculptor:空撮動画からPhotogrammetryするツール
OpenCVの三角測量関数『cv::triangulatepoints』
Amazon EC2ログイン用の秘密鍵を無くした場合の対処方法
ポリゴン用各種イテレータと関数セット
SIGGRAPH ASIAのマスコット
Google Chromecast
Unity ARKitプラグインサンプルのドキュメントを読む
WordPressプラグインによるサイトマップの自動生成
オープンソースの取引プラットフォーム
Maya 2015から標準搭載されたMILA
ブラウザ上でJavaScript,HTML,CSSを書いて共有するサイト『jsdo.it』
Runway ML:クリエイターのための機械学習ツール
WordPress on Google App Engineを1週間運用してみて
UnrealCLR:Unreal Engineで.NET Coreを利用できるプラグイン
テスト
画像生成AI Stable Diffusionで遊ぶ
Alice Vision:オープンソースのPhotogrammetryフレームワーク
OpenCV 3.1のsfmモジュールを試す
OpenMVSのサンプルを動かしてみる
海外ドラマのChromaKey
Mayaのシェーディングノードの区分
WordPressのテーマを自作する
スクラッチで既存のキャラクターを立体化したい
Google Colaboratoryで遊ぶ準備
映画『ジュラシック・ワールド/炎の王国』のVFXブレイクダウン まとめ
Unityで学ぶC#
ヒーローに変身なりきりアーケードゲーム『ナレルンダー』
UnrealCV:コンピュータビジョン研究のためのUnreal Engineプラグイン
オープンソースの顔の動作解析ツールキット『OpenFace』
ニンテンドー3DSのGPU PICA200
ZBrushでアヴァン・ガメラを作ってみる 口内の微調整・身体のライン修正
『ローグ・ワン/スター・ウォーズ・ストーリー』"あのキャラクター"のメイキング
Paul Debevec
OpenSfM:PythonのStructure from Motionライブラリ
ドラマ『ファーストクラス』のモーショングラフィックス
ZBrushでアヴァン・ガメラを作ってみる 頭頂部の作り込み・舌の追加
hloc:SuperGlueで精度を向上させたSfM実装
HD画質の無駄遣い

コメント