isometric tiling

Started by
34 comments, last by pbivens67 9 months ago

I have stubbed out some code that converts isometric tiling to Cartesian coordinates, is my formula correct.

#include <iostream>

using namespace std;

int main()
{
	float isoX = 0.0f, isoY = 0.0f, cartX = 0.0f, cartY = 0.0f;

	cout << "Enter isoX: ";
	cin >> isoX;
	cout << endl;

	cout << "Enter isoY: ";
	cin >> isoY;
	cout << endl;

	cartX = (2 * isoY + isoX) / 2;
	cartY = (2 * isoY - isoX) / 2;

	cout << "CartX: " << cartX << endl;
	cout << "CartY: " << cartY << endl;

	return 0;
}   
Advertisement

Try it:

The 3 tiles at the left are all 128 x 64, top-left corner is at (0, 0), (0, 64), (0, 128).

At the right a composed example.

EDIT: I didn't notice before posting that you were already trying to go that path in another thread. I hope you get your image fixed.

this code works but I want to draw a tile next to the center tile.

#include <iostream>

using namespace std;

int main()
{
	float isoX = 0.0f, isoY = 0.0f, cartX = 0.0f, cartY = 0.0f;

	cout << "Enter isoX: ";
	cin >> isoX;
	cout << endl;

	cout << "Enter isoY: ";
	cin >> isoY;
	cout << endl;

	cartX = (2 * isoY + isoX) / 2;
	cartY = (2 * isoY - isoX) / 2;

	cout << "CartX: " << cartX << endl;
	cout << "CartY: " << cartY << endl;

	return 0;
}

sorry but I reposted my code, here is the correct code.

#include <iostream>

using namespace std;

int main()
{
	float isoX = 0.0f, isoY = 0.0f, cartX = 0.0f, cartY = 0.0f;

	cout << "Enter cartX: ";
	cin >> cartX;
	cout << endl;

	cout << "Enter cartY: ";
	cin >> cartY;
	cout << endl;

	isoX = cartX - cartY;
	isoY = (cartX + cartY) / 2;

	cout << "isoX: " << isoX << endl;
	cout << "isoY: " << isoY << endl;

	return 0;
}

pbivens67 said:
this code works but I want to draw a tile next to the center tile.

Working code is always nice. I am not sure I get what all the variables mean.

X and Y are probably numbers of a coordinate pairs? You seem to have a “cart” pair as input and a “iso” pair as output? So what coordinate system does the “cart” pair represent in your working code? What coordinate system is the “iso” pair using?

If I move from (0, 0) in cart to (1, 0), how does “iso”move? If I move from (0, 0) in cart to (0, 1), how does “iso” move?

Can you draw a conclusion from those movements?

I want to draw isometric tiles side by side not just one on top of another.
void grass()
{
	glEnable(GL_TEXTURE_2D);
	glBindTexture(GL_TEXTURE_2D, texture[0]);
	glBegin(GL_POLYGON);
	glTexCoord3f(0.0f, 0.0f, 0.0f);
	glVertex2f(-20.0f, 10.0f);
	glTexCoord3f(1.0f, 0.0f, 0.0f);
	glVertex2f(20.0f, 10.0f);
	glTexCoord3f(1.0f, 1.0f, 0.0f);
	glVertex2f(20.0f, -10.0f);
	glTexCoord3f(0.0f, 1.0f, 0.0f);
	glVertex2f(-20.0f, -10.0f);
	glEnd();
	glDisable(GL_TEXTURE_2D);
}

void grass_two()
{
	glEnable(GL_TEXTURE_2D);
	glBindTexture(GL_TEXTURE_2D, texture[0]);
	glBegin(GL_POLYGON);
	glTexCoord3f(0.0f, 0.0f, 0.0f);
	glVertex2f(-20.0f, 30.0f);
	glTexCoord3f(1.0f, 0.0f, 0.0f);
	glVertex2f(20.0f, 30.0f);
	glTexCoord3f(1.0f, 1.0f, 0.0f);
	glVertex2f(20.0f, 10.0f);
	glTexCoord3f(0.0f, 1.0f, 0.0f);
	glVertex2f(-20.0f, 10.0f);
	glEnd();
	glDisable(GL_TEXTURE_2D);
}

