Hey, I’m using extrudeGeometry to generate a mesh from a Shape. I tried running compute VertexNormals to get rid of the flat shading but it doesn’t do anything. Am I doing something wrong ?
const baseShape = new THREE.Shape();
const w = 0.8
const br = 0.1
baseShape.absarc( w, w, br, 0, Math.PI/2);
baseShape.absarc(-w, w, br, Math.PI/2, Math.PI)
baseShape.absarc(-w, -w, br, Math.PI, 3*Math.PI/2)
baseShape.absarc(w, -w, br, 3*Math.PI/2, 2*Math.PI)
var extrudeSettings = {
steps: 4,
depth: 1,
bevelEnabled: true,
bevelThickness: 0.1,
bevelSize: 0.1,
bevelSegments: 8,
curveSegments: 16,
};
var geometry = new THREE.ExtrudeGeometry( baseShape, extrudeSettings )
//Here I apply computeVertexNormals()
geometry.computeVertexNormals()
var material = new THREE.MeshStandardMaterial()
var mesh= new THREE.Mesh( geometry, material )
scene.add(mesh)
Ok too bad, in this application, the mesh is procedurally generated by the user. I expose parameters like bevel, depth,… So I can’t model it beforehand. Do you have any suggestion on how I could achieve this ? Does the geometry need to be indexed ? Thanks for your help
I’m not sure what the final look you’re going for is but you should be able to remove the existing normals attribute, use BufferGeometryUtils.mergeVertices, and then compute vertex normals to get a smoother look.
If you still need some corners to be sharp you can try the toCreasedNormalGeometry function in this PR:
Hey, thanks a lot! Just tried that and it works! But it leaves a few seams. I tried playing with it but couldn’t find any solution against that. If you have any explanation on what it actually does and why I still have some of those seams, I’d love to hear from you.
