glTFフォーマット完全ガイド: 3Dモデル配信の新しい標準

こんにちは、カシカの奥です。

今回は、3Dコンテンツ配信における新しい業界標準として注目されている glTF（GL Transmission Format について詳しく解説します。WebGLを使った3Dアプリケーション開発や、AR/VRコンテンツ制作において、glTFの理解は必須となっています。

glTFとは
glTFの特徴
ファイル構造
glTF 2.0の改良点
実装例
- Three.js での読み込み
- Babylon.js での読み込み
拡張機能（Extensions）
さらに高度な物理ベースレンダリングパラメータの対応
物理エンジンへの対応
3D Gaussian Splatsとの統合
まとめ

glTFとは

glTF（GL Transmission Format） は、Khronos Groupによって開発された3Dシーンとモデルの伝送フォーマットです。「3DのJPEG」とも呼ばれ、効率的な3Dコンテンツの配信を目的として設計されています。

2015年にバージョン1.0がリリースされ、現在はglTF 2.0が標準として広く採用されています。

主な設計目標

コンパクトなファイルサイズ: ネットワーク転送に最適化
高速な読み込み: 最小限の処理でGPUに送信可能
相互運用性: 異なるプラットフォーム間での一貫した表示
拡張性: 新機能を追加できる柔軟な仕組み

glTFの特徴

1. 効率的なデータ構造

glTFは、従来のFBXやOBJといったフォーマットと比較して、以下の点で優位性を持ちます：

ファイルサイズの削減： - FBXフォーマットは独自のバイナリ形式で、メタデータが冗長になりがち - OBJフォーマットは可読性は高いが、同じデータが重複して記述されることが多い - glTFは階層的な参照システムにより重複データを排除し、同じメッシュを複数の場所で使用する場合でもデータは一度だけ保存

読み込み速度の向上： - 従来フォーマットでは読み込み後にGPU用フォーマットへの変換処理が必要 - glTFは頂点データがGPUバッファに直接コピー可能な形式で格納され、CPU処理時間を大幅に短縮

メモリ効率： - 頂点データが配列形式で連続的に格納され、メモリ断片化を回避

{
  "scene": 0,
  "scenes": [
    {
      "nodes": [0]
    }
  ],
  "nodes": [
    {
      "mesh": 0,
      "name": "Cube"
    }
  ],
  "meshes": [
    {
      "primitives": [
        {
          "attributes": {
            "POSITION": 0,
            "NORMAL": 1,
            "TEXCOORD_0": 2
          },
          "indices": 3,
          "material": 0
        }
      ]
    }
  ]
}

2. GPU最適化

頂点データはGPUバッファに直接コピー可能な形式で格納されており、CPUでの前処理が最小限で済みます。

3. 物理ベースレンダリング（PBR）対応

glTF 2.0では、現代的なPBRマテリアルがデフォルトでサポートされています：

{
  "materials": [
    {
      "name": "Material",
      "pbrMetallicRoughness": {
        "baseColorFactor": [1.0, 1.0, 1.0, 1.0],
        "metallicFactor": 0.0,
        "roughnessFactor": 1.0
      }
    }
  ]
}

ファイル構造

glTFは複数のファイル形式で配布できます：

1. 標準的なglTF（.gltf + .bin + テクスチャ）

model.gltf          # JSONメタデータ
model.bin           # バイナリデータ
texture_diffuse.png # テクスチャファイル
texture_normal.png  # ノーマルマップ

2. バイナリglTF（.glb）

すべてのデータを単一ファイルに統合：

model.glb  # JSONメタデータ + バイナリデータ + テクスチャ

JSONメタデータ

glTFファイルの核となるJSON構造：

{
  "asset": {
    "version": "2.0",
    "generator": "samething generated tools name"
  },
  "accessors": [...],
  "bufferViews": [...],
  "buffers": [...],
  "materials": [...],
  "meshes": [...],
  "nodes": [...],
  "scenes": [...],
  "textures": [...]
}

バイナリデータ

頂点座標、法線、UV座標、インデックスデータなどは効率的なバイナリ形式で格納されます。

glTF 2.0の改良点

