How to create holes in objects without modifying the mesh structure in Three.js?

[belopot]

I want to create holes in objects without modifying the mesh structure.
Image initial scene:

image with sphere removed.

Can I resolve this problem by stencil and shader?
https://threejs.org/examples/?q=sten#webgl_clipping_stencil

[marquizzo]

You have two alternatives that I know if:

1. Write your own custom shaders, or
2. a material’s .alphaMap texture.

But if you want to use custom geometry, it’s going to be very difficult to calculate this in the shader code.

[GlifTek]

I know you don’t want to change the mesh, but if you have to…there’s Manthax’s fork of this… Link

But there is a fully explored method of how to do what you want with shaders… User prisoner849 here made one with a fish bowl and a cloud, there was another with a wood grain cube being cut with an invisible sphere.
I cannot find the links to them right now.

Possibly people that see this will know what I’m talking about.

Edit: or was it User gkjohnson with something like this… Link

[belopot]

Hello, @marquizzo @GlifTek Thank you for your answers.
However, please look at this video : I Learn About Stencil Buffers and Cutting Holes in Things - YouTube

Actually, I’m looking for a way to implement this in Three.js.

[hofk]

Did you see that?

In the Orb (Shaders) - #3 by prisoner849

From the Collection of examples from discourse.threejs.org

invisibleParts

[belopot]

Fantastic! Thank you @hofk
Can I use any shape instead of the sphere?

[belopot]

For instance, I want to use a box.

[prisoner849]

Then you have to define a box (center, size), pass it in uniforms of shader and process it there with your logics for clipping.

[GlifTek]

Yea that’s it. Finally found it late last night but forgot to post it.