texture painting in real time / masking
26 November 2015 05:28
Hi
I am trying to have the ability to mask parts of objects out so that the background is visible where things are masked out.I use a static camera for my project so that makes things a bit easier.
The app user has to be able to "paint" on the canvas which would reveal the background behind the 3d objects.
One solution I was thinking of is to have background and foreground that match perfectly and the the foreground starts out masked out (black alpha map). Then the user can interactively paint the alpha map which would reveal the foreground and create the illusion of masking.
However I am not sure how to realize the painting part :)
Do you think something like this is possible through the API or do you think it would be better to use some other technology "on top" of b4w? Any pointers are welcome!
I am trying to have the ability to mask parts of objects out so that the background is visible where things are masked out.I use a static camera for my project so that makes things a bit easier.
The app user has to be able to "paint" on the canvas which would reveal the background behind the 3d objects.
One solution I was thinking of is to have background and foreground that match perfectly and the the foreground starts out masked out (black alpha map). Then the user can interactively paint the alpha map which would reveal the foreground and create the illusion of masking.
However I am not sure how to realize the painting part :)
Do you think something like this is possible through the API or do you think it would be better to use some other technology "on top" of b4w? Any pointers are welcome!
26 November 2015 18:23
Hi!
I suppose that you're talking about some sort of eraser.
This can be done through using the canvas textures, which can be easily modified from your script.
I've made a simple example of how to use it. Try to move the mouse with the left button pressed and the cube will start to disappear.
The idea is to setup a canvas texture in the object's material and then modify it somehow. The main problem is to transform the mouse coordinates into the texture coordinates properly, so the "erasing" will happen right under the mouse cursor. It depends on how the application should work. If you have a constant point of view you can use a simple plane (with such material) which billboards to the camera and "reveals" the background - in this case it should be easy to transform the coordinates. You can try to use this material with a complex 3d-object (like the cube in the example) but it will be harder to achieve a satisfying result.
I am trying to have the ability to mask parts of objects out so that the background is visible where things are masked out.I use a static camera for my project so that makes things a bit easier.
The app user has to be able to "paint" on the canvas which would reveal the background behind the 3d objects.
I suppose that you're talking about some sort of eraser.
This can be done through using the canvas textures, which can be easily modified from your script.
I've made a simple example of how to use it. Try to move the mouse with the left button pressed and the cube will start to disappear.
The idea is to setup a canvas texture in the object's material and then modify it somehow. The main problem is to transform the mouse coordinates into the texture coordinates properly, so the "erasing" will happen right under the mouse cursor. It depends on how the application should work. If you have a constant point of view you can use a simple plane (with such material) which billboards to the camera and "reveals" the background - in this case it should be easy to transform the coordinates. You can try to use this material with a complex 3d-object (like the cube in the example) but it will be harder to achieve a satisfying result.