2D rendering, but with a 3D coordinate system?

I want to make a game that has 2D based sprites, but with a 3 dimensional world that can be walked around in, sort of like Double Dragon.

I am looking for a simple way to draw 2D sprites in 3 dimensions, but I don’t think I need something as high-grade as OpenGL. Is there some simple library or trick I can use to accomplish this?

Thanks a bunch,
| Nathan

you dont have a third dimension per se. just like in an isometric game, like sim city, you have a Z so to speak, telling the renderer in what order stuff is rendered

Hmm. Okay. I’m gonna have to do some testing to figure this out :smiley:

Thanks,
| Nathan

technically you can do this with opengl depth stuff or whatever

I would just give every sprite a Z value and sort sprites by that value, or have it calculated by the Y value and then render
should be straight forward

For this, I had the typical X/Y values and I also had a third depth value. I didn’t call it Z just because it was kind of a fudged BS this. Pressing up on the keyboard increased depth and down decreased it. When jumping, Y increased or decreased.

Might be simpler to call X and Y what they are, and have like jumpHeight or something as your third value. In terms of draw position, it should be normal Y + jumpHeight. For collision detection, you need to look for collisions both along the normal X/Y, and also along the jumpHeight. Pretty easy.

Meh. One of the problems with games like Double Dragon is that it’s usually pretty difficult to tell the alignment on the y or z axis (depending on what system you use). So your kick might go right in front or behind the enemy.

Here’s what I went with (for now).

| Nathan

Cool. But as I said, the alignment problem. Would it be possible to put a square on the ground where the character is walking, and where enemies walk?

EDIT: Just tried the demo, and this isn’t very relevant I guess…

It’s pretty easy. Most 3D games want to render 2D sprites that always face the screen since that’s how you render particles! You’ll have to project your sprite positions into view space and then draw your quad there.

  1. Read back (or calculate) your OpenGL modelview matrix into a Matrix4f.
  2. Reset the modelview matrix with glLoadIdentity() so that vertices are only transformed by the projection matrix.

For each 3D sprite:
3. Load the sprite’s position into a Vector4f.
4. Transform the sprite’s position by the modelview matrix using
Matrix4f.transform(modelviewMatrix, spritePosition, spritePosition);
5. Draw the sprite’s quad relative to the transformed sprite position. The coordinates for the top left and bottom right corners:
x1 = spritePosition.x - width/2
y1 = spritePosition.y - height/2
z1 = spritePosition.z

x2 = spritePosition.x + width/2
y2 = spritePosition.y + height/2
z2 = spritePosition.z

To understand why this works you’ll need to understand how OpenGL transforms 3D coordinates into screen coordinates. The modelview matrix takes coordinates from world space to view space. In view space the “camera” is always located at (0, 0, 0) looking towards -z (I think :P). By creating our quad here we can guarantee that it always faces the screen, but it will still be processed by the projection matrix so it also gets smaller the farther away it is, etc.

Here’s my only real question, now:

How can I go about sorting a list based on a variable, z?

I want to render everything starting at the largest z value and ending with the smallest. What would be the best way to go about doing this?

| Nathan

I’m new, but since I have also a “Z-axis”, here’s my solution (maybe wrong ! so people might correct me ;D ) :

I just intend to make a Class that’ll act as some sort of a pool (storing everything that need to be drawn) and add a option for the Z value in it.
So in the end I’ll just have to “sort” the object before drawing.

Edit :
Huho, I didn’t notice you were talking about a LIST.
If that’s the case I’m pretty sure that this collection is already able to sort String & Integers just fine with a build-in method, right…?

I don’t know how efficient this is, and I’m sure there’s a better way, but here’s what I came up with.


      List<Entity> renderOrderList = new ArrayList<Entity>();
		List<Entity> backupList = new ArrayList<Entity>();
		
		for (Entity entity : entities) backupList.add(entity);
		
		for (int i = 0; i < entities.size(); i++) {
			Entity e = null;
			
			for (Entity entity2 : backupList) {
				if (e == null) e = entity2;
				if (entity2.z > e.z) e = entity2;
			}
			
			renderOrderList.add(e);
			backupList.remove(e);
		}
		
		for (Entity entity : renderOrderList) entity.render();

Which yields this result.

Feedback?

| Nathan

Yeah, I plan to do something like that.

| Nathan

What’s wrong with Arrays.sort() or Collections.sort()?

I don’t quite understand how to use Collections.sort().

How do I tell it to sort by the z variable present in the Entity class?

| Nathan

Comparator/Comparable:

What you’re doing is fine. I doubt you’ll ever have enough on screen to break your processor.

To make a bit more efficient, you can make it a binary sort, and you can only move entities around if they’ve changed Z.

Ah, okay.

How about this: a 2D image, but rotated in the third dimension, like these windows.

I want to have 2D tiles, but I want them to be rotated so you can tell that you are in a semi-3d environment. How can I go about doing this?

| Nathan

What, isometric tiling? Not really sure what you’re asking.

So, I have this grass tile

and instead of looking at it like that, which would be a top-down perspective, I want to tilt it away from the camera to give the illusion of a three dimensional world.

I’ll use pictures from Minecraft as an example:

Instead of the grass looking like this

I want it to look this this

| Nathan

EDIT: Do you think it’s time for me to move on to OpenGL? I think I’m starting to get to the point where my ideas outrun the capabilities of Java2D.