CODEWITHSUNDEEP
c++opengl3dshader
segfault
segfault

Reputation: 83

How to make good-looking cel shading lines in OpenGL?

I tried to make the ink lines (both outlines and inlines) by rendering the backfaces in wireframe mode, as suggested here: http://en.wikipedia.org/wiki/Cel_shading

The result with a line width of 1 is good enough:

good

However, when I set a thicker line width (> 3), this happens:

bad

OpenGL render lines as quads, resulting in blank spaces between edges and a popping effect whenever the model is rotated. Also, these weird pointy edges appear when multisample is enabled:

horrible

I tried to fix the blank spaces problem by rendering vertexs as smooth points, but I cannot find a suitable way to do a depth independent blending correctly.

Can this method be improved to show nice-looking thick lines or I have to rely on shaders? If so, which is the preferred approach?

My current code:

glCullFace(GL_FRONT);
glColor3f(0,0,0);
glLineWidth(outlineWidth);
glPolygonMode(GL_FRONT_AND_BACK, GL_LINE);
glEnable(GL_POLYGON_OFFSET_LINE);
glPolygonOffset(1,1);
//draw model with GL_TRIANGLES (yeah, I know...)
glDisable(GL_POLYGON_OFFSET_LINE);
glPolygonMode(GL_FRONT_AND_BACK, GL_FILL);
glCullFace(GL_BACK);

Upvotes: 4

Views: 3283

Answers (1)

stefalie
stefalie

Reputation: 26

I think there is no easy way without shaders to achieve your goal. Usually for antialiased lines you can use glEnable(GL_LINE_SMOOTH) and glHint(GL_POLYGON_SMOOTH_HINT, GL_NICEST) (needs blending enabled as mentioned in the previous reply), but this won't render nice line caps.

You have two options:

  1. Either use an image based post-processing approach and do edge detection on the depth buffer with, e.g., a Sobel Filter. For this you would need to store a linearized version of the depth buffer in a texture and implement the filter as a fragment shader.
  2. The other way uses the mesh data structure from which you extract and render all visible edges separately. One good tutorial for this approach can be found here http://prideout.net/blog/?p=54.

Both solutions are much more complex that the few OpenGL lines you have above.

Upvotes: 1

Related Questions