THREE.ExtrudeBufferGeometry 的多边形很少答案

【问题标题】：THREE.ExtrudeBufferGeometry has very few polygonsTHREE.ExtrudeBufferGeometry 的多边形很少
【发布时间】：2021-01-17 15:46:17
【问题描述】：

我有一个带有简单矩形的 SVG（尽管作为路径），我使用 THREE.SVGLoader 将其加载到我的应用程序中，如下所示：https://threejs.org/examples/#webgl_loader_svg，并使用以下代码：

            const paths = paths_.paths
            const geometry = new THREE.Geometry()

            for (let i = 0; i < paths.length; i++) {

                const path = paths[i]

                const shapes = path.toShapes(false)

                for (let j = 0; j < shapes.length; j++) {
                    const shape = shapes[j]

                    const shape3d = new THREE.ExtrudeBufferGeometry(shape, {
                        depth: 0.1,
                        bevelThickness: 2,
                        bevelSize: 1.5,
                        bevelSegments: 5,
                        bevelEnabled: true
                    });

                    const edgeGeometry = new THREE.Geometry().fromBufferGeometry(shape3d)

                    geometry.merge(edgeGeometry)
                }
            }

            geometry.computeFaceNormals()
            geometry.mergeVertices()
            geometry.computeVertexNormals()

            geometry.center()

            return geometry

我创建一个几何图形并从中创建一个 3d 网格。

问题在于 ExtrudeBufferGeometry 使用（我认为）Earcut 三角剖分来创建构成路径形状的多边形，因此在我的网格的顶面和底面上没有很多三角形.

我需要很多面，因为我想使用这个库https://github.com/drawcall/threejs-mesh-modifiers 弯曲网格，但是如果没有很多面，这将不会很好，如下图所示：

我尝试了 SubdivisionModifier 来添加多边形，但它不起作用，因为它创建了奇怪的孔和伪影（这个库中有一条评论说修改器不适用于锐利的边缘）。

我什至尝试使用 CSG 库，我正在使用该库将这个拉伸网格与具有许多段的 BoxGeometry 网格相交，它可以工作，但它也会产生孔洞和伪影。

似乎 THREE.ExtrudeBufferGeometry 创建了一个没有 100% 正确法线的几何体。

总的来说，我尝试了很多东西，例如：标志、计算顶点法线、面法线、平面着色、平滑着色、更改了 ExtrudeBufferGeometry 的所有参数，但似乎没有任何效果。

任何帮助将不胜感激！

【问题讨论】：

这种挤压需要以编程方式发生吗？我的第一个想法是，从 Blender 导入具有所需变形的模型非常容易，但如果需要动态生成，这将不起作用。
@Marquizzo 不幸的是，它必须在网络应用程序中以编程方式创建。

标签： svg three.js path geometry triangulation

【解决方案1】：

使用这个解决方案：intersecting meshes results to mesh with wholes 我设法使用了 manthrax 版本的 CSG 库，以便将一个特定的框与我的对象相交并取回一个在顶部和底部添加了多边形的对象：

【讨论】：