c++ 2D TileMap Render optimization - c++

Question

I have a question about 2D TileMap Optimization.
I rendered the Tilemap but the speed is too slow (Frame-rate == 50)
I think I can specify tiles to be rendered. So instead of rendering all tiles, just render tiles on Screen (Device).
This is my current method.
//Lower Layer
for(int y = 0; y < Height; ++y)
{
for(int x = 0; x < Width; ++x)
{
//if the tile index number is -1, then this is null tile (non drawing)
if( Layer1[y][x] != -1)
{
// this EPN_CheckCollision() Function is the AABB Collision Function.
// if there 2 Rect value's are collide , then return true.
if(EPN_CheckCollision( EPN_Rect(EPN_Pos(x*32, y*32)-CharacterPos) , EPN_Rect(0-32,0-32,1024+32,768+32) ) )
{
//EPN_Pos structure is consist of (float PosX , float PosY)
EPN_Pos TilePos = EPN_Pos(x * 32, y * 32)-CharacterPos;
//EPN_Rect structure is consist of below members
//float Top X
//float Top Y
//float BottomX (not Width)
//float BottomY (not Height)
EPN_Rect TileRect = EPN_Rect( Layer1[y][x] % 8 * 32, Layer1[y][x] / 8 * 32, Layer1[y][x] % 8 * 32 + 32, Layer1[y][x] / 8 * 32+32);
//Blt is Texture render function.
// 2nd Parameter is Render Pos and 3rd parameter is Render Texture's Rect.
pEPN_TI->Blt("MapTileset", TilePos, TileRect );
}
}
}
This is my TileMapRender Method.
( I use EPN Engine made by directX which is Unknown. So I annotated my code)
I rendered the tilemap that collides with the DeviceScreen ( 1024 * 768 , but for margin)
because I want to render visible tilemap on screen (I do not render tiles out of device screen).
So I Check the AABB Collision each tile and (1024, 768) device Screen, now I only render necessary tiles.
But I think this method has a problem, that it does not render out of screen tiles.
For statement also repeat all maptiles; what a inefficient method...
Maybe my games frame-rate problem is in this method. So may I ask STACK OVERFLOW how I could do this?
Is there another ways to optimize tilemap rendering?
Give me some tips please.
P.S
I'm sorry about my knotty question.
Please excuse my English ability.

Answer 1

You should only be rendering enough tiles to cover the screen, for example if your screen size is 640x480, and your tile size is 16x16 then:
Max tiles on X = (640/16)+2;
Max tiles on Y = (480/16)+2;
Notice how we add 2 for a margin on each side. Next thing we need to do is work out where we are in the tile map, for this we simply divide the camera x position by the tile width.
For example if the camera is at x=500 and y=20 then:
X tile index = 500/16
Y tile index = 20/16
You must also render your tile grid at an offset of 500%16 and 20%16 to account for the "sub tile pixel" scrolling.
For the collision its even easier, you only need to check collision with the tiles the player is on, so:
If the player size is 16x20 pixels and at position 120,200:
X tile index = 120/16
Y tile index = 200/16
Num X tiles to check = 16/16
Num Y tiles to check = 20/16
Hopefully this makes sense.