javascript Three.js 模型平滑多边形
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/24724366/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Three.js model smooth polygons
提问by Flash Thunder
I got something like this:
我得到了这样的东西：
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( 'obj/'+model+'.jpg', function ( image ) {
texture.anisotropy = anis;
texture.image = image;
texture.needsUpdate = true;
} );
// model
var loader = new THREE.OBJLoader( manager );
loader.load( 'obj/'+model+'.obj', function ( object ) {
object.traverse( function ( child ) {
if ( child instanceof THREE.Mesh ) {
child.material.map = texture;
if(reflex){
child.material.envMap = reflection;
child.material.shading = THREE.SmoothShading;
child.material.reflectivity = reflex;
}
}
} );
object.scale.set(10,10,10);
object.position.y = pos;
object.position.z = 0;
object.position.x = 0;
object.name = "model";
scene.add( object );
} );
Works fine, but... all polygons on model are visible this way...
工作正常，但是......模型上的所有多边形都以这种方式可见......
I would like to smooth things up... so I read here, that I could smooth them up like that:
我想把事情弄平……所以我在这里读到 ，我可以像这样把它们弄平：
// First we want to clone our original geometry.
// Just in case we want to get the low poly version back.
var smooth = THREE.GeometryUtils.clone( geometry );
// Next, we need to merge vertices to clean up any unwanted vertex.
smooth.mergeVertices();
// Create a new instance of the modifier and pass the number of divisions.
var modifier = new THREE.SubdivisionModifier(divisions);
// Apply the modifier to our cloned geometry.
modifier.modify( smooth );
// Finally, add our new detailed geometry to a mesh object and add it to our scene.
var mesh = new THREE.Mesh( smooth, new THREE.MeshPhongMaterial( { color: 0x222222 } ) );
scene.add( mesh );
But... I have no idea where do I get that geometry object... could anybody help me out?
但是......我不知道我从哪里得到那个几何对象......有人可以帮我吗？
回答by WestLangley
It appears that you need to smooth your vertex normals. You can do that with
看来您需要平滑顶点法线。你可以这样做
mesh.geometry.computeVertexNormals();
Call that function for each child mesh of your object (inside your traverse function).
为对象的每个子网格调用该函数（在遍历函数内）。
If that doesn't work, then the problem is that adjacent faces on your model are not sharing vertices. In that case, before you compute vertex normals, call
如果这不起作用，那么问题在于模型上的相邻面没有共享顶点。在这种情况下，在计算顶点法线之前，调用
mesh.geometry.mergeVertices();
three.js r.67
三.js r.67
