Jump to content
  • Advertisement
Sign in to follow this  
Borax Kid

[C++] How to implement a 16/9 map ?

This topic is 1433 days old which is more than the 365 day threshold we allow for new replies. Please post a new topic.

If you intended to correct an error in the post then please contact us.

Recommended Posts

Hello.

 

I made a little game some time ago (a 2d shooter, like a Worms game but in real time, for a school project), and now I want to make another game, but this time, isometric.

I don't know where to begin with the isometric thing. The "problem" is that I have no idea how to make a 16/9 ratio isometric map, all the games and tuts about isometric I see use just a diamond shape, and not a rectangular one. How could I implement this in a simple way ? (Or complex way if there isn't any simple !)

 

PS: For my first game, I used the SFML graphics engine, and made pixel art sprites, but I want to try vectors graphics, do you know how can I do it with SFML ? Else which engine would you recommend me ?

 

Thanks for your time!

Hope you can help me here.

 

(English isn't my native language, I'm sorry if I made some mistakes, I tried to write the best as possible.)

Share this post


Link to post
Share on other sites
Advertisement

Well, it is a big question, but I assume that you are having problem things such as how to draw the tile map.

 

Like any grid based game, you can store the tile data inside an array (data including for example which sprite to use). 

 

So, to draw a typical 2d square tile map you'd use a formula such as 

 
for(int y = 0; y < TILESY; ++y)
{
    for(int x = 0; x < TILESX; ++x)
    {
        DrawTile(sprite, x * TILESIZEX, y * TILESIZEY);
    }
}
 

To draw a orthographic map you'll just transform the positions a little bit

 

 

for(int y = 0; y < TILESY; ++y)
{
   for(int x = 0; x < TILESX; ++x)
   {
        float PositionX = x * HALFTILESIZEX - y * HALFTILESIZEX;
        float PositionY = y * HALFTILESIZEY + x * HALFTILESIZEY;
        DrawTile(sprite, PositionX, PositionY);
   }
}

 
 
I didn't test the code, but you'll get the idea - because the tile sprites are still rectangular - drawing them orthographically is just a question of offsetting them in some direction. You can make yourself a drawing on the paper with orthographical tiles, and then imagine them being just rectangular sprites so you'll see where the sprite corners are and finally see the relation of a grid and a orthographic grid. You can use any aspect ratio for the tiles are you wish - it doesn't really change the drawing code.

 

Hope this makes sense. 

 

Cheers!

Edited by kauna

Share this post


Link to post
Share on other sites

Thanks for replying.

 

I think you misunderstood what I wanted to do, or I didn't say it correctly.

What I want to get is this type of map :

db9e7d2d0d.png

 

But what I get is something like : (what I call a diamond shape)

a29845a35e.png

So with what I want, I can fill the entire screen, with the diamond shape, I'd have to make it larger then the windows and draw something that is out of the window (the camera will be fix, that's why I just want the necessary tiles, and no others out of the camera view).

I hope someone will have an answer for this!

Share this post


Link to post
Share on other sites

Well that's a question of rethinking the drawing algorithm if it is not acceptable that some tiles are out of the screen.

 

So again, let's start with a grid structure - drawing the first kind of map is even easier that the "diamond"

for(int y = 0; y < TILESY; ++y)
{
    for(int x = 0; x < TILESX; ++x)
    {
       float Odd_OffsetY = (x & 1) ? HALFTILESIZEY : 0.0f;

       DrawTile(sprite, x * HALFTILESIZEX, y * HALFTILESIZEY + Odd_OffsetY);
    }
}

Pratically what this code does is that even odd numbered tile is offset half a tile downwards. It should do the trick.

 

Cheers!

 

[edit] If you want exactly the output you are presented - you'll have to draw one less tile in Y direction for the odd columns.

Edited by kauna

Share this post


Link to post
Share on other sites

I think it's: x * FULL tile width (with (y * half height) + offset for odd rows), but I'm too lazy to verify. laugh.png 
 

For my first game, I used the SFML graphics engine, and made pixel art sprites, but I want to try vectors graphics, do you know how can I do it with SFML ?

 
SFML isn't an engine, it's an API (the definition of an 'engine' isn't really set in stone, but SFML isn't one). wink.png 
 
SFML also doesn't directly support 'vector art', though you can add it to SFML yourself - by using OpenGL directly to draw it, or by using OpenVG (which I've never tried before - not sure how well-supported that is).

OpenGL doesn't directly support vector graphics, but you could build vector support on top of it. There's an implementation of OpenVG built over OpenGL, so that'd likely work with SFML since SFML is also built over OpenGL.

You could also try getting Cairo to work with SFML, though you may run into performance issues - Cairo is software-based I think. It may work fine, depending on the complexity of your game, but I'd try something built over OpenGL to begin with.
 
You can (and should) still use SFML for creating your window, receiving input events (mouse presses, keypresses, etc...), and managing the OpenGL context for you. SFML is a great library. smile.png

 

Else which engine would you recommend me ?

