Isometric Maps

16 views
Skip to first unread message

Erik Swedberg

unread,
May 3, 2001, 3:57:34 PM5/3/01
to
I'm planning to make an Isometric Map-based game.
Now, to do this, I need to know if the user clicked on one(or more)
squares, for examle, a building or a creature.
I cannot figure out how to do this.

Thanks for any help.

Erik

Gary Williams

unread,
May 3, 2001, 4:55:32 PM5/3/01
to
"Erik Swedberg" <herr_h...@yahoo.se> wrote in message
news:030520012057349324%herr_h...@yahoo.se...

> I'm planning to make an Isometric Map-based game.
> Now, to do this, I need to know if the user clicked on one(or more)
> squares, for examle, a building or a creature.
> I cannot figure out how to do this.

I've wanted to do something like this for a while, but never got around to
it until I saw your message.

Create a new project. On the form create a TImage and align it to client.
Paste this code into Unit1 and run. A 10x10 grid will be drawn. Click in
it to highlight a square.


unit Unit1;

interface

uses
Windows, Messages, SysUtils, Classes, Graphics, Controls, Forms, Dialogs,
ExtCtrls;

type
TForm1 = class(TForm)
Image1: TImage;
procedure FormCreate(Sender: TObject);
procedure Image1MouseDown(Sender: TObject; Button: TMouseButton;
Shift: TShiftState; X, Y: Integer);
procedure Image1MouseUp(Sender: TObject; Button: TMouseButton;
Shift: TShiftState; X, Y: Integer);
private
public
end;

var
Form1: TForm1;

implementation

uses
Math;

{$R *.DFM}

var
XC: Integer;
YC: Integer;

LastX: Single;
LastY: Single;

const
Scale = 20;

procedure Map(const WorldX: Single;
const WorldY: Single;
out DisplayX: Integer;
out DisplayY: Integer);

begin
DisplayX := Round(XC + Scale * (WorldX - WorldY) * 0.5 * Sqrt(3));
DisplayY := Round(YC + Scale * (WorldX + WorldY) * 0.5);
end;

procedure UnMap(const DisplayX: Integer;
const DisplayY: Integer;
out WorldX: Single;
out WorldY: Single);

var
Sum: Single;
Diff: Single;

begin
Diff := (DisplayX - XC) / (0.5 * Scale * Sqrt(3));
Sum := (DisplayY - YC) / (0.5 * Scale);

WorldY := (Sum - Diff) / 2;
WorldX := Sum - WorldY;
end;

procedure TForm1.FormCreate(Sender: TObject);

var
I: Integer;

X1: Integer;
Y1: Integer;

X2: Integer;
Y2: Integer;

begin
XC := ClientWidth div 2;
YC := ClientHeight div 2;

with Image1.Picture.Bitmap do
begin
Width := Image1.Width;
Height := Image1.Height;
end;

for I := -5 to 5 do
begin
Map(I, 5, X1, Y1);
Map(I, -5, X2, Y2);

with Image1.Picture.Bitmap.Canvas do
begin
MoveTo(X1, Y1);
LineTo(X2, Y2);
end;

Map(5, I, X1, Y1);
Map(-5, I, X2, Y2);

with Image1.Picture.Bitmap.Canvas do
begin
MoveTo(X1, Y1);
LineTo(X2, Y2);
end;
end;
end;

procedure TForm1.Image1MouseDown(Sender: TObject; Button: TMouseButton;
Shift: TShiftState; X, Y: Integer);

var
PolygonData: array[0..3] of TPoint;

begin
Unmap(X, Y, LastX, LastY);

if ((Abs(LastX) < 5) and (Abs(LastY) < 5)) then
begin
Map(Floor(LastX), Floor(LastY), PolygonData[0].X, PolygonData[0].Y);
Map(Floor(LastX), Ceil(LastY), PolygonData[1].X, PolygonData[1].Y);
Map(Ceil(LastX), Ceil(LastY), PolygonData[2].X, PolygonData[2].Y);
Map(Ceil(LastX), Floor(LastY), PolygonData[3].X, PolygonData[3].Y);

with Image1.Picture.Bitmap.Canvas do
begin
Brush.Style := bsSolid;
Brush.Color := clRed;
Polygon(PolygonData);
end;
end;
end;

procedure TForm1.Image1MouseUp(Sender: TObject; Button: TMouseButton;
Shift: TShiftState; X, Y: Integer);

var
PolygonData: array[0..3] of TPoint;

begin
if ((Abs(LastX) < 5) and (Abs(LastY) < 5)) then
begin
Map(Floor(LastX), Floor(LastY), PolygonData[0].X, PolygonData[0].Y);
Map(Floor(LastX), Ceil(LastY), PolygonData[1].X, PolygonData[1].Y);
Map(Ceil(LastX), Ceil(LastY), PolygonData[2].X, PolygonData[2].Y);
Map(Ceil(LastX), Floor(LastY), PolygonData[3].X, PolygonData[3].Y);

