Texture glitch when rendering scene to texture (heads up display)


I’m creating holo cards as 3D game items, as in the awsome ghost card codepen:

Card content is rendered not to screen, but applied as a texture. Problem happens when the scene with the card content overflows the renderer size, there’s no enough info for each pixel of the texture, what comes to a render glitch (horizontal and vertical lines). Zoom and rotate to see the problem.

I created a minimal codesandbox to illustrate the problem (I used React, but it’s just a single short file). I’m conviced there should be an obvious solution, but I’m very noob at threejs.

The same happens in the ghost card example (here the problem happens when card is slightly smaller than viewport).


Did you succeed ? currently trying to fix this issue too lol. Will update if i find the solution.