Sorry your browser is not supported!

You are using an outdated browser that does not support modern web technologies, in order to use this site please update to a new browser.

Browsers supported include Chrome, FireFox, Safari, Opera, Internet Explorer 10+ or Microsoft Edge.

DarkBASIC Professional Discussion / Fastest Way to Render Tiles on a 2D Grid

Author
Message
Sasuke
20
Years of Service
User Offline
Joined: 2nd Dec 2005
Location: Milton Keynes UK
Posted: 28th May 2012 23:21 Edited at: 28th May 2012 23:21


Something I generated with box command.

Now this needs to be speeded up a ton. So before I dive into it (code wise), what do you think is the best method of rendering tiles on a grid that have an outline?


Join or Support!
Diggsey
20
Years of Service
User Offline
Joined: 24th Apr 2006
Location: On this web page.
Posted: 29th May 2012 00:00
A simple optimisation would be to merge adjacent tiles of the same type into a single draw operation. Also, switching to using batched drawing with my advanced2d plugins should give you a nice speed boost

[b]
Sasuke
20
Years of Service
User Offline
Joined: 2nd Dec 2005
Location: Milton Keynes UK
Posted: 29th May 2012 00:24 Edited at: 29th May 2012 00:27
Quote: "A simple optimisation would be to merge adjacent tiles of the same type into a single draw operation."


Trying to do that at the moment. Not sure the math behide it though. But I'm experimenting.

Quote: "Also, switching to using batched drawing with my advanced2d plugins should give you a nice speed boost"


I'm using it already, there just ins't a start batch box command yet. Unless your thinking of me using triangles for the quads.


Join or Support!
Sasuke
20
Years of Service
User Offline
Joined: 2nd Dec 2005
Location: Milton Keynes UK
Posted: 29th May 2012 00:25 Edited at: 29th May 2012 00:27
[Sorry. Double Post]


Join or Support!
Diggsey
20
Years of Service
User Offline
Joined: 24th Apr 2006
Location: On this web page.
Posted: 29th May 2012 00:54
All filled shapes are drawn with triangles, so you can start a triangle batch and then draw your tiles the same way you've been doing so far.

[b]
Sasuke
20
Years of Service
User Offline
Joined: 2nd Dec 2005
Location: Milton Keynes UK
Posted: 29th May 2012 03:29 Edited at: 29th May 2012 03:29
I see thanks. Batching really improves the performance greatly. Great plugin you've got btw


Join or Support!
Libervurto
20
Years of Service
User Offline
Joined: 30th Jun 2006
Location: On Toast
Posted: 29th May 2012 06:53
Instead of drawing you could write the data to a memblock then make a bitmap from the memblock and copy to screen.

Sasuke
20
Years of Service
User Offline
Joined: 2nd Dec 2005
Location: Milton Keynes UK
Posted: 29th May 2012 11:44
OBese87, any chance you could show me an example of how that works please? Then I can adapt it from there. Haven't really done a lot of work with memblocks.


Join or Support!
Duffer
23
Years of Service
User Offline
Joined: 9th Feb 2003
Location: chair
Posted: 29th May 2012 14:06 Edited at: 29th May 2012 14:09
@ Diggsey,

Been thinking about this too recently. Been playing quite a few of those retro roguish 2d rpgs...

If say I had a square texture for say a wall or a door (with say black as transparent) could I batch draw the images (lots of them!) using Advanced2D?

Thinking in particular of A2DrawImage? in a batch?

a long time dabbler with DBC and DBPro with no actual talent but lots of enthusiasm...
Fallout
23
Years of Service
User Offline
Joined: 1st Sep 2002
Location: Basingstoke, England
Posted: 29th May 2012 14:14
I would just create all possible images in advance and then paste the appropriate one. So you have an empty box, a top line, a bottom line, a left line and a right line. What's that? 20-30 different combinations? Generate them as you have done, capture them with get image, and they're ready to paste.

It might not appeal to your desire for coding elegance, but it's simple and would be very fast.

Duffer
23
Years of Service
User Offline
Joined: 9th Feb 2003
Location: chair
Posted: 29th May 2012 14:31
@ Fallout - what about detailed textures? Could you use (*Diggsey?) Advanced2D to speed that up - or would memblock extraction be quicker? Or even pasting images to a larger image - thinking about SvenB's image kit plugin... cant help but think A2D and IK together would make it fly... will experiment this evening when off the train!

a long time dabbler with DBC and DBPro with no actual talent but lots of enthusiasm...
Pincho Paxton
23
Years of Service
User Offline
Joined: 8th Dec 2002
Location:
Posted: 29th May 2012 15:19 Edited at: 29th May 2012 15:30
Another option is to paste the black tiles 32*32, on a grey background. Then paste the white tiles 30*30 every half step.

