# Tiled tmx format into 3d Texture

I am thinking of making 3d games with 2d pixels feel. So far, i have been playing around in tiled and monogames. I learned some xml and managed to import and render tmx into my game. This is maybe a dumb question. How do you convert tmx into 3d texture? What kind of software do you need?

• Do you want to do this manually or at runtime? – Philipp Dec 12 '18 at 10:37
• Can you describe what you have in mind for this 3D texture? What mapping do you envision from the 2D source to the 3D output? Can you give us a concrete/visual example? – DMGregory Dec 12 '18 at 11:43

You can create a mesh programmatically that corresponds to a tmx tilemap. A tilemap consists out of two things: the tilemap and the texture.

I know the TMX format is not immediate in X,Y coordinates, but since you already experimented with the format, I assume for the same of simplicity that you can convert a tile index to the corresponding X,Y coordinate.

In Monogame you can use an array of VertexPositionTexture to accomplis this.

To generate the 3D mesh is basically quads like this:

+---+---+---+
|\  |\  |\  |
| \ | \ | \ |
|  \|  \|  \|
+---+---+---+
|\  |\  |\  |
| \ | \ | \ |
|  \|  \|  \|
+---+---+---+
|\  |\  |\  |
| \ | \ | \ |
|  \|  \|  \|
+---+---+---+


The vertices are the tile coordinates these are calculated by the tilemap location (repeat for each quad- keep the Z coordinate at 0):

(tile.x, tile.y) —--- (tile.x+1,tile.y)
|                         |
|                         |
(tile.x, tile.y+1) --- (tile.x+1,tile.y+1)


Now comes the tricky part: the textures. The tiles in the texture is basically one spriteatlas. The coordinate for a spriteatlas tile should be divided by the width and height of the image. The reason is that the textures coordinates in the GPU range from 0,0 to 1,1. So if the dimension of the image is 640x480, and each tile is 16x16, the tile at on the GPU is 16/640 = 0.025 wide and 0.0333 high. Thus the spriteatlas tile at (x,y) would be:

(x*0.025, y *0.033) ------ ((x+1)*0.025,y*0.033)
|                      |
|                      |
(x*0.025, (y+1)*0.033) --- ((x+1)*0.025,(y+1)*0.033)


combine the mesh above with the texture coordinates for each vertex out of the texture atlas from the TMX xls and you have the map as a 3D mesh.

With this knowledge, you can convert objects in the TMX file to replace them with 3D models- or even generate 3D models are specific 'Tiled' terrains. Combine this further with heightmaps, or flowmaps and convert the Tiled coordinates as a basis for all kinds of objects.