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

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


スポンサーリンク

Normal Mapping with Javascript and Canvas





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

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

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


スポンサーリンク

関連記事

Maya 2015から標準搭載されたMILA
ZBrushで仮面ライダー3号を造る ベース編
DCGAN (Deep Convolutional GAN):畳み込みニューラルネットワークによる敵...
オープンソースのPhotogrammetryフレームワーク『Alice Vision』
Phongの表現力パネェ 材質別のPhong Shader用パラメータ一覧
Blenderでよく使うaddon
今年もSSII
Unityで使える数値計算ライブラリ『Math.NET Numerics』
OpenCVの三角測量関数『cv::triangulatepoints』
Model View Controller
WordPressプラグインによるサイトマップの自動生成
ZBrush 2018での作業環境を整える
『Geocities-izer』 どんなWebページも一昔前のダサいデザインに変えてくれるサービス
機械学習手法『SVM(Support Vector Machine)』
『PIXARのひみつ展』に行ってきた
Google Earth用の建物を簡単に作れるツール Google Building Maker 公...
Raspberry PiでIoTごっこ
リメイク版ロボコップスーツのメイキング
複数画像から3次元形状を再構築するライブラリ『Multi-View Environment』
openMVGをWindows10 Visual Studio 2015環境でビルドする
iOSデバイスのためのフィジカル・コンピューティングツールキット『konashi(こなし)』
日本でMakersは普及するだろうか?
ラクガキの立体化 1年半ぶりの続き
Webスクレイピングの勉強会に行ってきた
ZBrushでカスタムUIを設定する
PGGAN:段階的に解像度を上げて学習を進めるGAN
CycleGAN:ドメイン関係を学習した画像変換
オープンソースの物理ベースレンダラ『Mitsuba』をMayaで使う
UnityでShaderの入力パラメータとして行列を渡す
タマムシっぽい質感
Unityで画面タッチ・ジェスチャ入力を扱う無料Asset『TouchScript』
MythTV:Linuxでテレビの視聴・録画ができるオープンソースプロジェクト
pythonの機械学習ライブラリ『scikit-learn』
Mayaのレンダリング アトリビュート
Structure from Motion (多視点画像からの3次元形状復元)
konashiのサンプルコードを動かしてみた
TensorFlowでCGを微分できる『TensorFlow Graphics』
ラクガキの立体化 3Dプリント注文
After Effects全エフェクトの解説(6.5)
OpenCVの超解像処理モジュール『Super Resolution』
ブログをGoogle App EngineからAmazon EC2へ移行
ZBrush 2018へのアップグレード

コメント