Texture artifacts

[Logon]

Hi,

I’ve got a trouble with textures.

This is a “2D” test where ground is made of several chunks.
Each chunk is a customized plane.
…etc

Each square of a plane has its own textures Uvs.

But there are ugly visual artifacts (lines) where rendering in maximized view or when running a built or when changing the resolution =>

It uses a 32*64 texture atlas, 16 bits, point filter.

Mesh code =>

void Start () {
		
		chunk_height=STATICS.chunk_size;
		chunk_width=STATICS.chunk_size;
		
		
		meshRenderer = gameObject.GetComponent<MeshRenderer>();
 
		meshFilter = gameObject.GetComponent<MeshFilter>();
		mesh = new Mesh ();
		meshFilter.mesh = mesh;
		
		
		
		Vector3[] vertices = new Vector3[chunk_height*chunk_width*4];		
		int index = 0;
		for(int x = 0; x < chunk_width; x++) {			
			for(int y = 0; y < chunk_height; y++) {				
				vertices[index]=new Vector3(0+x,0+y,0); index++;
				vertices[index]=new Vector3(1+x,0+y,0); index++;
				vertices[index]=new Vector3(1+x,1+y,0); index++;
				vertices[index]=new Vector3(0+x,1+y,0); index++;				 
			}			
		}
		
		mesh.vertices=vertices;
		
		
		int faces = chunk_height*chunk_width;

		List<int> triangles = new List<int>();		
		for (int i = 0; i < faces; i++) {
			int triangleOffset = i*4;
			triangles.Add(0+triangleOffset);
			triangles.Add(2+triangleOffset);
			triangles.Add(1+triangleOffset);

			triangles.Add(0+triangleOffset);
			triangles.Add(3+triangleOffset);
			triangles.Add(2+triangleOffset);

			
			
			
		}		
		mesh.triangles = triangles.ToArray();
		
		setUvs();
		
		mesh.RecalculateNormals(); 
		mesh.RecalculateBounds (); 
		mesh.Optimize();
		
}




Vector2 texturesCoords=new Vector2(0,0);
public Vector2[,] chunk_data_Textures;
	
public void setUvs(){
		int faces = chunk_height*chunk_width;
			
		List<Vector2> uvs = new List<Vector2>();
		Texture texture        = meshRenderer.sharedMaterial.mainTexture;
		Vector2 m_textureOffset=	 meshRenderer.sharedMaterial.mainTextureOffset;
			
		//right now textures are 8 * 8 px
		Vector2 pixelDims    = new Vector2(8f / (float)texture.width, -(8f  / (float)texture.height));
		
			
		for (int i = 0; i < faces; i++) {
	 		
			
                        // getting textures coords
			if(chunk_data_Textures!=null){
				int x_RELATIVE_00_CORNER=Mathf.FloorToInt(i/STATICS.chunk_size);
				int y_RELATIVE_00_CORNER=i-(x_RELATIVE_00_CORNER*STATICS.chunk_size);
				texturesCoords = chunk_data_Textures[x_RELATIVE_00_CORNER,y_RELATIVE_00_CORNER];
			}
			
			
			
			Vector2 pixelMin    = new Vector2(texturesCoords.x / (float)texture.width,
                        1.0f - (texturesCoords.y / (float)texture.height));

			
			Vector2 min = pixelMin + m_textureOffset;

			uvs.Add(min + new Vector2(pixelDims.x * 0.0f, pixelDims.y * 1.0f));	
			uvs.Add(min + new Vector2(pixelDims.x * 1.0f, pixelDims.y * 1.0f));
			uvs.Add(min + new Vector2(pixelDims.x * 0.0f, pixelDims.y * 0.0f));
			uvs.Add(min + new Vector2(pixelDims.x * 1.0f, pixelDims.y * 0.0f));
			
		}							
		mesh.uv = uvs.ToArray();
	 
	
}

[system]

Set your import setting to Advanced and unchek Generat MipMaps. Dont know if it helps but worth a try

[PolyMad]

@system

Set your import setting to Advanced and unchek Generat MipMaps. Dont know if it helps but worth a try

