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）