Question

我正在尝试通过应用不太频繁重复的凹凸贴图来分解纹理中的重复。不幸的是，它似乎采用了'landTexture'的重复值（64），而不是我设置为（1）的值。

landTexture.wrapS = landTexture.wrapT = THREE.RepeatWrapping;
landTexture.repeat.set(64, 64);
bumpTexture.wrapS = bumpTexture.wrapT = THREE.RepeatWrapping;
bumpTexture.repeat.set(1, 1);
var m = new THREE.MeshPhongMaterial({map:landTexture, 
                                     ambient: 0x552811, 
                                     specular: 0x333333, 
                                     shininess: 25, 
                                     bumpMap: bumpTexture, 
                                     bumpScale: 1, 
                                     metal: false });

如果我评论map:landTexture，那么凹凸贴图比例为1.我能以某种方式混合这两个重复值吗？

Answer 1

没有。偏移和重复值默认为其中之一：

// uv repeat and offset setting priorities
//  1. color map
//  2. specular map
//  3. displacement map
//  4. normal map
//  5. bump map
//  5. roughness map
//  5. metalness map
//  6. alpha map
//  7. emissive map

在您的情况下，这将是landTexture设置。

解决方法是修改纹理，或创建自定义ShaderMaterial。

编辑：例外是光照贴图和环境光遮挡贴图，每张贴图都使用第二组UV。这允许其他纹理比light / AO贴图具有更高的细节。

three.js r.84

Answer 2

是。在最近的版本中，three.js r90^有一个API，可用于通过GLSL更改内置材质的行为。

这并不容易，但已经做了一个例子：

https://github.com/pailhead/three.js/blob/aa72250835b82f7dde2e8375775a4b039cb719c6/examples/webgl_materials_extended_multiple_uvs.html

https://github.com/mrdoob/three.js/pull/14174

基本上，内置材质基于着色器模板，它只是#include <some_chunk>语句的有序列表。

其中一些“块”包含一些看起来像这样的代码

/*...*/ texture2D( foo, vUv ) /*...*/

其中foo为alphaMap，map，specularMap等。这意味着在内插的uv属性上对该采样器执行纹理查找。您并不关心此代码之前或之后的内容（它可能只是一个分号;或一些掩码.xy）。

所以你要做的是应用一些偏移量，或者三种方式做的方式，应用mat3变换。

GLSL因此需要看起来像这样

texture2D( foo, foo_transform * vUv )

然后问题就是为着色器提供这种制服。该示例通过首先编译着色器，然后搜索整个事物来执行一些暴力（否则您必须知道在哪个块中查找此纹理查找）。

这是一个比修改纹理更好的解决方案，实际上应该比编写自定义ShaderMaterial更简单。

免责声明 - 三个并不是真的意味着像这样使用但可以。因此，例如，虽然每个地图都以somethingMap为前缀，但反照率地图不是，而且它只是map，如果它是albedoMap，则此示例中的正则表达式会更简单。

一个three.js材质可以为凹凸贴图和纹理贴图分别设置重复值吗？

2 个答案: