Isometric tile engine- sprites

Ariesnl

Hi everyone,
What is the best (or a good) way to implement the sprites(characters) in a isometric tile engine. I want them to move smoothly from tile to tile over time, so it looks more natural. I did this once in a topview tileengine, but in a isometric tile engine things are different.
In my engine tiles can be stacked so there is a true height. and it's a staggered engine.. the map looks like a rectangle

I remember there was once a good Iso-engine tutorial on the web, but that link has gone broken since a long time. ( a lot of info about tile engines seems to have disapeared.

Before I'm gonna implement sprites I would like to see several techniques and tutorials.

any directions ?

Audric

Ariesnl said:

that link has gone broken

Have you tried archive.org ? I've found it pretty powerful to recover some tutorials.

GullRaDriel

Gamedev's programming articles

axonometric-projections-a-technical-overview
a-pathfinding-for-beginners
mouse-maps-for-isometric-height-maps
tilemap-based-game-techniques-base-data-structure
Isometric tiling
razorblades-isometric-dynamic-lighting-alg
introduction-to-isometric-engines
screen-to-map-coordinates
tileset-file-format
object-selection
map-file-format
isometric-tiles
isometric-source-code
isometric-tricks

Pfuuu, my search Fu give up.

Neil Walker

Full Allegro source code is here, along with some graphics and a couple of demos. Extract what you might need. It also include the fix for the overlapping blocks I mentioned earlier:

http://retrospec.sgn.net/users/ignacio/downloads/Isomot_v1.zip

only drawback is the variable names/'private' functions are in Spanish.

Audric

The docs for Isomot are also online.
Another limitation is the non-commercial license, so no part of code can be used in GPL context.

Neil Walker

I doubt he'd hold anyone to the 'non-commercial' bit, he probably just stuck it in there. But I only posted the code in case he wanted to look for the bit on moving around the grid. But I think he's using a different system anyway. Isomot uses a diamond and I think I read the OP was using staggered not diamond.

In that case, the simple maths is explained at www.tilemap.co.uk, if you download the code.

Ariesnl

Yes I'm using a staggered tilermap.
Right now I'm trying to figure out how to convert screen coords to tilemap coords..
I saw some code but it's not documented well. I want to understand how it works so I can port it to my own engine. I know it has something to do with gettingn the square tiles and cheching wether the mouse is inside the "ground" diamond or outside and at wich side...

any tips are most welcome

Neil Walker

If you visit here,
http://tilemap.co.uk/mappy.php

download the library you are familiar with and all the staggered isometric code is in there.

A quick snippet from the document:

Quote:

Moving anywhere on a staggered row isometric map
This is more complex to understand than a rotated map, but you can use a function like this to make it as easy (and pretty much the same) as using a rotated style map, just copy and paste into your source:

void IsoMove (int ew, int ns, int * x, int * y)
// ew = negative is west movement, positive is east
// ns = negative is north movement, positive is south
// x and y are coords to modify
{
int a = ew-ns;
if (a>0) a++;
y[0] += ew+ns;
x[0] += a/2;
if ((y[0]&1) && ((ew+ns)&1)) x[0]--;
}

So, I can use this bit of example code to move 4 squares northward (as in the direction shown in the comparison diagram above) and 3 squares east:

int myx = 7; //start at block at 7, 7
int myy = 7;
IsoMove (3, -4, &myx, &myy); // negative values are north or west, positive south or east

GullRaDriel

Ariesln, all I can do is posting the code I use for ScreenToMap. I use a staggered map in my iso engine too.

#SelectExpand
   1/*!\fn ScreenToMap( int mx, int my, int *Tilex,int *Tiley,BITMAP *mousemap)
   2 *
   3 *\brief Convert screen coordinate to map coordinate
   4 *
   5 *\param mx The 'x' coordinate in pixel
   6 *\param my The 'y' coordinate in pixel
   7 *\param Tilex Output for the generated Tilex
   8 *\param Tiley Output for the generated Tiley
   9 *\param mousemap A mousemap with colors for one tile
  10 *
  11 *\return TRUE
  12 */
  13
  14int ScreenToMap( int mx, int my, int *Tilex, int *Tiley, BITMAP *mousemap )
  15    {
  16
  17    /* SCREEN TO MAP VARIABLES */
  18    int RegionX, RegionY,
  19    RegionDX = 0, RegionDY = 0,
  20                             MouseMapX, MouseMapY,
  21                             MouseMapWidth, MouseMapHeight, c;
  22
  23    MouseMapWidth = mousemap -> w;
  24    MouseMapHeight = mousemap -> h;
  25
  26    /* First step find out where we are on the mousemap */
  27    RegionX = ( mx / MouseMapWidth );
  28    RegionY = ( my / MouseMapHeight ) << 1; /* The multiplying by two is very important */
  29
  30
  31    /* Second Step: Find out WHERE in the mousemap our mouse is, by finding MouseMapX and MouseMapY. */
  32
  33    MouseMapX = mx % MouseMapWidth;
  34    MouseMapY = my % MouseMapHeight;
  35
  36    /* third step: Find the color in the mouse map */
  37    c = getpixel( mousemap, MouseMapX, MouseMapY );
  38
  39    if ( c == makecol( 255, 0, 0 ) ) {
  40            RegionDX = -1;
  41            RegionDY = -1;
  42            }
  43
  44    if ( c == makecol( 255, 255, 0 ) ) {
  45            RegionDX = 0;
  46            RegionDY = -1;
  47            }
  48
  49    if ( c == makecol( 255, 255, 255 ) ) {
  50            RegionDX = 0;
  51            RegionDY = 0;
  52            }
  53
  54    if ( c == makecol( 0, 255, 0 ) ) {
  55            RegionDX = -1;
  56            RegionDY = 1;
  57            }
  58
  59    if ( c == makecol( 0, 0, 255 ) ) {
  60            RegionDX = 0;
  61            RegionDY = 1;
  62            }
  63
  64    *Tilex = ( RegionDX + RegionX );
  65    *Tiley = ( RegionDY + RegionY );
  66
  67
  68    return TRUE;
  69
  70    } /* ScreenToMap( ... ) */
  71
  72
  73
  74/*!\fn camera_to_scr( MAP **map , int x , int y )
  75 *
  76 *\brief Center Map on given screen coordinate
  77 *
  78 *\param map A MAP *map to center on x,y
  79 *\param x the X coordinate (in pixel) to center on;
  80 *\param y the Y coordintae (in pixel) to center on;
  81 *
  82 *\return TRUE
  83 */
  84
  85int camera_to_scr( MAP **map , int x , int y )
  86    {
  87    if ( x < 0 )
  88        x = 0;
  89
  90    if ( y < 0 )
  91        y = 0;
  92
  93    ( *map ) -> X = x % ( *map ) ->TILEW;
  94
  95    ( *map ) -> Y = y % ( *map ) ->TILEH;
  96
  97    ( *map ) -> ptanchorY = y / ( ( *map ) ->TILEH >> 1 );
  98
  99    ( *map ) -> ptanchorY = ( *map ) -> ptanchorY >> 1;
 100
 101    ( *map ) -> ptanchorY = ( *map ) -> ptanchorY << 1;
 102
 103    ( *map ) -> ptanchorX = ( x + ( ( *map ) -> ptanchorY & 1 ) * ( ( *map ) ->TILEW >> 1 ) ) / ( *map ) ->TILEW;
 104
 105    return TRUE;
 106
 107    } /* camera_to_scr( ... )*/

The mousemap BITMAP is drawn like this:

/* drawing mousemap */
    line( ( *map ) -> mousemap , 0 , ( TILEH >> 1 ) - 2 , ( TILEW >> 1 ) - 3 , 0 , makecol( 255, 0, 0 ) );
    floodfill( ( *map ) -> mousemap , 1 , 1 , makecol( 255, 0, 0 ) );

    line( ( *map ) -> mousemap , ( TILEW >> 1 ) - 3 , TILEH - 1 , 0 , ( TILEH >> 1 ) + 1 , makecol( 0 , 255 , 0 ) );
    floodfill( ( *map ) -> mousemap , 1 , TILEH - 2 , makecol( 0, 255, 0 ) );

    line( ( *map ) -> mousemap , ( TILEW >> 1 ) + 2 , TILEH - 1 , TILEW - 1 , ( TILEH >> 1 ) + 1 , makecol( 0, 0, 255 ) );
    floodfill( ( *map ) -> mousemap , TILEW - 2 , TILEH - 1 , makecol( 0, 0, 255 ) );

    line( ( *map ) -> mousemap , ( TILEW >> 1 ) + 2 , 0 , TILEW - 1 , ( TILEH >> 1 ) - 2 , makecol( 255, 255 , 0 ) );
    floodfill( ( *map ) -> mousemap , TILEW - 1 , 0 , makecol( 255, 255, 0 ) );

Thread #608784. Printed from Allegro.cc