Black tiles pasted...

1,1,1,1,1,1,1,1,1,1

White tiles pasted...

1,1.5,1,1.5,1,1.5

It's sort of like dragging the white tiles through the black tiles. If the tiles are detailed then you would just need to make white a mask.

Fallout
23
Years of Service
User Offline
Joined: 1st Sep 2002
Location: Basingstoke, England
Posted: 29th May 2012 18:05 Edited at: 29th May 2012 18:07
Quote: "@ Fallout - what about detailed textures? Could you use (*Diggsey?) Advanced2D to speed that up - or would memblock extraction be quicker? Or even pasting images to a larger image - thinking about SvenB's image kit plugin... cant help but think A2D and IK together would make it fly... will experiment this evening when off the train!"


I've not used any of those plug-ins or manipulated 2D objects with memblocks before, so you'd have to experiment.

If the aim here is to have different textured tile squares, with different combinations of walls around the outside (that's what it looks like you're doing), then I personally would just have two layers. First I'd paste all the textured tile squares onto the grid, and then I'd paste simple wall graphics on top.

You could paste individual walls, or to reduce paste operations, make the various combinations of walls a square can have at the start of the program, then just paste one 'wall combo' image on top. You could use sprites if you wanted to, to save you pasting every loop (this is possibly even faster).

If you can pre-make everything into images and just paste them in the right place or use sprites, I would imagine that'd be the fastest method.

Diggsey
20
Years of Service
User Offline
Joined: 24th Apr 2006
Location: On this web page.
Posted: 29th May 2012 19:59 Edited at: 29th May 2012 20:07
A2D currently doesn't support batching of a2DrawImage because you can only batch draw things that have the same texture. If you wanted to draw lots of the same image then that could be batched if the plugin supported it.

Certainly for something as simple as the image Sasuke posted I would be very surprised if using images for tiles was faster though, unless you combine multiple tiles into a single image, but that will result in tons of images very quickly.

Another optimisation you can do is draw the level to an image at level load, and then just draw that image each frame. You could then update individual tiles in the image as required using A2D. This should give extremely fast results!

Drawing the tiles with memblocks will always be slower than the exact equivalent hardware accelerated method (ie. A2D) so are only a benefit when there isn't a direct equivalent in hardware.

[b]
Fallout
23
Years of Service
User Offline
Joined: 1st Sep 2002
Location: Basingstoke, England
Posted: 29th May 2012 22:12
Sounds like I might have to look at A2D mate! I've never really had a need for fast 2D, but it sound like it'd be worth checking out to see what it's capable of and expand the arsenal.

Duke E
17
Years of Service
User Offline
Joined: 10th Mar 2009
Location:
Posted: 30th May 2012 12:17 Edited at: 30th May 2012 12:45
Did something similar with Image Kit for an unfinished project .

Needed a LARGE map so i used a memblock where each byte represented a different tile (255 types). Just sampling the screens view port rows/columns from the memblock. Could be an array if the map is not large.

Had pre-made images (with no edge outlines) for each tile and copied them to a target image.
(I needed scrolling so i only updated the edges, copying the whole target image on to itself offset by the tile width/height then pasting new tiles by rows/column where needed)

To get the "outline" of the tiles I made a "edge finder" shader. This was applied on the target image to get the edges of the background (was the alpha channel in my case). The shader coloured the edges with black pixels returning the final image I then used on the screen.

/Regards
Libervurto
20
Years of Service
User Offline
Joined: 30th Jun 2006
Location: On Toast
Posted: 30th May 2012 21:07 Edited at: 30th May 2012 21:11
Here's an example of drawing with memblocks:
I'm not sure how efficient the functions are as I wrote them a few years ago.


To convert a memblock to bitmap it needs to be in the correct format.
The first 12 bytes of any memblock bitmap are known as the header. This chunk of data stores the bitmap's dimensions: width, height and depth; each being stored in a 4B DWORD (12B/3 = 4B).
The rest of the memblock is one long stream of pixel data. The length of each pixel (in bytes) depends on the depth of the bitmap; annoyingly the depth of the bitmap is stored in bits but pixels are stored in bytes, so you will need to divide the bit-depth by eight to get the "byte-depth" (you'll see this in my code).
(Side-note: did you know the word "byte" comes from "by-eight"?)
Converting the 1D pixel data to 2D requires use of the width, height and depth values (you will see this in my code).

This whole process is basically controlling your own screen buffer. It's great for DBC since there is no un/lock pixels command.

Login to post a reply

Server time is: 2026-07-08 12:26:27
Your offset time is: 2026-07-08 12:26:27