Use vertical uv textures on BufferGeometry

Questions
1

You see vertical uv textures on buffer geometry sides are applied as horizontal image
What correct way to direct it vertically?

That using this uv

 const uvs = new Float32Array([
    0, 0,  // Bottom-left vertex maps to (0,0) in texture
    1, 0,  // Bottom-right → (1,0)
    1, 1,  // Top-right → (1,1)
    0, 1,   // Top-left → (0,1)
  ])

2

Maybe you need for triplanar mapping:

vs["terrain_triplanar"]=`


varying vec2 noise_uv_y;
varying vec3 vNormal;
varying vec3 vPosition;


void main(){


vPosition=position;
vNormal=normal;
vec4 mvPosition=modelViewMatrix*vec4(vPosition,1.0);
gl_Position=projectionMatrix*mvPosition;


}


`;


fs["terrain_triplanar"]=`


uniform sampler2D map;
uniform sampler2D dirt;
varying vec3 vNormal;
varying vec3 vPosition;


vec3 triplanar(vec3 normal,float smooth_1,float smooth_2){
vec3 blend_weights=normal*normal;
float max_blend=max(blend_weights.x,max(blend_weights.y,blend_weights.z));
blend_weights=max(blend_weights-max_blend*smooth_1,0.0);
blend_weights.y*=smooth_2;
float rcp_blend=1.0/(blend_weights.x+blend_weights.y+blend_weights.z);
return blend_weights*rcp_blend;
}


void main(){


vec2 map_uv_x=vPosition.zy*0.4;
vec2 map_uv_y=vPosition.xz*0.4;
vec2 map_uv_z=vPosition.xy*0.4;
vec3 weights=triplanar(vNormal,0.25,1.0);
vec3 color=weights.x*texture2D(dirt,map_uv_x).rgb+weights.y*texture2D(map,map_uv_y).rgb+weights.z*texture2D(dirt,map_uv_z).rgb;
gl_FragColor=vec4(color,1.0);


}


`;

image
image1920×1080 227 KB

2 Likes
3

@Chaser_Code
gold texture applied correctly
what about wall texture? why it uses gold texture, it defined separately with different texture
and you see bug of disappearing texture

4

Maybe normal value not correct. Try mesh.geometry.computeVertexNormals();

1 Like
5

thx!

meanwhile there is disappearing effect of wall material
when camera moved to distance near to wall tile, for tiles in center
i reverted to original THREE.MeshStandardMaterial

1 Like