伪造查看器中的剪切平面无法使用ShaderMaterial剪切对象

Question

我试图在forge-viewer中添加THREE.ShaderMaterial的自定义对象，我能够在forge-viewer的overlayScene中添加和渲染对象。

我引用this博客添加相同的内容。

我面临的问题是：伪造查看器的剪裁平面无法剪切自定义添加的对象。如果我尝试使用其他材质添加相同的对象，则剪切平面可以剪切它们。

我试过this。但是我得到Cannot resolve #include<clipping_planes_pars_vertex.glsl>的错误（对于其他着色器来源也是如此）。我试图在THREE.ShaderChunk中添加这些着色器，但没有奏效。

我已经看到错误来自ShaderChunk.ts，因为它没有在chunks[]中找到着色器。

1. 有没有办法使用THREE.ShaderMaterial剪裁平面？
2. 我是否需要在chunks[]的ShaderChunk.ts中添加自定义着色器？如果是的如何？

如果可能，请分享一个演示示例。

Answer 1

与您发现的其他Stack Overflow问题类似，Forge Viewer中的剖面工具使用自定义着色器逻辑，该逻辑仅包含在Viewer自己的材质中。尝试在材质着色器中包含以下代码段：

在顶点着色器中：

...
#if NUM_CUTPLANES > 0
    varying vec3 vWorldPosition;
#endif
...
void main() {
    ...
    #if NUM_CUTPLANES > 0
        vWorldPosition = vec3(/* include your own vertex world position here */);
    #endif
    ...
}
...

在片段着色器中：

...
#if NUM_CUTPLANES > 0
    varying highp vec3 vWorldPosition;
#endif

#include<cutplanes>
...
void main() {
    ...
    #if NUM_CUTPLANES > 0
        checkCutPlanes(vWorldPosition);
    #endif
    ...
}
...

在定义新的THREE.ShaderMaterial时，您还需要包含一些特定于切片的制服：

const uniforms = {
    ...
    "cutplanes": { type: "v4v", value: [] },
    "hatchParams": { type: "v2", value: new THREE.Vector2(1.0, 10.0) },
    "hatchTintColor": { type: "c", value: new THREE.Color( 0xFFFFFF ) },
    "hatchTintIntensity": { type: "f", value: 1.0 },
    ...
}

有关向gist添加切片支持的完整示例，请参阅此THREE.ShaderMaterial。