从文本加载 GLTF 模型

Question

我目前正在从静态文件服务器提供的文件中加载 GLTF 文件。

  import * as THREE from 'three'
  import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader';

  var loader = new GLTFLoader();

  loader.load(
    'http://localhost:1234/Assembly_PROD.gltf',
    function (gltf) {
      // Do stuff with loaded model
    },
    function (xhr) {
      // process progress
    },
    function (err) {
      // process error..
    }
  );

我现在转向直接提供 GLTF 文件作为文本的 API 服务器。 如何直接从其内容（而不是通过文件 url）加载 GLTF 文件？

Answer 1

Three.js 编辑器允许拖放glTF文件。 它使用File API 读取文件内容，然后使用相应的数据直接调用GLTFLoader.parse() 。

reader.addEventListener( 'load', function ( event ) {

    var contents = event.target.result;

    var loader = new GLTFLoader();
    loader.parse( contents, '', function ( result ) {

            var scene = result.scene;

            // more code

    } );

}, false );
reader.readAsArrayBuffer( file );

在研究代码时，您可以看到ArrayBuffer一个实例被传递到GLTFLoader.parse() 。 但是，此方法也接受字符串数据。

three.js R113