Question

嗨，我尝试使用不同的源代码将材质添加到几何体中但是如果我添加这样的代码：

var material1 = new THREE.MeshBasicMaterial( { color: 0x00ff00, wireframe: true } );

我没有给我的obj（模型）着色/材质。它就像一个平面视图。示例： http://dev.interactive-creation-works.net/Three/viewer.html

// This string has to be the path to your texture file.
loader.load( '0.jpg' );

/*** OBJ Loading ***/
var loader = new THREE.OBJLoader();

// As soon as the OBJ has been loaded this function looks for a mesh
// inside the data and applies the texture to it.
loader.addEventListener( 'load', function ( event ) {
var object = event.content;
object.traverse( function ( child ) {
  if ( child instanceof THREE.Mesh ) {
    child.material.map = texture;
  }
} );

 // object = new THREE.Mesh( geometry, [ new THREE.MeshFaceMaterial(), new   THREE.MeshPhongMaterial( { color: 0xff4400, wireframe: true, wireframeLinewidth: 2 } ) ] );
object = new THREE.Mesh(geometry);

// My initial model was too small, so I scaled it upwards.
object.scale = new THREE.Vector3( 25, 25, 25 );

// You can change the position of the object, so that it is not
// centered in the view and leaves some space for overlay text.
object.position.y -= 2.5;
scene.add( object );

});

// This string has to be the path to your object file.
loader.load( '0.obj' );

// We set the renderer to the size of the window and
// append a canvas to our HTML page.
renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
container.appendChild( renderer.domElement );

任何人最终都可以帮助我吗？

Answer 1

你的型号有UV线吗？这个问题object importing in Three.js中的代码完全相同。

Answer 2

使用不带线框属性的MeshPhongMaterial（或Lambert）来获取与灯光一致的材质（阴影）。例如

var material1 = new THREE.MeshPhongMaterial( { color: 0x00ff00 } );

MeshBasicMaterial总是持平。

此外，您只需替换纹理（贴图），而不是加载回调/遍历功能中的材质。您需要将材质分配给对象，如果只替换地图，材质类型将是.obj加载器创建的。

three.js - 向OBJ加载器添加材料（WEBGL）

2 个答案: