用于挤压测量的自定义 UVgenerator Three.js

Question

我想在挤压几何体的表面使用纹理。我研究自定义 UV 生成器已经有一段时间了，并发现了这些相关问题： 1.)如何将纹理应用到 THREE.ExtrudeGeometry？ 2.)加载的纹理显得模糊，或者像单一颜色。如何让纹理变得酥脆锐利

但是，建议将我的几何点除以 1000 的方法不起作用，mesh.scale.set(1000,1000,1)因为我的几何不再位于正确的位置。我更愿意指定 UV 映射。一个答案说要根据源代码实现一个自定义 uvgenerator，但我被困住了并且不知道该怎么做。

这是我的几何体创建，材质为 512x512px，如何将纹理映射到顶部？：

pointList=[[0,0,0],
        [0,1000,0],
        [750,1000,0],
        [750,750,0],
        [1000,750,0],
        [1000,0,0]]

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

        point = pointList[i];

        x = point[0];
        y = point[1];

        myPoints.push( new THREE.Vector2 (x,y) );
    }

    myShape = new THREE.Shape( myPoints );
    extrusionSettings = {
        amount:height
    };

    myGeometry = new THREE.ExtrudeGeometry( myShape, extrusionSettings );
    resultshape = new THREE.Mesh( myGeometry, material );

Answer 1

您可以ExtrudeGeometry通过指定您自己的UVGenerator属性之一来为您指定自定义 UV extrusionSettings。

要指定自定义 UV 发生器，您可以使用模板THREE.ExtrudeGeometry.WorldUVGenerator，该模板可在 中找到src/extras/geometries/ExtrudeGeometry.js。

然而，有一个更简单的解决方案可能适合您。

您可以利用纹理的offset和属性，而不是使用自定义 UV 发生器。repeat使用以下模式：

texture.wrapS = texture.wrapT = THREE.RepeatWrapping;
texture.repeat.set( 1 / 500, 1 / 500 );
texture.offset.set( 0.1, 0.5 );

三.js r.68