<!DOCTYPE html>
lesson1-by-shawn.xie
<!--引入Three.js-->
<br> //开启Three.js渲染器<br> var renderer;//声明全局变量（对象）<br> function initThree() {<br> var element = document.getElementById("canvas3d");<br> width = document.getElementById('canvas3d').clientWidth;//获取画布「canvas3d」的宽<br> height = document.getElementById('canvas3d').clientHeight;//获取画布「canvas3d」的高<br> renderer=new THREE.WebGLRenderer({antialias:true});//生成渲染器对象（属性：抗锯齿效果为设置有效）<br> renderer.setSize(width, height );//指定渲染器的高宽（和画布框大小一致）<br> document.getElementById('canvas3d').appendChild(renderer.domElement);//追加 【canvas】 元素到 【canvas3d】 元素中。<br> renderer.setClearColor(0x000000, 1.0);//设置canvas背景色(clearColor)<br> }<br> //设置相机<br> var camera;<br> function initCamera() { <br> camera = new THREE.PerspectiveCamera( 45, width / height , 1 , 500 );//设置透视投影的相机,默认情况下相机的上方向为Y轴，右方向为X轴，沿着Z轴朝里（视野角：fov 纵横比：aspect 相机离视体积最近的距离：near 相机离视体积最远的距离：far）<br> camera.position.x = 50;//设置相机的位置坐标<br> camera.position.y = 10;//设置相机的位置坐标<br> camera.position.z = 25;<br> camera.up.x = 0;//设置相机的上为「x」轴方向<br> camera.up.y = 0;//设置相机的上为「y」轴方向<br> camera.up.z = 1;//设置相机的上为「z」轴方向<br> camera.lookAt( {x:0, y:0, z:0 } );//设置视野的中心坐标<br> }</p> <pre><code> //设置场景 var scene; function initScene() { scene = new THREE.Scene(); } //设置光源 var light; function initLight() { light = new THREE.DirectionalLight(0xff0000, 1.0, 0);//设置平行光源 light.position.set( 200, 200, 200 );//设置光源向量 scene.add(light);// 追加光源到场景 } //导入模型 var loader; function initObject(){ loader=new THREE.OBJLoader(); loader.load('male02.obj',function(object){ scene.add(object);}); } //执行 function threeStart() { initThree(); initCamera(); initScene(); initLight(); initObject(); renderer.clear(); renderer.render(scene, camera); } //threeStart(); </script> <style type="text/css"> div#canvas3d{ border: none; cursor: move; width: 1400px; height: 600px; background-color: #EEEEEE; } </style> </head> <body onload='threeStart();'> <!--盛放canvas的容器--> <div id="canvas3d"></div> </body> </code></pre> <p></html><br> 利用three.js导入obj模型，发现无法显示，请各位大神帮忙看下问题出在哪？利用chorme和firefox分别得到如下提示<img src="https://img-ask.csdn.net/upload/201709/20/1505914725_165217.png" alt="图片说明"><img src="https://img-ask.csdn.net/upload/201709/20/1505914742_786938.png" alt="图片说明"></p>
