Three.js - 问题在自定义几何体上平滑着色Lambert材质

Lee*_*ski 10 javascript shader webgl three.js

我在Three.js中创建了一个自定义几何体.现在,我想创建一个使用光滑阴影Lambert材质的网格.使用循环,我创建了顶点数组,然后是面,然后我调用了

geometry.computeCentroids();
geometry.computeFaceNormals();
geometry.computeVertexNormals();

var colorMaterial =  new THREE.MeshLambertMaterial( {color: 0x0000ff, side: THREE.DoubleSide} );
var mesh = new THREE.Mesh( geometry, colorMaterial );
scene.add(mesh);
Run Code Online (Sandbox Code Playgroud)

结果几乎是完美的,除了看起来好像材料正在使用shading: THREE.FlatShading,如下所示:

在此输入图像描述

虽然我期待一个人通常期望的默认外观shading: THREE.SmoothShading.我需要添加/更改以获得平滑的Lambert着色?

(如果有帮助,一个完整的实例是http://stemkoski.github.io/Three.js/Marching-Cubes.html,几何和网格是围绕250-280行创建的.)

Wes*_*ley 25

这是因为相邻面在模型中不共享顶点.

如果geometry.mergeVertices()在完成几何体创建后立即调用,并且在调用之前调用geometry.computeVertexNormals(),则阴影将看起来更平滑.

three.js r.58

  • 完美,非常感谢!你值得拥有StackOverflow three.js天才徽章:) (5认同)