Will different perspectives have different effects when overlaying flat graphics?

When viewed from a large angle

image

When viewed from a small angle

image

Why is it that when viewed from a small angle, the middle of the stripes is not transparent, but black

demo:https://stackblitz.com/edit/stackblitz-starters-rwnypm?file=src%2Fmain.ts

This is caused by having both objects transparent. The rendering automatically sorts them (as the algorithm for showing transparent objects requires to have them sorted). The two simplest ways to fix the issue are:

  • remove the transparency of the blue object, as it is not needed (i.e. in line 23)
  • manually set the rendering order so that the two objects are drawn in the same order independent on the angle.
2 Likes

Thank you very much. I manually set the rendering order using renderOrder to solve this problem :100:

1 Like