three.js-将材料添加到OBJ加载程序(WEBGL)

问题描述 投票:0回答:2

嗨,我已经尝试了用于将材料添加到几何图形的不同源代码,但是如果我添加这样的代码:

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 );

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

three.js webgl
2个回答
2
投票

您的模型有UV坐标吗?问题object importing in Three.js中的代码执行的操作完全相同。


1
投票

在不使用线框属性的情况下使用MeshPhongMaterial(或Lambert)可获得与灯光(阴影)配合使用的材质。例如

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

MeshBasicMaterial总是平坦的。

也只替换纹理(贴图),而不是加载回调/遍历函数中的材质。您需要将那里的材质分配给对象,如果仅替换贴图,则材质类型将是创建的.obj加载器。

© www.soinside.com 2019 - 2024. All rights reserved.