Best practices for rendering LOTS of text?

Started by
3 comments, last by Cadde 12 years ago
I have come to a point where i want to render LOTS of text. My idea here is i want to render the text to a "screen" in my 3D space.
I have a few ideas on how i want to do it but i am not sure if it's going to be a good solution.

I have fiddled with text rendering in the past with GDI, GDI+ and even in XNA but every time i have run into a limiting factor performance wise.

My goal here is to make a computer screen kinda deal with a console. I want it to be as fast as possible to allow text to flash by as fast as it would in your average command prompt. (Not even this has been working for me in the past, always too slow)

My first idea is to render the text to a surface and then send that surface to a single quad representing the screen. The downside here is that sending such large textures (I am thinking 1920x1080 in size which obviously would translate to a 2048x2048 texture) every frame or even every other frame etc would still be very slow.

So my second idea was to make a single texture, a bitmap font and send that to the GPU once and have X number of quads times Y number of quads for rows and columns. Then update an array or likewise with the tu and tv values for each quad.
So if my screen has 80 columns and 50 rows then that would be 4,000 * 2 floats = 32,000 bytes per frame. At least that would be an improvement over sending a new 2048x2048 texture which would be ~16 Megabytes per frame.

Then my third idea was to somehow handle the texture coordinates on the GPU and simply sending bytes describing what goes in each column and row. So i have a texture on the GPU and 8,000 triangles. They don't have any texture coordinates assigned initially and i send a stream of 4,000 bytes per frame that the shader would use to set the appropriate texture coordinates. (Obviously i am going for a monospace font here too)

Of course the screen wouldn't need to be updates once every frame but i am looking for at least 60 updates per second per virtual screen. And i would love to have more than 80x50 columns and rows too!

Which option would be the most viable one and could anyone provide an example for me if he/she has one in mind?
For instance, i have no idea of how to actually implement the third option in shader code and even the second option is untested territory for me.

Thanks in advance for any help! I will now attempt to make a testbed using at least the 2nd option.
//Cadde


EDIT:

I am also looking for any other alternatives that would be easier to implement and still fast. Those three options where just off the top of my head.
Advertisement
Ive never needed to render the amount of text that you are, but off the top of my head, why are you trying to use textures to do it? Why not use ID3DXFont->Draw()? You could create a data type that holds your text as a string, holds the column, row ect...(Using RECT coordinates) then loop through all your text, sending the string through your ID3DXFont object. I have never done this as I said, so I am not sure of the performance you would get out of ID3DXFont, but I would imagine it would be faster than sending everything through a texture. You could simulate the text position in your 3D world onto your console.
Going back to your fixed 80*50 grid mesh idea, you can do this with a static mesh buffer, a static texture, and a dynamic buffer of glyph ID's.

You make a static mesh, that contains a quad (or two tris) for each grid cell. Every vert can have a static texcoord that identifies which corner of the glyph it represents (e.g. 2D values of [-1,-1],[1,-1],[1,1] or [-1,1] or alternatively simply 1D values of 0,1,2 or 3) and a secondary 1D texcoord that identifies which 'cell' the vert belongs to. If theres 80*50 cells, then this cell-ID ranges from 0-3999. You can fit the corner-ID in a single byte (for the 1D version, or two bytes for the 2D version), the cell-ID in a 16-bit int.

Then your dynamic data consists of specifying which glyph should appear in which cell. Assuming you only need 256 glyphs, then this is one byte per cell, or 4000 bytes.
All of your glyphs can be stored on a static texture sheet -- e.g. a 256*256 texture gives you 256 glyphs at 16*16 resolution.

In the vertex shader, you read the vertex's cell-ID, use that to fetch the glyph-ID that should appear in that cell, convert the glyph-ID into the texture-coordinate at the centre of the glyph. Then once you've got this glyph-centre tex-coord, you use the vertex's corner-ID to offset it to the appropriate corner of the glyph.

That sounds like it should work, and should perform fine. If you're struggling with specific implementation details, ask below ;)

---------- [edit]
As an alternative implementation:
You could have a static grid mesh that only contains positions for the verts and an index buffer so you're not repeating yourself (there's 6 verts per two-tri-quad, but only 4 unique values -- so you write the 4 values into a vertex buffer, and then write 6 indices into an index buffer).
Then you make a dynamic vertex buffer for storing the UV coordinates. If your text isn't super-high resolution, then these can be stored as two bytes per UV. On the CPU, you determine which glyph appears in each cell, and write the 4 corner UV's for that glyph into your dynamic vertex buffer.

When rendering, you bind both the static position buffer and the dynamic tex-coord buffer. The size of the dynamic data is 80*50*2, or 8KiB, which is still tiny.

Most games that I've worked on have use the above implementation, except that both positions and tex-coords are dynamic and are generated by the CPU every frame.

Ive never needed to render the amount of text that you are, but off the top of my head, why are you trying to use textures to do it? Why not use ID3DXFont->Draw()? You could create a data type that holds your text as a string, holds the column, row ect...(Using RECT coordinates) then loop through all your text, sending the string through your ID3DXFont object. I have never done this as I said, so I am not sure of the performance you would get out of ID3DXFont, but I would imagine it would be faster than sending everything through a texture. You could simulate the text position in your 3D world onto your console.


