Tiled background glitch

Bugs will be moved here once resolved.

Post » Wed Apr 18, 2012 11:28 am

I don't know if this could be related to R87, because I installed it before noticing this. Also didn't find any similar bugs in the recent posts, so here it goes:

I made a Tiled Background and I noticed that, if rotated or zoomed in, a small (probably less than a pixel) part of the next tile will bleed in, creating a glitch.




(the horizontal line is there because of the lower tiled bg)

A few more information:
- Setting the sampling to POINT will remove the problem.
- Pixel rounding won't solve it.
- The tile width & height is 128.
B
107
S
40
G
10
Posts: 456
Reputation: 13,202

Post » Wed Apr 18, 2012 2:03 pm

The diagonal seam is a tell-tale. That looks more like a driver bug than any sampling or tiling issue. Do you have up to date drivers? Is it the same on all browsers?Ashley2012-04-18 14:04:22
Scirra Founder
B
359
S
214
G
72
Posts: 22,949
Reputation: 178,574

Post » Wed Apr 18, 2012 2:33 pm

I've always had this problem as well for some reason and have been unable to fix it by setting it to point/pixel rounding on.

I just changed each of the backgrounds it affected by adding a couple of transparent rows of pixels at the botttom/top which works pretty well.
B
22
S
6
G
10
Posts: 118
Reputation: 8,005

Post » Wed Apr 18, 2012 2:36 pm

Hi Ashley

I'm not sure I understand the concept of "tell-tale"

Yes, it's happening on all browsers, also tested on PC & Macs, updated drivers on all of them.

I'll send you the link to the exported project on a PM (supa-secret stuff going on here!)
B
107
S
40
G
10
Posts: 456
Reputation: 13,202

Post » Wed Apr 18, 2012 2:38 pm

@Haematite
Yeah I'm using this workaround, I've added a transparent pixel on the left.
B
107
S
40
G
10
Posts: 456
Reputation: 13,202

Post » Wed Apr 18, 2012 6:55 pm

Sorry, by "tell-tale" I mean a giveaway, as in the diagonal line indicates a driver bug. Seams along the edges of the tiles are one thing, but diagonal lines inside a tile usually means the graphics driver is old and crappy and can't draw a 2D image without screwing up the contents :P (I don't see any diagonal lines on my machine)

Lines along the edges of tiles are a different issue though. I'm not sure why they are there. Is WebGL on? Is it any different with WebGL off?
Scirra Founder
B
359
S
214
G
72
Posts: 22,949
Reputation: 178,574

Post » Thu Apr 19, 2012 2:35 am

Hi Ashley

I tested with the WebGL off - the lines move a bit diferent, more precise, but they're still there. The only way to remove them is to add the point sampling. Drivers are totally up to date on my pc, just installed the catalyst this morning. I don't know about the mac tho.

However, my workaround for now was to make the tiled bg 127px wide. Since it's a gradient, and the tiling is one-dimension only, the last pixel would not impact on the visuals.
B
107
S
40
G
10
Posts: 456
Reputation: 13,202

Post » Thu Apr 19, 2012 9:19 am

I'm also having a similar problem and was just searching the forums for a solution. Here's what I'm seeing.

tiled_background_glitch.capxThunder2012-04-19 09:20:52
B
5
S
2
G
5
Posts: 26
Reputation: 2,987

Post » Thu Apr 19, 2012 11:04 am

It might be a browser bug - it should certainly be possible to tile power-of-two textures seamlessly at any zoom level. I'll take a look and see if it's a browser issue.

For now the only way to guarantee seamless rendering is to turn WebGL on and set sampling to Point. It seems to be an issue with linear sampling only.
Scirra Founder
B
359
S
214
G
72
Posts: 22,949
Reputation: 178,574

Post » Thu Apr 19, 2012 4:54 pm

yeah I noticed this too in my first project. I found out the only way to get rid of it was point sampling or adding transparent pixels like mentioned above. That was in r85
B
13
S
5
G
2
Posts: 306
Reputation: 3,262

Next

Return to Closed bugs

Who is online

Users browsing this forum: No registered users and 3 guests