How to render an object so that it always appears before another?

Hi everyone,

I’m looking for a way to render an object so it appears ALWAYS before another. I started to work from this example (PG). I want the effect that is produced here, that is to render the billboard only within the cube. But also, I’d like it to be shown no matter where it is relative to the cube. So imagine I rotate 180 degree the camera, i’d like the billboard to appear too. Or, let’s say I make the box bigger (so that it kind of eats the billboard), I’d like it to appear anyway.

Any hints ? Thanks in advance.

Regards

(edit: adding example)

Are you trying to achieve something like this - Stencil render order | Babylon.js Playground (babylonjs-playground.com) ? or do you mean to use the stencil and depth buffer?

Well, this is indeed what I want but here I lost the fact that the billboard is not rendered only where the cube is. I’m not sure I’m clear, so here is a comparison :

In your example :

What I would like :


The billboard is clipped within the cube bounds. So I need kind of the sum of your example and the one I gave in the first post. (Edit) That is :
Demo
but if the billboard is “inside” the cube it should remain visible.

Thank you for your help!

Sorry for the double post, I’ve just found the solution with this example (PG). Thank you again for your time @RaananW .

In this case, would you mind to tick the box ‘solution’? It’s just that in this forum, we do not like unsolved problems. So other people might come back to it until it is marked as ‘solved’. Thx and have a great day,

2 Likes

Thank you. You’re legend and welcomed in this forum :smiley:

1 Like