使用前に確認

GLB圧縮とビューアーの互換性

拡張子がGLBでも、すべてのアプリケーションで中身を読み込めるとは限りません。出力で使われている拡張機能を調べ、使用先で試してください。

ローダーに合わせて設定する

設定読み込み要件
控えめな最適化ジオメトリ量子化への対応。テクスチャ変換も使われる場合があります。
Meshopt 標準 / 高圧縮EXT_meshopt_compression対応のデコーダー。
KTX2テクスチャKHR_texture_basisuへの対応とBasisトランスコーダー。
WebPテクスチャEXT_texture_webpへの対応とWebPのデコード。

これらの要件は組み合わさる場合があります。結果パネルに出力の互換性情報が表示されます。このサイトのプレビューにはデコーダーが組み込まれているため、プレビューの成功だけではご自身のアプリケーションで設定済みとは判断できません。

プリセットは初期設定でジオメトリの量子化を使用します。無効にすると量子化の対応要件をなくせる場合がありますが、Meshoptや変換したテクスチャには、それぞれのローダーが必要です。実際の結果に表示される拡張機能を確認してください。

Three.jsで使う

Meshoptで圧縮したジオメトリには、GLTFLoader.setMeshoptDecoder()でデコーダーを登録します。KTX2テクスチャにはKTX2Loaderを設定し、レンダラーの対応状況を検出してからsetKTX2Loader()で接続します。対応するトランスコーダーのファイルをアプリケーションとともに配信し、使用しているThree.jsのバージョンのドキュメントを参照してください。

GLTFLoaderのドキュメント · KTX2Loaderのドキュメント

例:元のモデルは読み込めるが「ファイルを小さく」の出力は読み込めない

元のテクスチャを保持したまま、同じ元データを「控えめな最適化」と「ファイルを小さく」でそれぞれ書き出します。後者だけがアプリケーションで失敗するなら、ジオメトリ設定を変更する前に、表示された拡張機能とローダーのエラーを確認してください。この比較は読み込み要件の変化へと問題を絞り込むためのもので、失敗がすべてデコーダー不足だと証明するものではありません。

Three.jsでEXT_meshopt_compressionの結果を扱う場合、読み込み前にMeshoptDecoderを登録し、同じ出力ファイルで再試行してください。使用先を変更できなければ、圧縮を無効にして再出力する方法もありますが、ダウンロード容量が増える可能性があります。

例:元のテクスチャは使えるが、デプロイ後にKTX2が失敗する

ジオメトリ設定を固定し、元のテクスチャとKTX2を比較します。Three.jsでは、KTX2Loaderが接続され、detectSupportが実行済みか確認してください。basis_transcoder.jsとbasis_transcoder.wasmへのリクエストも調べます。404応答や、これらのURLでアプリケーションのHTMLが返る場合は、テクスチャ品質ではなくアセット配信の問題を示しています。

ローダーやアセットのパスを修正したら、対象のモバイル端末も含め、同じKTX2出力を再テストしてください。このサイトでプレビューできるファイルは、このビューアーの設定では読み込めたということです。本番ビューアーでも必要な読み込み条件を満たす必要があります。

名前、extras、シーンの動作

3つの保持設定は初期状態で有効です。名前でオブジェクトやマテリアルを検索したり、extrasを読んだりするアプリケーションでは、有効のままにしてください。ただし、ノード番号、階層、アニメーションのサンプル、独自属性が完全に同じになる保証はありません。最適化はデータを結合・再編成し、精度を変えることがあります。

実際のアプリケーションで、選択、マテリアル変更、アニメーション再生、モーフターゲット、オブジェクト変換を試してください。extrasの保持で任意の独自拡張機能を保存できるわけではありません。

入力の制限

本サービスはDraco圧縮された入力、外部リソース、未対応の必須拡張機能を受け付けません。不明な任意拡張機能は削除される場合があります。必要に応じて制作元のアプリケーションから、リソースを埋め込んだ非圧縮GLBを書き出してください。

エンジンが対応する拡張機能と最適化の動作については、次を参照してください: 配布元のgltfpackドキュメント。ウェブサービスでは、追加の検証とリソース制限を適用します。

Three.jsでgltfpackモデルを読み込む →

最適化ツールを開く ↗