motivate

之前试了一下简单的剖面，利用平面方程，就可以做到

然后怎么给补上呢

如图 如果直接挖了，那红色那里就是空的

three.js 第五十六用 剖面盖上 stencil补面_Front

口嗨

有一个显而易见的方法，就是真的去计算几何，把面给补上
这次说模板stencil怎么操作
背面先画一个给buffer设置到1
然后画正面，buffer-- 这时候，shader里discard的画 这个部分的buffer就不会减1
最后画一个plane，要buffer是1的地方且深度测试通过的地方才显示
整个流程就这样了

伪代码

下面上伪代码
第一步，给这个球设置一下

spherematerial.side = THREE.BackSide;
spherematerial.stencilFail = THREE.IncrementWrapStencilOp;
spherematerial.stencilZFail = THREE.IncrementWrapStencilOp;
spherematerial.stencilZPass = THREE.IncrementWrapStencilOp;
spherematerial.side = THREE.Front;
spherematerial.stencilFail = THREE.DecrementWrapStencilOp;
spherematerial.stencilZFail = THREE.DecrementWrapStencilOp;
spherematerial.stencilZPass = THREE.DecrementWrapStencilOp;

然后把这个球画出来
然后构造一个平面

stencilWrite: true,
stencilRef: 0,
stencilFunc: THREE.NotEqualStencilFunc,
stencilFail: THREE.ReplaceStencilOp,
stencilZFail: THREE.ReplaceStencilOp,
stencilZPass: THREE.ReplaceStencilOp,

就这样设置一下
画出来 就OK了
真实代码你可以沿着这个思路看看three给出的demo