I'd stick with SFML.

 

<opinion>

For 2D games, I don't recommend bespoke engines (engines made for a specific narrowly-defined genre of games) unless your game falls into a really specific category, because 2D games vary so much from each other that engines would be more likely to constrain freedom of design. 3D games are more complex (thus increasing the benefits of pre-built engines), and less varied (thus decreasing the detriments), so engines for 3D games make sense.

</opinion>

 

 

 

(English isn't my native language, I'm sorry if I made some mistakes, I tried to write the best as possible.)

 

Your english is fine (better than fine). As far as the general level of internet grammar and spelling goes, yours is definitely above-average, even for native speakers. I didn't realize you weren't a native speaker until you mentioned it. It's not perfect, but it's more than clear enough for communication, and above-average in quality internet-wise; though you'll still want to get a native speaker for actual published text - like your studio's website (when you get that far) and in-game dialog.

Edited by Servant of the Lord

Share this post


Link to post
Share on other sites

 x * FULL tile width

 

With respect I must say that I disagree - if you look at the images, the tile centers are half a tile apart (in x and y directions).

 

Cheers!

Edited by kauna

Share this post


Link to post
Share on other sites

SFML isn't an engine, it's an API (the definition of an 'engine' isn't really set in stone, but SFML isn't one).

 

Yeah that's what I was thinking, didn't use the good term though.

 

Again, thanks for the answers, but I managed to do it myself, the correct algorithm was : (edit: atleast one correct algorithm)

while (i < tile_x)
        {
            j = 0;
            while (j < tile_y)
            {
                if (j % 2 == 0)
                {
                    tmp.x = i * tile_width;
                    tmp.y = j * tile_height / 2;
                }
                else
                {
                    tmp.x = i * tile_width + tile_width / 2;
                    tmp.y = (j - 1) * tile_height / 2 + tile_height / 2;
                }
                sprite.setPosition(tmp);
                app.draw(sprite);
                ++j;
            }
            ++i;
        }

[edit] If you want exactly the output you are presented - you'll have to draw one less tile in Y direction for the odd columns.

No, no need for this, it'll be simpler to have all rows with the same width.

 

SFML also doesn't directly support 'vector art', though you can add it to SFML yourself - by using OpenGL directly to draw it, or by using OpenVG (which I've never tried before - not sure how well-supported that is).

OpenGL doesn't directly support vector graphics, but you could build vector support on top of it. There's an implementation of OpenVG built over OpenGL, so that'd likely work with SFML since SFML is also built over OpenGL.

You could also try getting Cairo to work with SFML, though you may run into performance issues - Cairo is software-based I think. It may work fine, depending on the complexity of your game, but I'd try something built over OpenGL to begin with.
 
You can (and should) still use SFML for creating your window, receiving input events (mouse presses, keypresses, etc...), and managing the OpenGL context for you. SFML is a great library. smile.png

Thanks for all the precisions, this'll be really helpful!

 

Your english is fine (better than fine). As far as the general level of internet grammar and spelling goes, yours is definitely above-average, even for native speakers. I didn't realize you weren't a native speaker until you mentioned it. It's not perfect, but it's more than clear enough for communication, and above-average in quality internet-wise;

Glad to hear it!

 

though you'll still want to get a native speaker for actual published text - like your studio's website (when you get that far) and in-game dialog.

Yes, but for now it's just a personnal project! I sure hope I can make it playable or sellable or something like that but for now it's just for fun.

 

 

<opinion>

For 2D games, I don't recommend bespoke engines (engines made for a specific narrowly-defined genre of games) unless your game falls into a really specific category, because 2D games vary so much from each other that engines would be more likely to constrain freedom of design. 3D games are more complex (thus increasing the benefits of pre-built engines), and less varied (thus decreasing the detriments), so engines for 3D games make sense.

</opinion>

Yes, I'm on your side with this, I don't want to use something that already made all the work for me, what's the fun in programming if you don't program?

 

Again, thank you everyone, GameDev.net really is a great community!

Edited by Borax Kid

Share this post


Link to post
Share on other sites

 

x * FULL tile width

 

With respect I must say that I disagree - if you look at the images, the tile centers are half a tile apart (in x and y directions).

 

Oops, didn't see you were staggering every other tile, I thought you were staggering every other row:

float Odd_OffsetY = (y & 1) ? HALFTILESIZEY : 0.0f; //Staggering on row (y & 1)...
DrawTile(sprite, x * FULLTILESIZEX, y * HALFTILESIZEY + Odd_OffsetY); //...requires full tile width.

My mistake! wacko.png

Share this post


Link to post
Share on other sites
Sign in to follow this  

  • Advertisement
×

Important Information

By using GameDev.net, you agree to our community Guidelines, Terms of Use, and Privacy Policy.

We are the game development community.

Whether you are an indie, hobbyist, AAA developer, or just trying to learn, GameDev.net is the place for you to learn, share, and connect with the games industry. Learn more About Us or sign up!

Sign me up!