Three.js如何将多个面上的纹理映射到弯曲的自定义几何体上

Question

我的目标是将矩形纹理映射到曲面上。我的自定义，挤压，形状，几何的弯曲部分由总共1800个面中的599个面（Face4）组成。我试图将纹理分割成这599个曲面。

图片1：我的自定义几何体的黑色面是我想要将纹理映射到

的弯曲部分

图片2：我正在尝试做的一个粗略的例子

图片3：每张脸都是一个垂直的立式矩形：faces [i] .color.setHex（Math.random（）* 0xffffff）;

尝试获取所选面部的UV坐标（每个面部由图像3演示），并旨在通过将纹理分割成这些曲面来映射我的纹理。这是我到目前为止所得到的：

var image = 'resources/customRectangle.png';
var texture = THREE.ImageUtils.loadTexture( image );
    texture.repeat.set(0.1, 0.1);                                           
    texture.wrapS = texture.wrapT = THREE.MirroredRepeatWrapping;;          

var settings = {
    amount: 14.5,
    steps : 1,
    bevelEnabled: false,
    curveSegments: 300,
    material: 0,
    extrudeMaterial: 1
    };

 var shape = new THREE.Shape();
     shape.moveTo( 90, 120 );
     shape.absarc( -30, -30, 200, 0, Math.PI * 0.27, false );
     shape.moveTo( 160, -40 );
     shape.moveTo( 90, 120 );
 var geometry = new THREE.ExtrudeGeometry( shape, settings );       

     geometry.computeBoundingBox();
 var max = geometry.boundingBox.max;
 var min = geometry.boundingBox.min;
 var offset = new THREE.Vector2(0 - min.x, 0 - min.y);
 var range = new THREE.Vector2(max.x - min.x, max.y - min.y);
 var faces = geometry.faces;
     geometry.faceVertexUvs[0] = [];


 for ( var i = 0; i < faces.length; i ++ ) {

 var face4 = faces[i].d;

 if( face4 > 0 && i < 1800 && i > 1200  ) {   // Selects curved faces   

    faces[ i ].color.setHex( 0x555555 );

var v1 = geometry.vertices[faces[i].a];
var v2 = geometry.vertices[faces[i].b];
var v3 = geometry.vertices[faces[i].c];

    geometry.faceVertexUvs[0].push([

new THREE.Vector2((v1.x + offset.x)/range.x,(v1.y + offset.y)/range.y),
new THREE.Vector2((v2.x + offset.x)/range.x,(v2.y +offset.y)/range.y),
new THREE.Vector2((v3.x + offset.x)/range.x ,(v3.y + offset.y)/range.y)

     ]);
   };
 };

    geometry.uvsNeedUpdate = true;  

var material = new THREE.MeshLambertMaterial( { map: texture } );
var mesh = new THREE.Mesh( geometry, material );
    mesh.position.x = x - 46;
    mesh.position.y = y;
    mesh.position.z = z + 20;   
    mesh.rotation.set( 1.5, 0.045, 0.59);
    object3D.add(mesh);     `

这是我第一次使用UV坐标，所以我不确定我是否正确创建它们，以及不知道如何使用UV坐标在多个面上映射纹理。无论如何将纹理分成多个分区？ （如图3所示）。制定像图像2的结果？

我被困在这一段时间，深入搜索互联网并不得不诉诸专业协助。我非常感谢提前帮助！亲切的问候，莱昂。