首页 > 其他分享 >.Babylon格式的模型转化为glb模型,并使用ThreeJS加载显示

.Babylon格式的模型转化为glb模型,并使用ThreeJS加载显示

时间:2023-01-10 14:11:25浏览次数:61  
标签:ThreeJS 模型 js import 格式 Babylon glb

问题描述:手里有几个.babylon格式的三维模型,但是没用过babylon,只对ThreeJS熟悉;但是最新的ThreeJS里发现已经没有BabylonLoader的加载器,能查到的暮志未晚提供的例子,应该是因为Three.js版本不一样导致在新的里边不能用(也应该是自己水平不行没能解决这个问题。。。)

       那么我想的解决思路是,将.babylon格式的三维模型转换为ThreeJS经常用的格式,查资料发现,Babylon的在线模型查看工具可以导出csv格式模型和glb格式的模型,而ThreeJS支持glb。所以,开搞。。。

  大致流程如下:

 1、访问地址https://sandbox.babylonjs.com/ ,如下图:

 

 

 2、点击如上图的右下角箭头按钮,浏览.babylon格式的三维模型存放位置,将模型文件,和贴图文件都选中,点打开

 

 

 3、如下图所示,可以看到三维模型已经正常展示出来,按照图示操作,可以看到GLTF格式文件的导出按钮,点击“Export to GLB”按钮,可导出.glb格式的三维模型,该模型会带上三维模型的贴图。

 

 

 4、导出的glb格式模型,就按照官方常规加载方式加载就行了

import * as THREE from '../build/three.module.js';   //import语法声明用于从已导出的模块、脚本中导入函数、对象、指定文件(或模块)的原始值。


    import Stats from './jsm/libs/stats.module.js';

    import { OrbitControls } from './jsm/controls/OrbitControls.js';
    import { FBXLoader } from './jsm/loaders/FBXLoader.js';      //fbx文件的加载库
     import { GLTFLoader } from './jsm/loaders/GLTFLoader.js'


        var loader4 = new GLTFLoader();
        loader4.load('models/gltf/scene.glb',function (object4) {
            console.log(object4);
            scene.add(object4.scene)
            object4.scene.position.set(0,-100,0)
        });

 

留尾巴,话说最新的ThreeJS真的不支持.babylon格式的模型了?我感觉应该不是,还是研究的不够深入,有知道的人欢迎评论

 

 

 

 

 

标签:ThreeJS,模型,js,import,格式,Babylon,glb
From: https://www.cnblogs.com/NetNotes/p/17040146.html

相关文章