Faces disappear when viewing from the front side

Hi, I’m using threejs to create a heatmap with mapbox. I generated its vertices, faces, and vertexColors according to my data, pushing them into the geometry. After viewing the result in my browser, I found a problem.
when I viewed the heatmap from the front side, some parts(faces) of the heatmap mesh disappeared.

But when I viewed it from the back side, everything was right and nothing disappeared.

More and more faces began to disappear when I was changing my view to the front side, this is a process.

This is NOT a problem cause by material.side, it has been set to THREE.DoubleSide
I’ve tried several ways below to solve the problem, but they didn’t work:
1.change the near / far of the perspective camera
2.set material.depthWrite/depthTest to false
3.set mesh.frustumCulled to false

I’ll appreciate ur suggestion for me :smiley:

Could you share a preview link / more detailed video of what’s happening? Since you crossed out the primary options (ie. Material.side and near/far planes), it’s a bit hard to tell just from screenshots of discrete views :thinking:

Maybe you have set that parameter of material? transparent: true

Thank u, I’ve tried but it didn’t work.

Here’s how I create the heatmap mesh:

Threejs version r94

Could you share a demo, a JSFiddle, or testable code rather than screenshots of that code? We will not be able to test or debug for you using screenshots.

If you are using transparent: true (which should be false unless you really need it!) then you should generally also be using depthWrite: false.

1 Like