2013-04-09 133 views
2

我想加载obj文件使用OBJloader.js 我想加载“plane.obj”文件存在于同一个文件夹中的HTML文件存在和“OBJLoader .js“也存在于同一个文件夹中。Three.js OBJLoader不加载obj文件

页面不显示任何内容。

下面是代码:

var scene = new THREE.Scene(); 
camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 1000); 
var renderer = new THREE.WebGLRenderer(); 
renderer.setSize(window.innerWidth, window.innerHeight); 
document.body.appendChild(renderer.domElement); 
var geometry = new THREE.CubeGeometry(1,1,1); 
var material = new THREE.MeshBasicMaterial({color: 0x00ff00}); 
var cube = new THREE.Mesh(geometry, material); scene.add(cube); camera.position.z = 5; 
function render() { 
    requestAnimationFrame(render); 
    cube.rotation.x += 0.01; 
    cube.rotation.y += 0.01; 
    renderer.render(scene, camera); 
} 
var texture = THREE.ImageUtils.loadTexture('tex.jpg'); 
var loader = new THREE.OBJLoader(); 
loader.load('plane.obj', function (object) { 
    scene.add(object); 
}); 
render(); 
+0

控制台是否显示任何错误? – mrdoob 2013-04-09 01:56:09

+0

您可以确保plane.obj与另一个查看器加载吗?你也可以从场景中移除立方体。如果plane.obj太小,它可能会落入立方体内,并需要一些比例因子。 – gaitat 2013-04-09 09:53:15

+0

谢谢Mrdoob和Gaitat。我检查了控制台错误,并且它的“只有HTTP支持跨源请求”。我想我将不得不从服务器(http:// localhost等)运行此页面。 – user2259784 2013-04-10 01:18:29

回答

0

这可能是由试图加载从文件系统的资源引起的。您可能会获得相同的来源策略安全违规,并需要从相同的协议,域和端口提供您的页面和资源。有几个简单的方法可以做到这一点 - 我通过Node JS使用一个简单的http服务器应用程序。请查看How to run things locally了解更多选项。

0

那么,事实证明,这是由于现场没有灯光造成的。此外,不适当的相机位置也可能导致“隐形”OBJ模型。尝试添加以下行:

var ambientLight = new THREE.AmbientLight(0xffffff); 
scene.add(ambientLight);