在ExtrudeGeometry上的THREE.JS纹理映射

Question

我正在研究three.js和ExtrudeGeometry的问题。 我确实有一个由几个单独的框架制成的波浪状结构。 它们每个都使用ExtrudeGeometry进行挤压。

我想将纹理应用于“包裹”结构的结构的每个框架。 由于某种原因（可能是错误的UV贴图？），纹理在波浪形表面不齐平的挤压边缘上无法正确显示。 （图片中的一些小部分纹理正确包裹）。 我正在使用以下脚本来应用纹理：

// create some simple Geometry
var shape = new THREE.Shape();

shape.moveTo( 0,0 );
shape.lineTo( 0,10 );
shape.lineTo( 100,7 );
shape.lineTo( 100,0 );

var extrudeSettings = {
    steps: 2,
    amount: 10,
    bevelEnabled: false,
    bevelThickness: 0,
    bevelSize: 0,
    bevelSegments: 0
};

var geometry = new THREE.ExtrudeGeometry( shape, extrudeSettings );
var texture = new THREE.Texture( image );

texture.wrapS = THREE.ClampToEdgeWrapping;
texture.wrapT = THREE.ClampToEdgeWrapping;
texture.repeat.set( 0.1, 0.1 );

var material = new THREE.MeshBasicMaterial( {map: texture} );
var mesh = new THREE.Mesh( geometry, material ) ;

scene.add( mesh );

非常感谢您的帮助！ 干杯!

编辑：

我创建此图像是为了更好地说明问题。 白色箭头显示纹理应如何环绕对象。 实际上在某些非常罕见的地方！

Answer 1

看看这个例子https://threejs.org/examples/?q=geome#webgl_geometry_shapes

在第70行，有一条注释指出必须将texture.repeat设置为（0.008，0.008）