arek3D Posted March 2, 2017 Share Posted March 2, 2017 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! Quote Link to comment Share on other sites More sharing options...
GameMonetize Posted March 2, 2017 Share Posted March 2, 2017 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 1 Quote Link to comment Share on other sites More sharing options...
arek3D Posted March 2, 2017 Author Share Posted March 2, 2017 This is exactly what I wanted to achieve. You are a God here. No doubt. Thank you sooo much!! GameMonetize 1 Quote Link to comment Share on other sites More sharing options...
arek3D Posted March 9, 2017 Author Share Posted March 9, 2017 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. Quote Link to comment Share on other sites More sharing options...
GameMonetize Posted March 9, 2017 Share Posted March 9, 2017 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 1 Quote Link to comment Share on other sites More sharing options...
arek3D Posted March 9, 2017 Author Share Posted March 9, 2017 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!! Quote Link to comment Share on other sites More sharing options...
GameMonetize Posted March 10, 2017 Share Posted March 10, 2017 Yep this is because the stencil parameter is for the GL context so it can only be set when creating the engine arek3D 1 Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.