加載三維模型到THREEJS

在THREEJS中，我們要加載制作好的三維模型到THREEJS場景中，一般會用到加載器；

常用的加載器有：

• OBJLoader：加載obj模型到場景中；
• OBJMTLLoader：加載帶mtl材質的模型取場景中；

兩個類的構造函均帶一個manager參數，該參數可以為空，默認為THREE.DefaultLoadingManager。

加載模型的方法如下：

OBJLoader.load ( url, onLoad, onProgress, onError )

OBJMTLLoader.load ( objUrl, mtlUrl, onLoad, onProgress, onError )

url為加載的模型路徑，形如：model/test.obj，或model/test.mtl

onLoad：為模型加載完成后的回調函數，帶一個Object3D類型的參數；

onProgress, onError：分別為模型加載過程中和加載出錯的回調，帶一個XmlHttpRequest類型的參數；不過經測試onProgress回調可能無法正常調用；

OBJLoader示例代碼如下：

    //加載過程回調函數
    var onProgress = function(xhr)
    {
        console.log('console.log');
        if(xhr.lengthComputable)
        {
            var percentComplete = xhr.loaded / xhr.total * 100;
            console.log(Math.round(percentComplete,2) + '% downloaded');
        }
    };

    //加載出錯回調函數
    var onError = function(xhr)
    {};    
    function LoadObjModel()
    {
        //加載模型
        var _loader = new THREE.OBJLoader();
        _loader.load('Model/male02.obj',function(obj)
        //_loader.load('Model/bh.obj',function(obj)
        //_loader.load('Model/bh_all/bh_all.obj',function(obj)
        {
            _scene.add(obj);
        },onProgress,onError);
    }

OBJMTLLoader使用示例代碼如下：

    function LoadTucnChengModel()
    {
        var loader = new THREE.OBJMTLLoader(_manager);
        loader.load('Model/tc_tm/tc.obj','Model/tc_tm/tc.mtl',function(obj)
        {
            obj.traverse(function(child)
            {
            _scene.add(obj);
        },onProgress,onError);
    }