Hello guys. Today I found a wierd thing when working on a project.
PG: https://playground.babylonjs.com/#QHKRN3#2
In the above PG is a simple project where you can drag and move around cards. As you can see, when the camera is set at Vector3(0,40,0) the two cards appear as intended: left one higher,right one lower. The wierd glitch appears when I go ahead and set camera’s Vector3 to (0,50,0). The cards appear as the right one is above the left one. The dragging works the same tho, it will pick correct even if the visual glitch appears.
To solve it I need to make a liitle more space between the two card’s y position but still, the glitch is rather weird.
I can repro the issue in firefox.
I think it’s a precission issue while calculating the view matrix.
In your case the camera direction is collinear to the upVector of the camera which leads to this problem. You can specify a different upVector to solve this issue.
see line 6 here: https://playground.babylonjs.com/#QHKRN3#3
Sorry i just realized, that we are talking about different problems. In firefox the cards are shown up side down for me. The UpVector fixes this issue.
The problem you are having sounds like typical z-fighting … z-buffer precision issue. You can try to increase the distance (y-axis) between your cards.
