CODEWITHSUNDEEP
three.js
Andreas S
Andreas S

Reputation: 461

Shading of a plane

It is probably a beginner question, but why does the plane appear to be flat? Why is the structure of the plane not visible, only the spikes on the edges?

http://codepen.io/asz/pen/GgXpXW

var geometry = new THREE.PlaneBufferGeometry( 100, 100, 50, 50 );

var vertices = geometry.attributes.position.array;
for ( var i = -1; i < vertices.length; i += 3) {
  vertices[i] = Math.random() * 10;
}

geometry.applyMatrix( new THREE.Matrix4().makeRotationX( - Math.PI / 2.8 ) );

var material = new THREE.MeshPhongMaterial( { ambient: 0x00ff00, color: 0x00ff00, specular: 0x00ff00, shininess: 30, shading: THREE.FlatShading } );
var ground = new THREE.Mesh( geometry, material );
scene.add( ground );

Upvotes: 1

Views: 656

Answers (1)

2pha
2pha

Reputation: 10155

To do with normals.
add geometry.computeVertexNormals();

eg.

var vertices = geometry.attributes.position.array;
for ( var i = -1; i < vertices.length; i += 3) {
  vertices[i] = Math.random() * 10;
}
geometry.computeVertexNormals();

Upvotes: 4

Related Questions