[SOLVED] How to display an object only on a different object

[arek3D]

Hello,

what do you think, what is the best way to show this green tree only at this gray box. I would like to hide every pixel which is outside the box, even if I will rotate a camera.

http://www.babylonjs-playground.com/#2L76JS#1

This plane will be pickable and the user will be able to move it above 3D object, but it is necessary to hide pixel outside.

I tried to make a layer/foreground, put there a texture made by RenderTargetTexture of gray box and mask every planes which I will add. But this solution is not good, because in this function I need to have an URL of the image, not a texture:

new Layer(name, imgUrl, scene, isBackground, color)

Do you have any ideas how to get this effect?

Thank you in advance!

 

[GameMonetize]

Something like that?

http://www.babylonjs-playground.com/#2L76JS#2

The basic idea is to render the cube with stencil buffer on: it will write the value of 1 on every convered pixel. Then we render the plane ONLY if pixel contains 1 in the stencil value

[arek3D]

This is exactly what I wanted to achieve.
You are a God here. No doubt.
Thank you sooo much!!

[arek3D]

I don't have any idea, how it is possible, but I had implemented this in my project and it didn't work.

After many hours I decided to download this scene from Playground, and test it on my HDD, and it didn't work too. It is a big surprise for me :/ 

@Deltakosh, do you have any idea what is going on here?  

Chrome doesn't show any errors.
The only error message I got, was in Mozilla Firefox console, but I doubt that it is related to this issue.

 Error: WebGL: Failed to create WebGL context: WebGL creation failed: 
* Error during ANGLE OpenGL init.
* Error during ANGLE OpenGL init.
* Error during ANGLE OpenGL init.
* Error during ANGLE OpenGL init.
* Error during ANGLE OpenGL init.
* Exhausted GL driver caps.  babylon.js:4:12713
BJS - [14:20:55]: Babylon.js engine (v3.0-alpha) launched  babylon.js:3:22931
Error: WebGL: texImage2D: Conversion requires pixel reformatting.

 

[GameMonetize]

Hello I think this is because you need to turn on stencil buffer (off by default) with this line:

engine = new BABYLON.Engine(canvas, true, {preserveDrawingBuffer: true, stencil: true});

[arek3D]

I have tested it on this sample scene on my HDD, and it WORKS! So I think it will be similar in my project, I will check it tomorrow ;D

I didn't know about this parameter in engine costructor, but I tried to set stencil's flags by myself, and there was not any effects:

engine.isStencilEnable = true;
engine._isStencilEnable = true ;

 

Anyway, thanks a lot @Deltakosh!!

 

[GameMonetize]

Yep this is because the stencil parameter is for the GL context so it can only be set when creating the engine