1. 物理ベースレンダリング（PBR）の標準化

Metallic-Roughnessワークフロー
環境光の正確な表現
材質の物理的正確性

2. アニメーション機能の強化

glTF 2.0では、従来の3Dフォーマットと比較してアニメーション機能が大幅に改善されました：

キーフレームアニメーション： - 時間軸に沿った詳細なキーフレーム制御 - 線形、ステップ、スプライン補間をサポート - 複数のアニメーション軌道を同時に制御可能

アニメーション対象の拡張： - 位置（translation）、回転（rotation）、スケール（scale）の独立制御 - マテリアルパラメータのアニメーション - モーフターゲット（ブレンドシェイプ）の重み制御

{
  "animations": [
    {
      "channels": [
        {
          "sampler": 0,
          "target": {
            "node": 1,
            "path": "rotation"
          }
        }
      ],
      "samplers": [
        {
          "input": 4,
          "interpolation": "LINEAR",
          "output": 5
        }
      ]
    }
  ]
}

3. スキニングとモーフィング

キャラクターアニメーションやフェイシャルアニメーションのサポート。

実装例

Three.js での読み込み

import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js';

const loader = new GLTFLoader();

loader.load('path/to/model.glb', function (gltf) {
    scene.add(gltf.scene);
    
    // アニメーションの再生
    if (gltf.animations.length > 0) {
        const mixer = new THREE.AnimationMixer(gltf.scene);
        const action = mixer.clipAction(gltf.animations[0]);
        action.play();
    }
}, function (progress) {
    console.log('Loading progress:', progress.loaded / progress.total * 100 + '%');
}, function (error) {
    console.error('Loading error:', error);
});

Babylon.js での読み込み

BABYLON.SceneLoader.ImportMesh("", "path/to/", "model.glb", scene, function (meshes) {
    // メッシュが読み込まれた後の処理
    meshes.forEach(mesh => {
        mesh.position = new BABYLON.Vector3(0, 0, 0);
    });
});

拡張機能（Extensions）

glTFの大きな特徴の一つが拡張性です。主要な拡張機能：

KHR_materials_unlit

非照明マテリアル（モバイル最適化）：

{
  "materials": [
    {
      "extensions": {
        "KHR_materials_unlit": {}
      },
      "pbrMetallicRoughness": {
        "baseColorTexture": {
          "index": 0
        }
      }
    }
  ]
}

KHR_draco_mesh_compression

ジオメトリ圧縮（ファイルサイズ削減）

draco圧縮というアルゴリズムでメッシュのデータサイズを小さくすることができます。ただし、非可逆圧縮のため、データが一部書き換えられてしまいます。

KHR_lights_punctual

点光源、指向性光源、スポットライト

EXT_texture_webp

WebP形式テクスチャのサポート

さらに高度な物理ベースレンダリングパラメータの対応

最新動向として、SIGGRAPH2025で発表されたプレゼンテーションでは、 Diffuse Transmission や Volumetric Scattering の対応の拡張が進められてることが発表されています。

alt text

物理エンジンへの対応

物理エンジンで利用される、単純な形状のサポートが拡張機能として盛り込まれているようです。

KHR_implicit_shapes

基本的な幾何形状を効率的に定義する拡張機能： - Sphere: 球体 - Box: 直方体 - Capsule: カプセル型 - Cylinder: 円柱

KHR_physics_rigid_bodies

物理演算用の剛体定義に対応： - Triangle mesh: 三角形メッシュベースの衝突判定 - Convex hull: 凸包による効率的な衝突計算

3D Gaussian Splatsとの統合

最新動向として、2025年8月、glTF標準は革新的な 3D Gaussian Splats（3DGS） 技術との統合に向けて大きく前進しました。Khronos GroupとOpen Geospatial Consortiumが主導し、新しい拡張機能の開発が進められています。

3D Gaussian Splatsとは

3D Gaussian Splatsは、 NeRF（Neural Radiance Fields） から発展した新しい3D表現技術です。従来のメッシュベースの3Dモデルとは異なり、輝度フィールドを利用して空間を表現します。

主な特徴

