Sprites not rendering/showing on all angles of camera

I’m having troubles trying to show this sprites moving through a line on the scene. I did some research and saw that other people have problems with this but none of the answers help me to solve it.
Here is a fiddle where you can see the problem:

https://jsfiddle.net/Turkoz14/rq93hk25/3/

Any help and commentary would be great.
Thanks.

You have to use SpriteMaterial for your sprites not MeshBasicMaterial.

https://jsfiddle.net/rq93hk25/10/

Ok, thats a silly mistake sorry for that.
Now, i update the fiddle and add a box geometry with transparency to the scene because on my project i had a model of pipes and the sprites have to move inside it simulating gas, when i do that i cant see the particles through the pipes, is this a good approach to do that or there is a better way to do it ?

https://jsfiddle.net/rq93hk25/17/

Thanks!

Um, implementing something like this is always tricky. You maybe can achieve an acceptable solution by setting depthWrite of the box’s material to false (see https://jsfiddle.net/rq93hk25/25/). Otherwise I suggest you google this topic since there are many existing discussions about transparency issues in WebGL.

1 Like

Thanks, its working better now.