I think the traditional non-GPU HTML/JS solution for games has been to create a "CSS DOM Renderer", which is a JS API that creates <div>s with absolute positioning on text draw calls, which utilizes the DOM to draw text. This API is of course declarative in nature, instead of immediate/imperative, which can be a good or bad thing depending on what the existing app expects. I could not find a tutorial for that with brief googling, but there's a similar text on CSS DOM sprite rendering at http://buildnewgames.com/dom-sprites/ , which is closely resembling thing. The performance is apparently tricky to get right, since it depends on avoiding full repaints of the whole page on the text operations.
Another way is to use HTML5 <canvas> text rendering features which Alon mentioned already: https://developer.mozilla.org/en-US/docs/Drawing_text_using_a_canvas which is probably a bit saner approach. I think that should work on IE10 as well (?) Jukka 2014-01-30 Mark Hahn <[email protected]>: > > you can compile FreeType > > Thanks, I found a demo for this. The big problem is that freetype js is > 1.8 mbytes. > > I'm considering SVG as a solution also since I could draw one character at > a time. > > > On Wed, Jan 29, 2014 at 5:07 PM, Alon Zakai <[email protected]> wrote: > >> If you need pixel-perfect text tendering you can compile FreeType or such >> and use that. That will render pixels which you then copy to where you want. >> >> Or, you can use the browser's text rendering capabilities on a canvas, >> but it will differ based on font, browser, os, etc. >> >> - Alon >> >> >> >> On Wed, Jan 29, 2014 at 2:36 PM, Mark Hahn <[email protected]> wrote: >> >>> I am going to use emscripten to port a text pagination application to >>> the browser. This is an engine that displays text in a page with precise >>> and complex line-wrap and pagination rules. It uses the metric of a font >>> and calls an API to render the font. >>> >>> Compiling the engine to asm.js should be easy but I'll have to implement >>> the text rendering function myself. I don't know how to do this. >>> >>> I looked at the SDL api and I see no mention of text. I can't use webgl >>> because I need IE support. I don't see how I could use html/css because >>> each character must be placed accurately. >>> >>> Any ideas would be greatly appreciated ... >>> >>> -- >>> You received this message because you are subscribed to the Google >>> Groups "emscripten-discuss" group. >>> To unsubscribe from this group and stop receiving emails from it, send >>> an email to [email protected]. >>> For more options, visit https://groups.google.com/groups/opt_out. >>> >> >> -- >> You received this message because you are subscribed to the Google Groups >> "emscripten-discuss" group. >> To unsubscribe from this group and stop receiving emails from it, send an >> email to [email protected]. >> For more options, visit https://groups.google.com/groups/opt_out. >> > > -- > You received this message because you are subscribed to the Google Groups > "emscripten-discuss" group. > To unsubscribe from this group and stop receiving emails from it, send an > email to [email protected]. > For more options, visit https://groups.google.com/groups/opt_out. > -- You received this message because you are subscribed to the Google Groups "emscripten-discuss" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. For more options, visit https://groups.google.com/groups/opt_out.
