ThreeJS - 缩小纹理的尺寸（不重复 - 使用 UV-Coords）

ThreeJS - Scale texture's size down (no repeat - using UV-Coords)

你好，我是 ThreeJS 和纹理映射的新手，

假设我有一个大小为 (1000x1000x1) 的 3D 平面。当我对其应用纹理时，它会重复或缩放，至少填满整个平面。

我尝试实现的是，在运行时更改平面上图片的缩放比例。我希望图像变小并停止适合整个平面。

我知道有一种方法可以把每个人脸映射到图片的一部分，但是有没有办法把它映射到图片中的负数，这样就透明了？

我的问题是：

我在 Blender 中对模型进行了 UV 映射，并将其与 UV 坐标一起导入到我的 ThreeJS 代码中。现在我需要缩小纹理，如前所述。我是否必须重新映射 UV 线或我是否必须操纵图像并添加透明边缘？

另外，我可以用同样的方法移动图片上的图像吗？

我已经在 java3d 中通过操作 bufferedImages 并将它们绘制到透明图像上实现了这种用法。我不确定使用 javascript 是否可行，所以我想知道是否可以通过纹理映射实现。

感谢您的宝贵时间和建议！

这可以通过将 3d 平面映射到绘制图像的 canvas 来完成（fabric.js 可用于 canvas 绘图）。简而言之，设置 canvas 作为 3d 模型的纹理

yourmodel.material.map = document.getElementById("yourCanvas");

希望对您有所帮助:)

是的。在三中，纹理对象上有一些控件..

texture.repeat 和 texture.offset .. 它们都是 Vector2()s.

要重复纹理两次，您可以执行 texture.repeat.set(2,2);

现在，如果您只想缩放而不是重复，还有 "wrapping mode" 纹理。

texture.wrapS（U轴）和texture.wrapT（V轴），这些可以设置为：

texture.wrapS = texture.wrapT = THREE.ClampToEdgeWrapping;

这将使纹理的边缘像素在采样时无限延伸，因此您可以将单个小纹理放置在 uv 映射对象表面的任何位置。

在这两个选项（包括texture.rotation）之间你可以position/repeat一个非常灵活的纹理。

如果你需要更复杂的东西..比如扭曲纹理或改变它的颜色，你可能想改变你的建模器中的 UV，或者将你的纹理图像绘制成 canvas，修改 canvas，并使用 canvas 作为纹理图像，如 ArUns 答案中所述。然后你也可以在运行时修改它。