# Clipping planes on ShaderMaterial
**URL:** https://discourse.threejs.org/t/clipping-planes-on-shadermaterial/10155
**Category:** Questions
**Tags:** materials
**Created:** [October 11, 2019, 11:22am UTC](https://discourse.threejs.org/t/clipping-planes-on-shadermaterial/10155 "2019-10-11T11:22:02Z")
**Posts on this page:** 7
**Page:** 1
### Author:  [@Sogrey](https://discourse.threejs.org/u/Sogrey)
#### Post date: [October 11, 2019, 11:22am UTC](https://discourse.threejs.org/t/clipping-planes-on-shadermaterial/10155/1 "2019-10-11T11:22:02Z")
How to implement clipping on ShaderMaterial?
[http://fiddle.jshell.net/sogrey/5wL20k3m/32/show/](http://fiddle.jshell.net/sogrey/5wL20k3m/32/show/)
---
### Author:  [@EliasHasle](https://discourse.threejs.org/u/EliasHasle)
#### Post date: [October 11, 2019, 11:25am UTC](https://discourse.threejs.org/t/clipping-planes-on-shadermaterial/10155/2 "2019-10-11T11:25:26Z")
First advice is to include the clipping `ShaderChunk`s, as is done in the built-in shaders in `ShaderLib`. Both are found under `src/renderers/shaders`.
---
### Author:  [@Sogrey](https://discourse.threejs.org/u/Sogrey)
#### Post date: [October 12, 2019, 2:33am UTC](https://discourse.threejs.org/t/clipping-planes-on-shadermaterial/10155/3 "2019-10-12T02:33:34Z")
In the example, the plane is clipped, but the box is not. The material of the box is ShaderMaterial.
[https://jsfiddle.net/5wL20k3m/](https://jsfiddle.net/5wL20k3m/)
---
### Author:  [@Sogrey](https://discourse.threejs.org/u/Sogrey)
#### Post date: [October 12, 2019, 3:00am UTC](https://discourse.threejs.org/t/clipping-planes-on-shadermaterial/10155/4 "2019-10-12T03:00:43Z")
Is that all?
>
---
### Author:  [@EliasHasle](https://discourse.threejs.org/u/EliasHasle)
#### Post date: [October 12, 2019, 6:39am UTC](https://discourse.threejs.org/t/clipping-planes-on-shadermaterial/10155/5 "2019-10-12T06:39:58Z")
Yes. You have to `#include` them in the same/similar places that they are included in e.g. `MeshBasicMaterial`, whose shaders you will find in the `ShaderLib` folder (`three.js\src\renderers\shaders\ShaderLib`). They are named `meshbasic_vert.glsl.js` and `meshbasic_frag.glsl.js`.
---
### Author:  [@Sogrey](https://discourse.threejs.org/u/Sogrey)
#### Post date: [October 12, 2019, 8:13am UTC](https://discourse.threejs.org/t/clipping-planes-on-shadermaterial/10155/6 "2019-10-12T08:13:43Z")
tks,
I found this question:
>
and it’s a demo:
[https://jsfiddle.net/sogrey/q8bt026y/embedded/](https://jsfiddle.net/sogrey/q8bt026y/embedded/)
---
### Author:  [@paulbrzeski](https://discourse.threejs.org/u/paulbrzeski)
#### Post date: [June 23, 2024, 4:19pm UTC](https://discourse.threejs.org/t/clipping-planes-on-shadermaterial/10155/7 "2024-06-23T16:19:21Z")
Sorry for the bump but found this thread and thought I’d add my findings as I’m having issues implementing clipping planes with clip intersection right now. I’ve included the ShaderChunks as suggested in the original StackOverflow answer and got it working with clipIntersection set to false. But it’s not working the other way with clipIntersection set to true.
I had a play with the [advanced clipping example](https://threejs.org/examples/webgl_clipping_advanced.html) on my local and it seems to have the same limitation so it’s not just my code. Clipping planes can work if you’re trying to reduce an object via it’s outsides, but in my use case I’m using a THREE.Water as an ocean and want to cut a octagon out of it for a submerged mesh with a hollow center.
About to try another approach with Alpha Maps instead.
Update:
- Alpha Maps worked ok, but unless I write some dynamic canvas drawing code it won’t hold up well when I need multiple transparent spots or want to change things
- Switched to passing coordinates for doing alpha and it worked great, the vertex shader code already had a worldCoordinate variable so I just evaluate that