It is not a problem of textures but a problem of geometry precision.
His problem do not arise from texture resolution or compression or anything, but from " ground is made of several chunks".

Try to increase the size of your chunks by 0.01 units, I think it will solve your problem.

[Logon]

@OutCyder

It is not a problem of textures but a problem of geometry precision.
His problem do not arise from texture resolution or compression or anything, but from " ground is made of several chunks".

Try to increase the size of your chunks by 0.01 units, I think it will solve your problem.

It seems to work, but not totally…
i’ve first tried by setting the scale to 2 instead of 1 but the lines were still here.
Then i scaled the planes to 1.01 and now there are much less lines appearing but there are still some.
Weird isn’t it ?
It looks better at scale 1.001 but still not perfect.

PS: i’ve also set the texture atlas to Advanced and unchek Generate MipMaps. No success.

[PolyMad]

The problem with your approach is with the camera resolution in rendering, which is not infinite.

You would probably cut off a lot of this problem by setting antialiasing on, but of course that’s not the right solution on this type of game.

Try dimensions 1.1, that would definitely fix the problem at a distance, but the risk is when zoomed in you could see some Z buffer fighting.

By the way, I think you are right in that there is also some texturing problem.
It’s not a compression or quality problem thought, but a UV mapping problem.

I think you could solve this totally by moving the vertexes of the squares in the UV mapping INSIDE the coloured squares, NOT at the tip of them.
This because the MIPMAPS lower the resolution of the texture when you zoom out, causing bleeding of adjacent colours.

You may try a very fast thing: set the texture type to ADVANCED and disable the MIPMAPS generation!
This will leave the texture without low resolution versions, and force the graphic board to render it full resolution.
It cuts off a bit of performance but it should also cut off this problem completely.
And btw you can maybe reset the tiles to size 1

[Kragh]

It does indeed look like a texture problem, not a problem with the planes not lining up perfectly. As you can see, the lines will have the color of the, in the texture, neigbouring color. If it was a matter of aligning, all lines would be similar in colors.

So…it MUST be precision problems in the uv’s, where your individual planes will pick up color from a neighbour. Now, as far as I can see, this is always picked upwards in the texture, so, for instance, the brown square will always get a green line on top of it, a light yellow square will always get a light blue line above it. And it always happens in the y direction, not the x.
And as you use point filtering, it can’t be due to interpolation.

Anyways, the only thing I can come up with, are the fact that you are dividing by the texture width and texture height. But as you want the uv’s the be placed at the corners of each color, it may be a wrong way to do it. Try to imagine a picture only 44 pixels in size. And then count the corners of pixels. It will be a 55 texture now, in relation to corners. Just as the Terrain heightmap is 513*513 in size. And you don’t want to use the middle of the pixels. And the only reason this only shows in the y direction, could be due to the fact, that the y direction is taller, and therefore your rounding procedure will go just that one pixel wrong, where as the x direction, it doesn’t show up.

So try this:

Vector2 pixelMin    = new Vector2(texturesCoords.x / ((float)texture.width+1),

                        1.0f - (texturesCoords.y / ((float)texture.height+1)));

AND remember to put in ( ) as I did!. Or else you won’t be dividing by the width plus one, but by width, and then add one to the result…

[Logon]

i’m testing several possibilities:

right now it seems to work better with a different uvs order:

uvs.Add(min + new Vector2(pixelDims.x * 0.0f, pixelDims.y * 0.0f));
uvs.Add(min + new Vector2(pixelDims.x * 1.0f, pixelDims.y * 0.0f));
uvs.Add(min + new Vector2(pixelDims.x * 1.0f, pixelDims.y * 1.0f));
uvs.Add(min + new Vector2(pixelDims.x * 0.0f, pixelDims.y * 1.0f));

instead of

uvs.Add(min + new Vector2(pixelDims.x * 0.0f, pixelDims.y * 1.0f));
uvs.Add(min + new Vector2(pixelDims.x * 1.0f, pixelDims.y * 1.0f));
uvs.Add(min + new Vector2(pixelDims.x * 0.0f, pixelDims.y * 0.0f));
uvs.Add(min + new Vector2(pixelDims.x * 1.0f, pixelDims.y * 0.0f));

