使用three.js加载.obj时出现问题

我试图使用three.js加载.obj文件,但不幸的是它说“无法加载资源:服务器响应状态为404(未找到)”的错误

以下是我正在使用的示例链接

view-source: http : //mrdoob.github.io/three.js/examples/webgl_loader_obj.html

CODE如下

   three.js webgl - loaders - OBJ loader    body { font-family: Monospace; background-color: #000; color: #fff; margin: 0px; overflow: hidden; } #info { color: #fff; position: absolute; top: 10px; width: 100%; text-align: center; z-index: 100; display:block; } #info a, .button { color: #f00; font-weight: bold; text-decoration: underline; cursor: pointer }    
three.js - OBJLoader test
var container, stats; var camera, scene, renderer; var mouseX = 0, mouseY = 0; var windowHalfX = window.innerWidth / 2; var windowHalfY = window.innerHeight / 2; init(); animate(); function init() { container = document.createElement( 'div' ); document.body.appendChild( container ); camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 1, 2000 ); camera.position.z = 100; // scene scene = new THREE.Scene(); var ambient = new THREE.AmbientLight( 0x101030 ); scene.add( ambient ); var directionalLight = new THREE.DirectionalLight( 0xffeedd ); directionalLight.position.set( 0, 0, 1 ); scene.add( directionalLight ); // texture var manager = new THREE.LoadingManager(); manager.onProgress = function ( item, loaded, total ) { console.log( item, loaded, total ); }; var texture = new THREE.Texture(); var loader = new THREE.ImageLoader( manager ); loader.load( 'textures/UV_Grid_Sm.jpg', function ( image ) { texture.image = image; texture.needsUpdate = true; } ); // model var loader = new THREE.OBJLoader( manager ); loader.load( 'obj/male02/male02.obj', function ( object ) { object.traverse( function ( child ) { if ( child instanceof THREE.Mesh ) { child.material.map = texture; } } ); object.position.y = - 80; scene.add( object ); } ); // renderer = new THREE.WebGLRenderer(); renderer.setSize( window.innerWidth, window.innerHeight ); container.appendChild( renderer.domElement ); document.addEventListener( 'mousemove', onDocumentMouseMove, false ); // window.addEventListener( 'resize', onWindowResize, false ); } function onWindowResize() { windowHalfX = window.innerWidth / 2; windowHalfY = window.innerHeight / 2; camera.aspect = window.innerWidth / window.innerHeight; camera.updateProjectionMatrix(); renderer.setSize( window.innerWidth, window.innerHeight ); } function onDocumentMouseMove( event ) { mouseX = ( event.clientX - windowHalfX ) / 2; mouseY = ( event.clientY - windowHalfY ) / 2; } // function animate() { requestAnimationFrame( animate ); render(); } function render() { camera.position.x += ( mouseX - camera.position.x ) * .05; camera.position.y += ( - mouseY - camera.position.y ) * .05; camera.lookAt( scene.position ); renderer.render( scene, camera ); }

如果有人上面有这些例子,那么请告诉我你是怎么做的?

谢谢,Pratik

我在这种情况下的问题是在Windows Server上允许Mime Type。

您可以手动或在代码中执行此操作:

手动方式:

  1. 转到IIS设置
  2. 打开Mime类型设置
  3. 单击添加
  4. Mime类型灭绝:.obj
  5. Mime类型:application / octet-stream
  6. 单击添加
  7. 重启您的站点或应用程序池

代码 – 将以下内容放入Web.config:

      

404错误表示无法在您定义的位置找到该文件。 如果您在localhost中运行,那么在与demo.html文件相同的文件夹中,您应该:

  • 一个名为obj的目录,包含一个名为male02的目录,其中包含一个名为male02.obj的文件
  • 一个名为textures的目录,包含一个名为UV_Grid_Sm.jpg的文件

该错误意味着您目前没有。

如果您是一位经验丰富的开发人员,我想您现在可以解决这个问题。 如果您不熟悉开发并且难以理解当前链接所指向的位置,那么可能需要花一些时间来更新您对绝对和相对链接的理解: http : //webdesign.about.com/od/beginningtutorials/a/aa040502a热媒

我遇到了这个问题并改变了Mime设置但没有成功。 似乎解决了这个问题的原因是直接从我的Web主机面板重新创建一个新文件,并将.obj和.mtl代码复制到其中,并使用适当的后缀重新命名。