T-Racing Development Blog

three.js

Launcherへのレンダリング

Launcherへのレンダリング

Defaultテーマファイルを複製して開発テスト用のJSをゴリゴリ書いて、Launcher上にWebGLレンダラーを実装させる所まで成功しました。
但し、WebWorkerで実装したKN5Analyzerは動きませんでした…orz

KN5用のマテリアルをまだ実装していないので、取り急ぎワイヤーフレームで描画確認しています。
動作も60fpsで安定していて結構軽いです。(PCのスペックに依存するので何とも言えませんが…)

Continue reading

KN5LoaderのWorker対応とテクスチャマルチマッピング

KN5LoaderのWorker対応とテクスチャマルチマッピング

先日KN5ファイルフォーマットの解析でプレビューに用いましたが、KN5を解析してThree.jsでレンダリングするためのKN5Loader.jsを作ってます。

KN5の解析はファイルサイズも大きく処理に時間がかかるため、WebWorkerで並行処理を実装してみました。

DDSLoader.jsの拡張もしてKN5に含まれるテクスチャは(GTR35しか試していませんが)全部読み込めたので、Kunosのシェーダープロパティに基づくテクスチャのマルチマッピングもとりあえずShaderMaterialでそれっぽく見えるように実装してみました。
ただ、マルチマッピング以外の処理を実装していないため、環境光による陰影や、シャドウマッピング、深度バッファなどが反映されません。

Continue reading

Three.jsのDDS対応フォーマット追加

Three.jsのDDS対応フォーマット追加

Three.jsのリポジトリにDDS Loaderがあるのですが、DXT1,?DXT3, DXT5, 32bit非圧縮ARGBの4種類のフォーマットのパーサしか実装されていません。
そのため、24bit/16bit非圧縮RGBや、NormalMap等で用いられる16bit非圧縮LuminanceAlphaFormatなどを読み込むことが出来ません。

このままではKN5に含まれるNormalMapが描画できなかったりするので、既存のDDS Loaderに追加実装する形でサポートしてみました。

Continue reading

KN5ファイルフォーマットの解析

KN5ファイルフォーマットの解析

AssettoCorsaのランチャーはCEFで実装されているため、HTML、CSS、JavaScriptのコードによってデザインや動作をカスタマイズすることが出来ます。
CEFはWebGLもサポートしているので、HTML上で3Dレンダリングさせたり出来ます。

ということで、先ずはランチャー上で車種選択やコース選択時に3Dプレビューさせてみたいので、JavaScriptでKN5ファイルをパースしてやる必要があります。
ファイルフォーマットの解析に苦労しましたが、取り敢えずは試作したパーサが無事動いたので、解析できたデータをthree.jsを用いて3D表示させる所まで実装してみました。

Continue reading