Vector2 pixelMin = new Vector2(texturesCoords.x / ((float)texture.width+1), 1.0f - (texturesCoords.y / ((float)texture.height+1)));

did not solved it.

Disabling MipMap

: no success

I think you could solve this totally by moving the vertexes of the squares in the UV mapping INSIDE the coloured squares, NOT at the tip of them.

How ?

I’ve made a test with a single texture (a colored cube) ==> no lines. So i think you’re right, it must be an uv problem. But if it’s the case i don’t understand why lines appear and disappear depending on zooming.

[Kragh]

What goes on here?

 Vector2 pixelDims    = new Vector2(8f / (float)texture.width, -(8f  / (float)texture.height));

Becuase the same problem would exist here, I presume. You need to look at the texture noth in terms of the number of pixels it has in width, but in the number of pixel corners it has.

So try:

 Vector2 pixelDims    = new Vector2(8f / (float)(texture.width+1), -(8f  / (float)(texture.height+1)));

Try both with both my solutions, and with only this. I don’t have the time to really read all your code, to understand what goes on, so this is just wild shots…

[Logon]

Changing the uv order seems to work by itself =
http://cryptmaster.free.fr/utest/WEBUNITYTEST.html

but…

when running a built using beautifull or fantastic quality i get this, a mosaic :

MipMap: disabled.
Scale testing : no effect on this mosaic.

no trouble in good or lesser quality.

Maybe this is a different problem ? (previously there were only horizontal lines)

but maybe it’s the same because there is no such mosaic in fantastic quality if i use a single one color texture =>

i wonder what would it be under android…

PS: Note that it cannot be a chunk connection problem, i may use any number of chunks of any size, for instance 33 chunks of 4949 square, it has no impact on the lines problem.

[PolyMad]

Try to rescale your texture to 128x256.
Such small textures are nonsense nowadays.

[PolyMad]

@Logon

Changing the uv order seems to work by itself =
http://cryptmaster.free.fr/utest/WEBUNITYTEST.html

but…

when running a built using beautifull or fantastic quality i get this, a mosaic :

MipMap: disabled.
Scale testing : no effect on this mosaic.

no trouble in good or lesser quality.

Maybe this is a different problem ? (previously there were only horizontal lines)

but maybe it’s the same because there is no such mosaic in fantastic quality if i use a single one color texture =>

i wonder what would it be under android…

PS: Note that it cannot be a chunk connection problem, i may use any number of chunks of any size, for instance 33 chunks of 4949 square, it has no impact on the lines problem.

I DO NOT HAVE that mosaic.
This last demo works perfectly for me.
Zoomed in and out all the way without any visual problem

So this can be due to your graphic board settings.
Check that you are not using some very low quality rendering on the Nvidia or ATI Control Panel.

[Logon]

@OutCyder

I DO NOT HAVE that mosaic.
This last demo works perfectly for me.
Zoomed in and out all the way without any visual problem

the bad news is that i did not change the quality setting of this web version (i guess it could be changed somewhere)

The mosaic appears when running a .exe built and using beautifull or fantastic quality ==>
http://cryptmaster.free.fr/utest/chunkstest.zip

@OutCyder

Try to rescale your texture to 128x256.
Such small textures are nonsense nowadays.

i will try this

[Giometric]

Instead of using a texture to color each of the squares, maybe you can try using vertex colors instead, with a simple shader that just flat-shades whatever the vertex color is. Then you don’t have to use any textures at all, and you can also use any color you want without having to add it to that atlas.

[Logon]

@Giometric

Instead of using a texture to color each of the squares, maybe you can try using vertex colors instead, with a simple shader that just flat-shades whatever the vertex color is. Then you don’t have to use any textures at all, and you can also use any color you want without having to add it to that atlas.

That’s an interesting idea.
Actually i plan to use a bit more detailed textures for the ground but there will be one time where i will have to learn how to write shaders because the next step will be to find a way to make some squares darker than others in order to build a FOV system.
It directly leads to an important parallel question ====> is it possible, using shaders, to darken such a plane square by square, while still using textures ?

[PolyMad]

Very very very easy: make another darker texture, create another material with this texture, and assign this material to the tiles you want to make darker.