高忠実度な再現: 実写のような質感とライティングを再現
効率的なレンダリング: GPUでの並列処理に最適化
微細な詳細: 従来の3Dキャプチャでは困難だった表面の質感や透明度を正確に表現

新しい拡張機能

1. KHR_gaussian_splatting

3D Gaussian Splatsの基本構造を定義する拡張機能：

{
  "extensions": {
    "KHR_gaussian_splatting": {
      "gaussians": [
        {
          "position": [0.0, 0.0, 0.0],
          "scale": [1.0, 1.0, 1.0],
          "rotation": [0.0, 0.0, 0.0, 1.0],
          "opacity": 0.8,
          "sphericalHarmonics": [...]
        }
      ]
    }
  }
}

2. KHR_gaussian_splatting_compression_spz

SPZフォーマットによる効率的な圧縮とストリーミング：

{
  "extensions": {
    "KHR_gaussian_splatting_compression_spz": {
      "compressedData": "data:application/octet-stream;base64,..."
      "compressionLevel": 85,
      "streamingEnabled": true
    }
  }
}

技術的な利点

1. 相互運用性の向上

glTF標準への統合により、異なるプラットフォーム間でのGaussian Splatsの互換性が大幅に向上します：

Webブラウザ: WebGLを通じた直接レンダリング
ARアプリケーション: モバイルデバイスでのリアルタイム表示
VRプラットフォーム: 没入感のある3D体験

2. ストリーミング配信

SPZ圧縮により、大容量のGaussian Splatsデータを効率的に配信：

SPZ圧縮は、ナイアンテックによって、開発された、ガウシアンスプラッティング向けの圧縮フォーマットです。

実装: https://github.com/nianticlabs/spz

応用分野

1. 地理空間情報

デジタルツイン: 都市や建物の高精度3Dモデル
地図アプリケーション: リアルタイムの3D地図表示

2. エンターテインメント

映画・アニメ: フォトリアルな背景生成
ゲーム: 実写品質の環境表現

3. 産業応用

製品デザイン: 高精度な質感表現
建築ビジュアライゼーション: リアルな素材感の再現

実装動向

現在、Khronos Groupは開発コミュニティからのフィードバックを積極的に歓迎しているようです。ガウシアンスプラッティングの実装はCesiumの開発チームが積極的に取り組んでおり、都市・建物のガウシアンスプラッティングを３Dモデルデータとして、取りこむことが主眼のようです。

より、詳しい情報を取得したいかたは以下のリンクの情報をご確認ください。

参考🔗
- Khronos, OGC, and Geospatial Leaders Add 3D Gaussian Splats to the glTF Asset Standard - Khronos Blog https://www.khronos.org/blog/khronos-ogc-and-geospatial-leaders-add-3d-gaussian-splats-to-the-gltf-asset-standard
- SIGGRAPH 2025でのガウシアンスプラッティングの発表スライド https://www.khronos.org/assets/uploads/developers/presentations/Gaussian_Splatting_Ready_SIGGRAPH_2025.pdf
- SIGGRAPH 2025でのglTFに関する機能 https://www.khronos.org/assets/uploads/developers/presentations/glTF_Innovations_SIGGRAPH_2025.pdf

まとめ

glTFは、現代の3Dコンテンツ配信において必要不可欠なフォーマットとなっています。特にWeb技術との親和性が高く、以下の分野での活用が急速に進んでいます：

Webベースの3Dアプリケーション
AR/VRコンテンツ
Eコマースの3D商品表示
ゲーム開発

特に2025年のGaussian Splats統合は、3D表現技術において画期的な進歩をもたらすものです。従来のメッシュベースの3Dモデルでは表現困難だった微細な質感や光の表現が可能になり、より現実に近い3D体験が実現されます。

技術の進歩とともに、glTFも継続的に発展しており、今後も3D技術の中核的な役割を果たし続けることが予想されます。3D開発に携わる際は、ぜひglTFの理解を深めて活用してみてください。

弊社では glTF およびガウシアンスプラッティングを活用した 3D アプリケーション開発を承っております。ご興味があれば、ぜひお気軽にお問い合わせください。

お問い合わせ：https://kashika.co.jp/contact.html

目次