如何在 Aframejs 中加载 3d 模型？它目前在threejs中运行良好

Posted 2023-02-27

【中文标题】如何在 Aframejs 中加载 3d 模型？它目前在threejs中运行良好

【英文标题】：How can I load a 3d model in Aframejs? It currently works fine in threejs

【发布时间】：2018-08-14 15:24:17

【问题描述】：

我创建了一个 3d 动画模型，并设法在 threejs 中运行。

var loader = new THREE.FBXLoader();
loader.load( 'model.fbx', function ( object )               
     object.mixer = new THREE.AnimationMixer( object );
     mixers.push( object.mixer );
     console.log(object.animations.length);
     var action = object.mixer.clipAction( object.animations[ 0 ] );
     action.play();
     object.traverse( function ( child )  
       if ( child.isMesh )  
          child.castShadow = true;
          child.receiveShadow = true; 
        
     );
     scene.add( object );
);

它在threejs上运行得很好，但是我如何在aframe中使用它，我正在尝试创建AR应用程序。 我没有获得足够的文档，在 AFrame 中我可以在标记上显示 obj 模型，但 aframe-extras 似乎不起作用，但 Threejs FBX 加载器工作正常。我需要帮助才能在标记扫描上显示threejs 场景。

【问题讨论】：

如果 fbx-model 不起作用，您可能需要针对 aframe extras 提交错误，包括模型。模型以及在 A-Frame 中使用的 THREE.FBXLoader 的特定版本可能是这里的关键。

【参考方案1】：

我使用 FBX2glTF 将模型转换为 glTF 并且对我来说效果很好。 https://github.com/facebookincubator/FBX2glTF

【参考方案2】：

关于主题：框架中的 3D 模型

尝试使用three.js JSON 或glTF 格式。 a-frame 团队在docs 中推荐了这两种格式。

我记得 Don McCurdy 指出 fbx 模型复杂且难以解释，这就是 JSON 格式出现在 webGL 中的原因。

在使用 ar.js 时，我记得使用带有多个动画的 Three.js JSON 模型以及 glTF 静态/单动画模型没有问题。

您可以使用khronos 或kupomans 导出器轻松将模型导出到gltf，使用this one 将三个.js JSON 导出。

此外，glTF 模型与核心 a-frame 库一起使用，无需任何添加！

---

关于 fbx，我从来没有让它们正常工作，所以因为其他的是为 webGL 设计的，所以我会尝试一下。