How to render a texture only once on the material?

[Ertugrul_Cetin]

Hi all, I’m using shader chunks and having some problems. The goal is to reflect a texture based on the character’s position. I can’t stabilize the texture, either it repeats itself or I’m getting undesired behavior.

P.S.: I’m using both chunks.diffusePS and chunks.combinePS at the same time. (combinePS is for combineColor (dealing in here) - diffusePS is for terrain’s 3 textures)

I’ll provide the same shader with 2 different versions so you can understand the problem clearly.

Here is Shader Version #1;

uniform vec2 character_position;

 //scale = vec2(map_height, map_widht); 100x100
//my_cord = $UV;
vec3 combineColor() {
float dist = distance(character_position, vPositionW.xz);
float r = 0.1;
float shape = (smoothstep(r-0.1, r, dist)*0.75 + 0.25) - smoothstep(r, r + 0.1, dist);

vec4 texture = texture2DSRGB(texture_splat, my_cord * scale - vec2(0.5));
return  texture.rgb + dAlbedo;

// vec3 tt = mix(dAlbedo, texture.rgb, shape);
// return tt * dDiffuseLight;
}

I get this result with this shader (it repeats itself all over the material);

Here is my Shader Version #2;

uniform vec2 character_position;

 //scale = vec2(map_height, map_widht); 100x100
//my_cord = $UV;
vec3 combineColor() {
float dist = distance(character_position, vPositionW.xz);
float r = 0.1;
float shape = (smoothstep(r-0.1, r, dist)*0.75 + 0.25) - smoothstep(r, r + 0.1, dist);

vec4 texture = texture2DSRGB(texture_splat, my_cord * scale - vec2(0.5));

// NOW COMMENTING OUT THIS
//return  texture.rgb + dAlbedo;

// AND ENABLE THESE
vec3 tt = mix(dAlbedo, texture.rgb, shape);
return tt * dDiffuseLight;
}

And with this I get this result (Also I have the video here: Screen Recording 2022-11-17 at 13.01.40.mov - VEED);

[Leonidas]

Hi @Ertugrul_Cetin,

Not sure what’s wrong there, but if you are able to share a sample project I’d like to give that a try.

[mvaligursky]

I think you might want to set the addressU and addressV on the texture to pc. * ADDRESS_CLAMP_TO_EDGE

https://developer.playcanvas.com/api/pc.Texture.html#addressU

[Ertugrul_Cetin]

Here: PlayCanvas | HTML5 Game Engine
Basically texture should not repeat and move stable with the character

[Ertugrul_Cetin]

Thanks for the info, sadly I could not make it work. Here is the before image;

Could it be the height and width of the image? It’s 512x512

Here is the after image - after adding these lines;

this.material.chunks.combinePS = this.circleShader.resource ;
this.alphaTex.resource.addressU = pc.ADDRESS_CLAMP_TO_EDGE  ;
this.alphaTex.resource.addressV = pc.ADDRESS_CLAMP_TO_EDGE  ;

[Ertugrul_Cetin]

@mvaligursky @Leonidas I’m able to see the image at the corner of the map. Now I need to move the UVs of the texture I assume? (It will be moving with the character - in the circle - circle currently follow this character) Do you have any solutions for that?

Here is my current code;

// I'm using both chunks.diffusePS and chunks.combinePS at the same time
uniform vec2 character_position;

 // scale = vec2(map_height, map_widht); 100x100
// my_cord = $UV;
vec3 combineColor() {

    float dist = distance(character_position, vPositionW.xz);
    float r = 1.0;
    float shape = (smoothstep(r-0.1, r, dist)*0.75 + 0.25) - smoothstep(r, r + 0.1, dist);

    vec4 texture = texture2DSRGB(texture_splat, my_cord * vec2(50,50));

    vec3 tt = mix(dAlbedo, texture.rgb, shape / 0.5);
    return tt * dDiffuseLight;
}

[mvaligursky]

I’d suggest you to set up some minimal example of this, so somebody can investigate.

[Ertugrul_Cetin]

You’re right. Here is my example project: UV Problem Project

I’ve created a branch called UV PROBLEM. Also, the character has to go to the corner of the map - to be able to see the texture.

[Ertugrul_Cetin]

As the title says, I think this is resolved because I’m able to get the texture only once so this one is done IMHO. Thanks!