Trying to get a low poly look on PlaneGeometry

Questions
1

I’m trying to get a low poly look on the ground in my scene. I try to do that with flatShading, but it doesn’t seem to work.

This is my code:

 const groundGeo = new THREE.PlaneBufferGeometry(10000, 10000, 32);
 const groundMat = new THREE.MeshPhongMaterial({
        color: 0x129b40,
        flatShading: true
      });


 const ground = new THREE.Mesh(groundGeo, groundMat);
 ground.position.y = -33;
 ground.rotation.x = -Math.PI / 2;

 scene.add(ground);

Does anyone has an idea how to fix this?

2

Can you please describe in more detail what style you are looking for? A screenshot would be helpful.

3

This is what I have now:

Screenshot 2020-12-05 at 13.02.35
Screenshot 2020-12-05 at 13.02.353834×878 74.7 KB

And this is what I want to create:

1920×1080

4

You might want to check out this example: https://threejs.org/examples/#misc_controls_pointerlock

The idea is to tesselate the floor and then provide a vertex color attribute so each face can have a unique color.

2 Likes
5

Thanks a lot! I will take a look at it :slight_smile: