17 Babylonjs入门进阶 使用场景加载器加载glTF,OBJ,STL模型

Babylon.js内置的模型格式是.babylon,Babylon.js可以不需要其它额外的插件即可加载。

注意:由于你导入的模型可以具有rotationQuaternion的设置,因此再设置rotate可能出现无法预测的问题,警告

基本用法

要加载指定的类型的文件,Babylon.js首先需要引入相应文件的插件。
目前支持的文件格式类型:

如果想要快速添加对所有的文件格式的支持,可以将以下脚本引入到页面中:

<script src="https://cdn.babylonjs.com/babylon.js"></script>
<script src="https://preview.babylonjs.com/loaders/babylonjs.loaders.min.js"></script>

有关NPM的使用,请参阅:babylonjs-loaders
引入插件以后,可以使用SceneLoader类加载模型,它提供了一些加载方法。

SceneLoader.Append

从文件文件夹中加载所有的模型资源并添加到babylon场景中

配置项:文件夹路径,资源名称,场景对象,回调函数

BABYLON.SceneLoader.Append(".", "duck.gltf", scene, function (scene) {
    // 模型添加成功后,执行场景对象的一些方法
});

SceneLoader.Load

从文件中加载模型文件并创建一个新的场景对象

配置项:文件夹路径,资源名称,引擎对象,回调函数

BABYLON.SceneLoader.Load("/assets", "batman.obj", engine, function (newScene) { 
   // ...
});

SceneLoader.ImportMesh

从文件中加载模型并将它们添加到场景中,这个和Append区别在于,回调返回的是模型对象而不是场景对象。我们可以在成功的回调里面对模型再进行进一步的处理。
配置项:将要添加到场景中的模型名称或为空(将所有模型或者骨骼加载),文件夹路径,资源名称,场景对象,回调函数

BABYLON.SceneLoader.ImportMesh(["myMesh1", "myMesh2"], ".", "duck.gltf", scene, function (meshes, particleSystems, skeletons) {
    //  对骨骼和模型进行进一步操作
    // 对于glTF文件,粒子系统默认为空
});

SceneLoader.LoadAssetContainer

从文件夹中添加所有的资源到babylon,但不会自动添加到场景中
配置项:文件夹路径,资源名称,场景对象,回调函数

BABYLON.SceneLoader.LoadAssetContainer(".", "duck.gltf", scene, function (container) {
    var meshes = container.meshes;
    var materials = container.materials;
    //...

    // Adds all elements to the scene
    container.addAllToScene();
});

回调函数会返回一个容器对象,里面包含所有模型加载的资源光源,模型,相机等等。如果需要将模型添加到场景,需要使用:

container.addAllToScene();

将添加的容器内容从场景中删除,则使用:

container.removeAllFromScene();

SceneLoader.AppendAsync

我们还可以通过使用Async函数来实现链式回调:

BABYLON.SceneLoader.AppendAsync(".", "duck.gltf", scene).then(function (scene) {
    // do something with the scene
});

请参阅如何使用Promises了解有关使用promises的更多信息。

高级用法

使用onPluginActivatedObservable设置属性和调用特定于特定加载器的方法。

BABYLON.SceneLoader.OnPluginActivatedObservable.add(function (loader) {
    if (loader.name === "gltf") {
        // do something with the loader
        // loader.<option1> = <...>
        // loader.<option2> = <...>
        // loader.dispose();
    }
});

或者,静态同步SceneLoader函数返回插件。

var loader = BABYLON.SceneLoader.Load(".", "duck.gltf", engine, function (scene) {
    // do something with the scene
});

// do something with the loader
// loader.<option1> = <...>
// loader.<option2> = <...>
// loader.dispose();

加载多个模型

如果加载多个模型时,可以使用AssetsManager类。请查看下一节。

来源:https://blog.csdn.net/qq_30100043/article/details/88933962

WEBGL学习网(WebGLStudy.COM)专注提供WebGL 、ThreeJS、BabylonJS等WEB3D开发案例源码下载。
声明信息:
1. 本站部分资源来源于用户上传和网络,如有侵权请邮件联系站长:1218436398@qq.com!我们将尽快处理。
2. 分享目的仅供大家学习和交流,您必须在下载后24小时内删除!
3. 不得使用于非法商业用途,不得违反国家法律。否则后果自负!
4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!
5. 如有链接无法下载、失效或广告,请联系管理员处理!
6. 本站资源打赏售价用于赞助本站提供的服务支出(包括不限服务器、网络带宽等费用支出)!
7.欢迎加QQ群学习交流:549297468 ,或者搜索微信公众号:WebGL学习网
WEBGL学习网 » 17 Babylonjs入门进阶 使用场景加载器加载glTF,OBJ,STL模型

发表评论

提供优质的WebGL、ThreeJS源码

立即查看 了解详情