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

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

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

基本用法

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

• glTF
• OBJ
• STL

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

<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类。请查看下一节。