摘要：但模型載入程序并不是同步執(zhí)行的載入文檔和幾何等動(dòng)作在里都是異步的，我們沒辦法知道哪一個(gè)模型是第一個(gè)被完整載入，和下個(gè)一個(gè)完全載入的是誰而在一些應(yīng)用場景里是有可能需要在一個(gè)序列聚合多個(gè)模型。

此篇博客原著為 Autodesk ADN 的梁曉冬，以下以我簡稱。

我的同事創(chuàng)作了一些關(guān)于如何在一個(gè) Forge Viewer 實(shí)例里聚合多模型的博客，例如：

Aggregating multiple models in the Viewer

Preparing your viewing application for multi-model workflows

Preparing your viewing application for multi-model workflows - Part 2: Model Loader

這些示例多半是一次聚合一個(gè)模型到 viewer 里，照這里面的思路是很容易將其改寫成透過一個(gè)回圈（Loop）在 Viewer 載入任意個(gè)數(shù)模型的。但模型載入程序并不是同步執(zhí)行的（載入文檔、viewable和幾何等動(dòng)作在 Viewer
里都是異步的），我們沒辦法知道哪一個(gè)模型是第一個(gè)被完整載入，和下個(gè)一個(gè)完全載入的是誰；而在一些應(yīng)用場景里是有可能需要在一個(gè)序列（Sequeuence）聚合多個(gè)模型。

所以我花了一些時(shí)間研究如何使用 JavaScript Promise 這個(gè)機(jī)制，基本上 Promise 提供了一個(gè)靈活的機(jī)制可以用來管理這些單元程序。為了建立一個(gè) Promise 的序列，我找到了一篇有用的討論串和他的測試?yán)樱?/p>

https://stackoverflow.com/que...

根據(jù)這個(gè)基礎(chǔ)，我寫了一個(gè)測試工程 https://jsfiddle.net/xiaodong...，這個(gè)工程主要是用來展示如何透過一個(gè)序列將各樓層的模型一個(gè)一個(gè)載入，這工程的部份代碼如下所示：

//replace with your own urns
this.urn_model1 = ;
this.urn_model2 = ;
this.urn_model3 = ;
this.urn_model4 = ;

//model info array
this.modelArray = [{
        modelName: "urn_model1",
        urn: urn_model1,
        modelObj: null
    },
    {
        modelName: "urn_model2",
        urn: urn_model2,
        modelObj: null
    },
    {
        modelName: "urn_model3",
        urn: urn_model3,
        modelObj: null
    },
    {
        modelName: "urn_model4",
        urn: urn_model4,
        modelObj: null
    }
];

//viewer object                        
this.viewer = null;

function start() {

    //replace with your own token
    var token = < your token > ;

    //option to initialize viewer.
    var options = {
        env: "AutodeskProduction",
        accessToken: token
    };

    //It looks the static function of Viewer does not support ES6
    //still use ES5

    Autodesk.Viewing.Initializer(options, function onInitialized() {

        //get the viewer div
        var viewerDiv = document.getElementById("myViewer");

        //initialize the viewer object
        viewer = new Autodesk.Viewing.Private.GuiViewer3D(viewerDiv, {});

        //load model one by one in sequence
        globalPromise(modelArray);
    });
}

//load model by promise 
globalPromise = (modelArray) => {

    var _this = this;

    //each promise function
    //input the index of model array

    function promiseEachModel(index) {
        return new Promise((resolve, reject) => {
            var modelName = modelArray[index].modelName;
            var _index = index;

            //when the document is loaded
            function _onDocumentLoadSuccess(doc) {
                console.log(modelName +
                    ": Document Load Succeeded!");
                _this.globalDocumentLoad(doc,
                    _onLoadModelSuccess,
                    _onLoadModelError);
            };

            //when the document failed to be loaded 
            function _onDocumentLoadFailure(viewerErrorCode) {
                console.error(modelName +
                    ": Document Load Failure, errorCode:" +
                    viewerErrorCode);
            }

            //when the model is loaded 
            function _onLoadModelSuccess(model) {
                console.log(modelName + ": Load Model Succeeded!");

                //delegate geometry loaded event
                _this.viewer.addEventListener(
                    Autodesk.Viewing.GEOMETRY_LOADED_EVENT,
                    _onGeometryLoaded);

                //map this item with the corresponding model in case of use
                modelArray[index].modelObj = model
            };

            function _onLoadModelError(viewerErrorCode) {
                console.error(modelName +
                    ": Load Model Error, errorCode:" +
                    viewerErrorCode);
                //any error
                reject(modelName + " Loading Failed!" + viewerErrorCode);
            }

            function _onGeometryLoaded(evt) {
                //_this.globalGeometryLoaded(modelName,evt.model);
                _this.viewer.removeEventListener(
                    Autodesk.Viewing.GEOMETRY_LOADED_EVENT,
                    _onGeometryLoaded);
                console.log(modelName + "  Geometry Loaded!");
                resolve(modelName + "  Geometry Loaded!");
            }


            //load the model 
            Autodesk.Viewing.Document.load(
                modelArray[index].urn,
                _onDocumentLoadSuccess,
                _onDocumentLoadFailure);

        }); //end of new promise

    } //end of each promise function 

    //build the index array
    var indexArr = [0, 1, 2, 3];

    //proces each promise
    //refer to http://jsfiddle.net/jfriend00/h3zaw8u8/
    function processArray(array, fn) {
        var results = [];
        return array.reduce(function(p, item) {
            return p.then(function() {
                return fn(item).then(function(data) {
                    results.push(data);
                    return results;
                });
            });
        }, Promise.resolve());
    }

    //start to process
    processArray(indexArr, promiseEachModel).then(function(result) {
        console.log(result);
    }, function(reason) {
        console.log(reason);
    });
} //end of function globalPromise


//when document is being loaded 
globalDocumentLoad = (doc, _onLoadModelSuccess, _onLoadModelError) => {
    //get available viewables
    var viewables = Autodesk.Viewing.Document.getSubItemsWithProperties(
        doc.getRootItem(), {
            "type": "geometry"
        }, true);
    if (viewables.length === 0) {
        console.error("Document contains no viewables.");
        return;
    }

    // Choose the first avialble viewables
    var initialViewable = viewables[0];
    var svfUrl = doc.getViewablePath(initialViewable);

    var mat = new THREE.Matrix4();
    //input the transformation
    var loadOptions = {
        placementTransform: mat,
        globalOffset: {
            x: 0,
            y: 0,
            z: 0
        }, // to align the models
        sharedPropertyDbPath: doc.getPropertyDbPath()
    };

    //if this is the first model
    if (doc.myPath == this.urn_model1) {

        //load the first model
        this.viewer.start(svfUrl,
            loadOptions,
            _onLoadModelSuccess,
            _onLoadModelError);

    } else {
        //other models
        this.viewer.loadModel(svfUrl,
            loadOptions,
            _onLoadModelSuccess,
            _onLoadModelError);
    }
}

start();