I have used ID3DXFont in the past, for full page updates (That is, scrolling text like in a command prompt) it's simply too slow.
My idea is to have the bitmap font texture stored in video memory and only alter the texture coordinates when the window needs to be updated.
Keep in mind that ID3DXFont too sends texture resources to the hardware after you have created a batch. Thus, sending a full 80x50 grid of characters is as expensive as sending a texture. The difference is i can get rid of some overhead doing it with pre-allocated font maps. XNA does this but i am not so sure it's the optimal solution either.

So in essence, my question really is. How can i update a grid of quads that are already assigned to hardware without sending the full vertex buffer every frame. All i am interested in is setting the texture coordinates and if possible, sending only byte arrays to the shader since i only intend to use up to 255 different characters.
Going back to your fixed 80*50 grid mesh idea, you can do this with a static mesh buffer, a static texture, and a dynamic buffer of glyph ID's. You make a static mesh, that contains a quad (or two tris) for each grid cell. Every vert can have a static texcoord that identifies which corner of the glyph it represents (e.g. 2D values of [-1,-1],[1,-1],[1,1] or [-1,1] or alternatively simply 1D values of 0,1,2 or 3) and a secondary 1D texcoord that identifies which 'cell' the vert belongs to. If theres 80*50 cells, then this cell-ID ranges from 0-3999. You can fit the corner-ID in a single byte (for the 1D version, or two bytes for the 2D version), the cell-ID in a 16-bit int. Then your dynamic data consists of specifying which glyph should appear in which cell. Assuming you only need 256 glyphs, then this is one byte per cell, or 4000 bytes. All of your glyphs can be stored on a static texture sheet -- e.g. a 256*256 texture gives you 256 glyphs at 16*16 resolution. In the vertex shader, you read the vertex's cell-ID, use that to fetch the glyph-ID that should appear in that cell, convert the glyph-ID into the texture-coordinate at the centre of the glyph. Then once you've got this glyph-centre tex-coord, you use the vertex's corner-ID to offset it to the appropriate corner of the glyph. That sounds like it should work, and should perform fine. If you're struggling with specific implementation details, ask below ;) ---------- [edit] As an alternative implementation: You could have a static grid mesh that only contains positions for the verts and an index buffer so you're not repeating yourself (there's 6 verts per two-tri-quad, but only 4 unique values -- so you write the 4 values into a vertex buffer, and then write 6 indices into an index buffer). Then you make a dynamic vertex buffer for storing the UV coordinates. If your text isn't super-high resolution, then these can be stored as two bytes per UV. On the CPU, you determine which glyph appears in each cell, and write the 4 corner UV's for that glyph into your dynamic vertex buffer. When rendering, you bind both the static position buffer and the dynamic tex-coord buffer. The size of the dynamic data is 80*50*2, or 8KiB, which is still tiny. Most games that I've worked on have use the above implementation, except that both positions and tex-coords are dynamic and are generated by the CPU every frame.


Thank you!
Though i am having a hard time following along with your description (too technical for me, i am still a newbie at D3D, SlimDX and shaders. (Or at least i consider myself to be one)
I will read through it several times to see if i can understand it any better but the first two questions that spring to mind is:

1. How would this look in shader code, should i declare an array and use that to determine which texture coordinates i need in shader code? Please show me an example of what i need to do here since i have no idea at all.
2. An example in code would be nice too, i know there are lots of different types of resources i can update but i am not so sure about arrays. Do i even send arrays? Maybe i just send an 8 bit texture?

Like i said, i am pretty clueless and i figure stuff out as i go.

------

That aside, I've managed to pass a 2048x2048 texture to my GPU and am testing by rebuilding the entire vertex buffer every frame.
Currently i have a 200 x 200 grid of quads that are fed random tu and tv values each update and i am running at 77 FPS. That is beyond expectations for me, i have never been able to run so fast before.

I am using a GeForce GTX580 and an I7 at ~3.6 GHz in case anyone wants to know.
Mind you, this is the first crude testing. I don't intend to update the entire vertex buffer like this but only the texture values (something i still have to figure out how to do unless someone shows me how) and eventually optimize that down to one byte per character.

As of current with some quickie math...

201x201x6 vertices = 242,406 vertices per frame-
vertex data size is 24 so that's 5,817,744 per frame. (or ~5.5 MB per frame)
Running at 77 FPS, that's 427.21 MB/s sent to the GPU. What a waste but this is just how i work, it helps me organize and think ahead since i never actually plan ahead that much.


Edit:

Oh and i think (if it's possible) i am going to have a static char buffer so if it isn't updated at all then it would reuse the old one already present on the GPU. In case it wasn't clear before.
Which brings up another question, say i want to alter a specific row and/or a specific column or region etc in my little console window. It's possible to just update a portion of the char array without having to update the whole buffer/whatever right?

I like performance and say i wanted to make some sort of ASCII animation on the virtual screen without updating the entire thing then that would be possible too right?

This topic is closed to new replies.

Advertisement