three.js - Three.js 纹理看起来从右侧剪裁

Question

我在另一个网格的顶部有一个网格，如下所示（顶部网格区域是暗的）

如果我添加这样的纹理图像；

var logoTexture = THREE.ImageUtils.loadTexture( logoPath );
mesh.material = new THREE.MeshBasicMaterial( { map:logoTexture } );

图像看起来已损坏（从右侧剪切）

原始图像看起来像；

我不知道是什么导致了这个问题，图像也是 512x512 像素。

Answer 1

也许您的纹理纵横比与几何形状不匹配。您可以调整几何尺寸和/或使用纹理定位和拉伸，如下所示：

var map = logoTexture;

map.wrapS = THREE.RepeatWrapping;
map.wrapT = THREE.RepeatWrapping;

map.offset.x = 0; // adjust as needed to move horizontally
map.offset.y = 0; // adjust as needed to move vertically

map.repeat.x = 1; // adjust as needed to stretch horizontally
map.repeat.y = 1; // adjust as needed to stretch vertically