GLES Line Rendering
2014/06/05
.
I'm working on an OpenGL app and doing my own rendering layer. The app, a 3D modeler, needs high-quality line rendering, but standard OpenGL, especially on mobile, does a bad job at that.
One recurring solution is to extrude quads (pairs of triangles) along the line, doing proper mitering. On top of this, solutions generally use gradual alpha falloff to simulate anti-aliasing, whether through texture, Gouraud shading, or some other fragment processing technique.
I did a pretty broad and deep survey of techniques and settled on a combination of things. Many of the current solutions leverage geometry shaders to do the geometry extrusion, but this shader stage is not available on my chosen mobile target (iOS) at this time.
So, I implemented something closely aligned with the JGT paper, Shader-Based Antialiased Dashed Stroked Polylines. This approach leads to both really good line quality and flexible cap and dash rendering, which are both goals of my work. I also figured out a way to get the view-dependent line extrusion to happen solely on the GPU, which means the only CPU overhead is initial VBO setup. This nicely gets around the general lack of geometry shaders on mobile.
Some examples of the current line rendering can be seen to the right. There are some artifacts in some of the screen grabs. These artifacts are due to the fact that my target frame buffer for the scene is eventually stretched to fill the display size. This causes some pixel resampling artifacts in the vertical direction in some of the images. The unscaled off-screen framebuffer (bottom middle) is artifact free though. This is a tradeoff that I'm comfortable with for now.
The code is on github, including the vertex and fragment shaders.
Free-hand lines