Draw Line always on top of transparent sprites

I have two sprite object and one Line object.
I want the line always on top of the sprites no matter what.
I set render order to sprites 0, and 1 respectively. And renderOrder to Line as 3.
I also set depthTest false to my sprites and depthTest, depthWrite false to the line. It seems my line always shows behind the sprites. Sprites has Texture with transparent svg image.

Just make the line transparent too.

var line = new THREE.Line( geometry, material );
    line.material.transparent = true;
    line.renderOrder = 3;

Interesting approach, this effectively solves the seperate transparent and non transparent render queues issue, do you know at what cost setting a material to transparent is?

1 Like

The biggest problem is when several objects with transparency (true or fake) are stacked over one another. However, lines are thin and this issue would be hard (or impossible) to see.

Alternative approach to control render order across transparent and non-transparent objects is via separate renderer.render calls. But this would also require manual clearing of buffers.