TorqueX 2D Tilemap artifacts
by Ron Barbosa · in Torque X 2D · 11/16/2009 (9:19 am) · 24 replies
Hey all...I'm testing out TorqueX 2D for a new Indie Game project that I'm working on.
I have a tilemap texture that is 1600x704 pixels of 64x64 pixel tiles (25 tiles wide and 11 tall). There is no border or padding between tiles it's just 25x64 = 1600 wide and 11x64 = 704 tall.
When I load the material into the material builder it seems to work fine. I'm able to load the image and I can paint a tilemap using the material.
But when I play the level (or hide the grid in the editor) I can see artifacts between each tile. It looks like a 1-pixel strip from an adjacent tile. If I paint a patch of water using the ocean tiles, I see a thin green line above each tile that appears to be from an adjacent grass/forest tile.
The material image is a JPEG and the bleed almost looks a bit fuzzy...as if it might be the result of some anti-aliasing or something. I've looked all over the material builder for any options that would help clear the condition...but no love.
It just seems that this is pretty basic functionality...I don't know why this would be broken.
Could it have something to do with the odd aspect ratio/resolution of the image (1600x704)? Is there any constraint or recommendation that the image be square?
I thought maybe this could be something related to my graphics card/drivers, so I deployed a build to my Xbox 360 and saw the same artifacts.
One other strange note...when I do Help->About...it shows the TGB and TorqueX are both version 2.0.0.0. But the installer I used was clearly labeled 3.0.0.0. Is this just a bug in the About dialog?
Any help would be greatly appreciated. I'm really interested in using the tool, but this stumbling block hit me pretty early.
Thanks
--Ron
I have a tilemap texture that is 1600x704 pixels of 64x64 pixel tiles (25 tiles wide and 11 tall). There is no border or padding between tiles it's just 25x64 = 1600 wide and 11x64 = 704 tall.
When I load the material into the material builder it seems to work fine. I'm able to load the image and I can paint a tilemap using the material.
But when I play the level (or hide the grid in the editor) I can see artifacts between each tile. It looks like a 1-pixel strip from an adjacent tile. If I paint a patch of water using the ocean tiles, I see a thin green line above each tile that appears to be from an adjacent grass/forest tile.
The material image is a JPEG and the bleed almost looks a bit fuzzy...as if it might be the result of some anti-aliasing or something. I've looked all over the material builder for any options that would help clear the condition...but no love.
It just seems that this is pretty basic functionality...I don't know why this would be broken.
Could it have something to do with the odd aspect ratio/resolution of the image (1600x704)? Is there any constraint or recommendation that the image be square?
I thought maybe this could be something related to my graphics card/drivers, so I deployed a build to my Xbox 360 and saw the same artifacts.
One other strange note...when I do Help->About...it shows the TGB and TorqueX are both version 2.0.0.0. But the installer I used was clearly labeled 3.0.0.0. Is this just a bug in the About dialog?
Any help would be greatly appreciated. I'm really interested in using the tool, but this stumbling block hit me pretty early.
Thanks
--Ron
#22
03/14/2010 (1:00 am)
I was getting the white line in the builder and in the x86 version of the game very prominently. It was still there in the xbox version of the game as well but extremely hard to see. You had to know what you were looking for to find it in the xbox build but the fact that I knew it was there was bothering me.
#23
Duncan was kind enough to help me out with this problem early on in this thread. And his solution worked well. Then when I bought the source code, I modified the shader to eliminate the blurriness in the image...and that's when I noticed the pixel bleed again.
It seems to be a "pick your poison" situation. There doesn't seem to be a way to have a crisp image that is clear of this artifact without resorting to an individual one-tile-per-image solution.
--RB
03/14/2010 (6:27 am)
To Duncan and Henry's respective points, I did NOT see this problem with animations (except where my animations were in THE SAME sprite sheet as my tiles). However, this bleeding artifact is very prominent when using the builder to paint tile maps from a tile source that is a sprite sheet (man the sounds confusing when I read it).Duncan was kind enough to help me out with this problem early on in this thread. And his solution worked well. Then when I bought the source code, I modified the shader to eliminate the blurriness in the image...and that's when I noticed the pixel bleed again.
It seems to be a "pick your poison" situation. There doesn't seem to be a way to have a crisp image that is clear of this artifact without resorting to an individual one-tile-per-image solution.
--RB
#24
If you want to position art at fractional pixel locations then you will start to see sampling artifacts. In which case your approach might need to vary depending on what artifacts you are trying to minimize.
Two examples:
(1) modify your code or TX so that objects are *always* positioned on the nearest whole pixel location no matter what the Position property actually says.
(2) to get rid of the 'ghosting' outline artifact if you have a *black* outline around your sprite: the grey outline is likely because it is sampling black opaque pixels and also white transparent pixels - the combination being a semitransparent medium grey. To avoid this simply have your artist convert all the transparent areas of your sprites to transparent black instead of transparent white. The important point to remember is that when the shader samples from multiple pixels in your art it will always look at the rgb even if the pixel is transparent (alternatively you can modify the shader so that any pixel in your art with an alpha of zero is treated as if it was transparent black regardless of it's actual rgb components).
03/14/2010 (10:01 am)
Positioning your tiles/art precisely on whole pixels and fixing the shader gives the best results. If you do that and your art is displayed at it's native size then you won't get any bleed or any other artifacts.If you want to position art at fractional pixel locations then you will start to see sampling artifacts. In which case your approach might need to vary depending on what artifacts you are trying to minimize.
Two examples:
(1) modify your code or TX so that objects are *always* positioned on the nearest whole pixel location no matter what the Position property actually says.
(2) to get rid of the 'ghosting' outline artifact if you have a *black* outline around your sprite: the grey outline is likely because it is sampling black opaque pixels and also white transparent pixels - the combination being a semitransparent medium grey. To avoid this simply have your artist convert all the transparent areas of your sprites to transparent black instead of transparent white. The important point to remember is that when the shader samples from multiple pixels in your art it will always look at the rgb even if the pixel is transparent (alternatively you can modify the shader so that any pixel in your art with an alpha of zero is treated as if it was transparent black regardless of it's actual rgb components).
Torque 3D Owner Henry Shilling
Smokin Skull