Follow the tutorial.

If you copy/paste the grass function to the grass_two function, and only change the y coordinate in the second function, then sure, the second tile gets drawn below the first one. The screen still has the same vertical y and horizontal x coordinates as with all your previous programs.It doesn't change its coordinate system if you don't tell it how to do that.

For an isometric world, both x and y change with each tile.

The isometric to screen xy coordinates conversion code that you have should be able to provide needed x and y for each tile.

Best solution to paint a tile is 1) compute the xy position of tile with your isometric conversion, and 2) draw the tile at the computed coordinates. All in 1 function.

actually I am reading the above tutorial

how do I fill in the center rectangle here is my code

void grass()
{
	glEnable(GL_TEXTURE_2D);
	glBindTexture(GL_TEXTURE_2D, texture[0]);
	glBegin(GL_POLYGON);
	glTexCoord3f(0.0f, 0.0f, 0.0f);
	glVertex2f(-20.0f, 10.0f);
	glTexCoord3f(1.0f, 0.0f, 0.0f);
	glVertex2f(20.0f, 10.0f);
	glTexCoord3f(1.0f, 1.0f, 0.0f);
	glVertex2f(20.0f, -10.0f);
	glTexCoord3f(0.0f, 1.0f, 0.0f);
	glVertex2f(-20.0f, -10.0f);
	glEnd();
	glDisable(GL_TEXTURE_2D);
}

void grass_two()
{
	glEnable(GL_TEXTURE_2D);
	glBindTexture(GL_TEXTURE_2D, texture[0]);
	glBegin(GL_POLYGON);
	glTexCoord3f(0.0f, 0.0f, 0.0f);
	glVertex2f(-20.0f, 30.0f);
	glTexCoord3f(1.0f, 0.0f, 0.0f);
	glVertex2f(20.0f, 30.0f);
	glTexCoord3f(1.0f, 1.0f, 0.0f);
	glVertex2f(20.0f, 10.0f);
	glTexCoord3f(0.0f, 1.0f, 0.0f);
	glVertex2f(-20.0f, 10.0f);
	glEnd();
	glDisable(GL_TEXTURE_2D);
}

void grass_three()
{
	glEnable(GL_TEXTURE_2D);
	glBindTexture(GL_TEXTURE_2D, texture[0]);
	glBegin(GL_POLYGON);
	glTexCoord3f(0.0f, 0.0f, 0.0f);
	glVertex2f(20.0f, 30.0f);
	glTexCoord3f(1.0f, 0.0f, 0.0f);
	glVertex2f(60.0f, 30.0f);
	glTexCoord3f(1.0f, 1.0f, 0.0f);
	glVertex2f(60.0f, 10.0f);
	glTexCoord3f(0.0f, 1.0f, 0.0f);
	glVertex2f(20.0f, 10.0f);
	glEnd();
	glDisable(GL_TEXTURE_2D);
}
void grass_four()
{
	glEnable(GL_TEXTURE_2D);
	glBindTexture(GL_TEXTURE_2D, texture[0]);
	glBegin(GL_POLYGON);
	glTexCoord3f(0.0f, 0.0f, 0.0f);
	glVertex2f(20.0f, 10.0f);
	glTexCoord3f(1.0f, 0.0f, 0.0f);
	glVertex2f(60.0f, 10.0f);
	glTexCoord3f(1.0f, 1.0f, 0.0f);
	glVertex2f(60.0f, -10.0f);
	glTexCoord3f(0.0f, 1.0f, 0.0f);
	glVertex2f(20.0f, -10.0f);
	glEnd();
	glDisable(GL_TEXTURE_2D);
}

This topic is closed to new replies.

Advertisement