# Will different perspectives have different effects when overlaying flat graphics?

**URL:** <https://discourse.threejs.org/t/will-different-perspectives-have-different-effects-when-overlaying-flat-graphics/66880>\
**Category:** Questions\
**Tags:** camera, shaders\
**Created:** [June 15, 2024, 5:03am UTC](https://discourse.threejs.org/t/will-different-perspectives-have-different-effects-when-overlaying-flat-graphics/66880 "2024-06-15T05:03:23Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![wc19950724](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/wc19950724/32/44184_2.png) [@wc19950724](https://discourse.threejs.org/u/wc19950724)\
**Post date:** [June 15, 2024, 5:03am UTC](https://discourse.threejs.org/t/will-different-perspectives-have-different-effects-when-overlaying-flat-graphics/66880/1 "2024-06-15T05:03:24Z")

</div>

> When viewed from a large angle

![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/8/b/8b1d6900e08e5e6920f0d8cab13c95a6331633f6.png)

> When viewed from a small angle

![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/0/e/0e2f330f84b1f92766b45f8f06cf00209592e947.png)

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](https://stackblitz.com/edit/stackblitz-starters-rwnypm?file=src%2Fmain.ts)

---

<div class="post-metadata">

**Author:** ![PavelBoytchev](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/pavelboytchev/32/38639_2.png) [@PavelBoytchev](https://discourse.threejs.org/u/PavelBoytchev)\
**Post date:** [June 15, 2024, 4:41pm UTC](https://discourse.threejs.org/t/will-different-perspectives-have-different-effects-when-overlaying-flat-graphics/66880/2 "2024-06-15T16:41:57Z")

</div>

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.

---

<div class="post-metadata">

**Author:** ![wc19950724](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/wc19950724/32/44184_2.png) [@wc19950724](https://discourse.threejs.org/u/wc19950724)\
**Post date:** [June 16, 2024, 5:20am UTC](https://discourse.threejs.org/t/will-different-perspectives-have-different-effects-when-overlaying-flat-graphics/66880/3 "2024-06-16T05:20:15Z")

</div>

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