three.js加载多个obj模型

问题遇到的现象和发生背景

使用Three.js中的【MTLLoader】与【OBJLoader】加载两个三维模型时,第一个加载的模型会丢失材质。

用代码块功能插入代码,请勿粘贴截图

```javascript
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>第一个three.js文件_WebGL三维场景</title>
  <style>
    body {
      margin: 0;
      overflow: hidden;
    }
  </style>
  <script src="../../three.js-master/build/three.js"></script>
  <script src="../../three.js-master/examples/js/controls/OrbitControls.js"></script>
  <script src="../../three.js-master/examples/js/loaders/OBJLoader.js"></script>
  <script src="../../three.js-master/examples/js/loaders/MTLLoader.js"></script>
</head>

<body>
  <script>
    var scene = new THREE.Scene();
    //加载地球模型
    var OBJLoader = new THREE.OBJLoader(); 
    var MTLLoader = new THREE.MTLLoader(); 
    MTLLoader.load('./贴图/material.mtl', function(materials) {
      OBJLoader.setMaterials(materials);
      OBJLoader.load('./贴图/model.obj', function(obj) {
        scene.add(obj); 
      })
    });
  //加载任务模型
   MTLLoader.load('./female02/female02.mtl', function(materials) {
        OBJLoader.setMaterials(materials);
        OBJLoader.load('./female02/female02.obj', function(obj) {
        obj.position.set(100,0,100);
        scene.add(obj); 
        })
    })

    //添加灯光
    var point = new THREE.PointLight(0xffffff);
    point.position.set(400, 200, 300); 
    scene.add(point); 
    var ambient = new THREE.AmbientLight(0x888888);
    scene.add(ambient);

    //添加相机
    var width = window.innerWidth; 
    var height = window.innerHeight; 
    var k = width / height; 
    var s = 150; 
    var camera = new THREE.OrthographicCamera(-s * k, s * k, s, -s, 1, 1000);
    camera.position.set(200, 300, 200); 
    camera.lookAt(scene.position); 
   
    //添加渲染器
    var renderer = new THREE.WebGLRenderer();
    renderer.setSize(width, height);
    renderer.setClearColor(0xb9d3ff, 1); 
    document.body.appendChild(renderer.domElement); 

    //渲染函数
    function render() {
      renderer.render(scene, camera); 
      requestAnimationFrame(render); 
    }
    render();

    var controls = new THREE.OrbitControls(camera);


  </script>
</body>

</html>


```

运行结果及报错内容

如上述代码,运行后地球模型材质丢失了,只有人物模型材质还在。

我的解答思路和尝试过的方法

当我把人物模型加载代码去除后,地球的材质可以成功显示,如下图对比所示:

img

img

我想要达到的结果

请问各位大神,如何在Three.js中加载多个obj模型,并成功显示所有模型的材质?感谢!