with Image1.Picture.Bitmap.Canvas do
begin
Brush.Style := bsSolid;
Brush.Color := clWhite;
Polygon(PolygonData);
end;
end;
end;

end.

Gary Williams

unread,
May 3, 2001, 5:03:08 PM5/3/01
to
"Gary Williams" <die.sp...@die.die.die.com> wrote in message
news:3af1c629$1_2@dnews...
> "Gary Williams" <die.sp...@die.die.die.com> wrote in message
> news:3af1c5c5_1@dnews...

> > Create a new project. On the form create a TImage and align it to
client.
> > Paste this code into Unit1 and run. A 10x10 grid will be drawn. Click
in
> > it to highlight a square.


Here's some revised MouseMove/MouseUp/MouseDown code that works a bit better
than what I posted a few minutes ago.


procedure ColorizeCell(const Color: TColor);

var
PolygonData: array[0..3] of TPoint;

begin
if ((Abs(LastX) < 5) and (Abs(LastY) < 5)) then
begin
Map(Floor(LastX), Floor(LastY), PolygonData[0].X, PolygonData[0].Y);
Map(Floor(LastX), Ceil(LastY), PolygonData[1].X, PolygonData[1].Y);
Map(Ceil(LastX), Ceil(LastY), PolygonData[2].X, PolygonData[2].Y);
Map(Ceil(LastX), Floor(LastY), PolygonData[3].X, PolygonData[3].Y);

with Form1.Image1.Picture.Bitmap.Canvas do
begin
Brush.Style := bsSolid;
Brush.Color := Color;
Polygon(PolygonData);
end;
end;
end;

procedure TForm1.Image1MouseDown(Sender: TObject; Button: TMouseButton;


Shift: TShiftState; X, Y: Integer);

begin
Unmap(X, Y, LastX, LastY);

ColorizeCell(clRed);
end;

procedure TForm1.Image1MouseUp(Sender: TObject; Button: TMouseButton;
Shift: TShiftState; X, Y: Integer);

begin
ColorizeCell(clWhite);
end;

procedure TForm1.Image1MouseMove(Sender: TObject; Shift: TShiftState; X,
Y: Integer);

begin
ColorizeCell(clWhite);
Unmap(X, Y, LastX, LastY);
ColorizeCell(clYellow);
end;

Gary Williams

unread,
May 3, 2001, 4:57:13 PM5/3/01
to
"Gary Williams" <die.sp...@die.die.die.com> wrote in message
news:3af1c5c5_1@dnews...
> Create a new project. On the form create a TImage and align it to client.
> Paste this code into Unit1 and run. A 10x10 grid will be drawn. Click in
> it to highlight a square.

<snip>

Also assign the Form's OnCreate event, and the Image's OnMouseUp and
OnMouseDown events.

Michel Larouche

unread,
May 4, 2001, 10:20:09 AM5/4/01
to
Cool, I try your code and I work fine...
I sought for something of similar

thanks..

Michel


"Gary Williams" <die.sp...@die.die.die.com> a écrit dans le message news:
3af1c78d_2@dnews...


> "Gary Williams" <die.sp...@die.die.die.com> wrote in message
> news:3af1c629$1_2@dnews...
> > "Gary Williams" <die.sp...@die.die.die.com> wrote in message
> > news:3af1c5c5_1@dnews...
> > > Create a new project. On the form create a TImage and align it to
> client.
> > > Paste this code into Unit1 and run. A 10x10 grid will be drawn.
Click
> in
> > > it to highlight a square.
>

...


Lee Parker

unread,
May 10, 2001, 2:02:14 PM5/10/01
to
Very interesting...

You've gotten me thinking about such, but with a hexigonal map overlaying a
background image... Routines to highlight an area / Unhighlight an area...

Could be very useful for many puzzle/adventure games...

Later,
Lee

"Gary Williams" <die.sp...@die.die.die.com> wrote in message
news:3af1c5c5_1@dnews...

Gary Williams

unread,
May 10, 2001, 2:55:37 PM5/10/01
to
"Erik Swedberg" <herr_h...@yahoo.se> wrote in message
news:030520012057349324%herr_h...@yahoo.se...
> I'm planning to make an Isometric Map-based game.
> Now, to do this, I need to know if the user clicked on one(or more)
> squares, for examle, a building or a creature.
> I cannot figure out how to do this.


I expanded on my earlier example, and now have a program that draws a cube
in isometric view, and you can click on the cube and drag it around in three
dimensions using the mouse (left-click to drag in horizontal plane,
right-click to drag vertically).

An executable demo is at

http://www.wizardhat.com/demo/Demo.exe

-Gary


mauricio...@gmail.com

unread,
Jun 8, 2015, 7:57:15 AM6/8/15
to
Dear ,

Good day!
great code to use in games. We are trying to develop an RPG type table for us to play rpg the distance using data etc.
I wonder how to enter an isometric map, say from an image?
For if I put a new TImage in the project it covers what you did and did not work as it should .
Reply all
Reply to author
Forward
0 new messages