Rendering Text in WebGL

Just like OpenGL and most rendering engines that I know of, WebGL has no builtin support for text rendering. And on top of that, I can’t use the approach we use in PointLine at the moment. PointLine gets the outlines for the characters from the Windows GDI. So I was looking for something cross platform.

Searching on the internet there are two main approaches:

  1. Render the alphabet or the word in question to an image, and then use that image to texture some triangles.
  2. Trace the outlines of the characters and triangulate the polygons.

Although I prefer the second approach, I found an example of the first that looked simple enough on nehe. It was based on FreeType and for OpenGL.  I started converting it to WebGL, but it was not as easy as it looked. It makes heavy use of display lists which are not available in WebGL.

So I looked further, and found the FTGL library which is also based on FreeType. It sounded like just what I need, but for OpenGL. So, I extended the library to allow me to extract the triangles for processing in WebGL. I sent my patch to the FTGL developers and hope for inclusion.

Meanwhile I can render texts in WebGL with my modified version of FTGL …  of course it’s only so easy to do when using Wt::WGLWidget from the excellent witty library.

Here is my research prototype which now has text.

Here are the important parts of how it’s done with the modified libftgl:

Continue reading “Rendering Text in WebGL”

PointLineWeb research prototype

Google employees can spend 20% of their working time for their own projects. We at cubx (The CAD development department recently split from BORM) have now something similar. We get to spend every second friday afternoon for some projects of our own. The only restriction is that it has to do with computer graphics.

I chose a project that I had in mind for almost as long as I have been working for BORM. I wanted to run PointLine as a web service on a linux box. Wit the old core, that was so tightly tied to MFC, this would have been impossible. But the new unfinished core is designed to be platform independent. So, I took it as a base.

Some three years ago, I looked at vrml and x3d for the 3d in browser part. These standards didn’t have as broad support as I thought. You couldn’t do much without buying proprietary browser plugins. So I never made much progress on that. But then came WebGL. All mayor Browsers support it natively, and on top  of that, my favourite web application framework recently got a WebGl widget.

So far, my research prototype doesn’t do much, but I already learned a lot that I can also use in my everyday work. I gained a better understanding of rendering pipelines, learned about shaders and ray picking …

As a side project, I set up a jenkins continous integration server that compiles the project on ubuntu and windows after every commit. Additionally, I learned about CPack, so that the result of the jenkins build is a binary deb package ready to install.

You can see the web application as it progresses here:

http://webglcad.ulrichard.ch

Usually, I would also provide a link to the sources, but this is closed source, sorry…

Google Body Browser

I knew google can read my mind.

For some time now I was looking for something like GoogleEarth for human anatomy. I even thought about asking Google to make something like that.

Now I learned they did just that. They even did it as a showcase for WebGL which is part of the upcoming HTML5 standard.

Have a look at http://bodybrowser.googlelabs.com/

You will need a browser with WebGL support. At the moment the beta versions of Firefox and Chrome are known to work well.