是否可以在各种尺寸的物体上使用纹理材料？

Question

[与Three.js r113一起使用，我正在根据蓝图的坐标动态创建墙作为自定义几何。我已经成功设置了vertices, faces and faceVertexUvs。现在，我想用带纹理的材料包裹这些几何形状，以重复该纹理并保持原始长宽比。由于墙壁的长度不同，我想知道哪种方法是最好的方法？

到目前为止，我尝试过的加载一次纹理，然后使用不同的texture.repeat值，具体取决于墙的长度：

let textures = function() {
  let wall_brick = new THREE.TextureLoader().load('../textures/light_brick.jpg');
  return {wall_brick};
}();

function makeTextureMaterial(texture, length, height) { 
  const scale = 2;
  texture.wrapS = THREE.RepeatWrapping;
  texture.wrapT = THREE.RepeatWrapping;
  texture.repeat.set( length * scale, height * scale );
  return new THREE.MeshStandardMaterial({map: texture});
}

然后，在创建几何图形并将返回的材质分配给材质数组后，将其应用于每个墙的正面和背面，然后调用上述函数。注意：material.wall是其他面的不带纹理的MeshStandardMaterial。

let scaledMaterial = [
  makeTextureMaterial(textures.wall_brick, this.length.back, this.height),
  makeTextureMaterial(textures.wall_brick, this.length.front, this.height),
  material.wall
];

this.geometry.faces[0].materialIndex = 0; // back
this.geometry.faces[1].materialIndex = 0; // back
this.geometry.faces[2].materialIndex = 1; // front
this.geometry.faces[3].materialIndex = 1; // front
this.geometry.faces[4].materialIndex = 2;
this.geometry.faces[5].materialIndex = 2;
this.geometry.faces[6].materialIndex = 2;
this.geometry.faces[7].materialIndex = 2;
this.geometry.faces[8].materialIndex = 2;
this.geometry.faces[9].materialIndex = 2;
this.geometry.faces[10].materialIndex = 2;
this.geometry.faces[11].materialIndex = 2; // will do those with a loop later on :)

this.mesh = new THREE.Mesh(this.geometry, scaledMaterial);

发生的情况是纹理显示在所需的面上，但没有按this.length.back和this.length.front单独缩放

任何想法如何做到这一点？谢谢。

Answer 1

我刚刚找到了正确的方法。个别缩放是通过faceVertexUvs完成的，正如West Langley在这里回答：https://stackoverflow.com/a/27098476/4355114