Signed Distance Field for drawing text


I have recently started to look for methods for text drawing and everybody suggests Signed Distance Field,
a method which Valve first use it for text.

I understood it all good, no problem, but a have a very important question about the interpolation of the values - distances.
The tutorials I found… by the way if anyone can add anything more:

The idea is to use the Distance Field like a regular texture, normal map etc.
Correct me if I’m wrong,
We use the vertex shader to pass the texture coordinates, which then interpolated to the fragment shader.
Now, texture coordinates are indices to the texture array. And there are 3 situations when texturing.

  1. Rare occasion, one pixel corresponds to one texel
  2. One pixel corresponds to lot of texels(zoom out)
  3. A lot of pixels correspond to one texel(zoom in)

The first situation is easy. The second, I think that the pixel gets the sum of the texels. And the third, all the pixels get the texel’s value.
I had the idea that the interpolation of the texture coordinates was used for the third situation, and again we use only the integer part of the value
because the indices are integers right? I mean that a pixel can have x=1.3 texture coordinate but it gets the value from the texel with x==1 coordinate.
The trick to the Signed Distance Field is the interpolation of the distances, that is the interpolation of the values of the texture.
Now, with normal mapping I can’t notice if the values are interpolated but at simple texturing I am pretty sure that in the third situation the colors are not interpolating.
Or I can’t see it.
My question at last is that, when I am normal mapping or just texturing, I am using the same method paul.houx used at Cinder Forums. I was expecting to see the same
result with the alpha-blended text, And to explain, under a diagonal line when you expecting to see the square result of the alpha-blended or alpha-tested method, the Signed Distance Field method eliminates the problem by giving the pixel the interpolated value of the texels that falls between them. But as I explained above, I didn’t know that the textures’ colors(in our case, the distances) are interpolating.

Anyone can make me understand??


I figured it out myself. It has to do with the texture magnification function. If you set it to GL_NEAREST then when one pixel is mapped to less than one texel or a lot of pixels to one texel they got the texel’s value as it is. Alternatively, if you set it to GL_LINEAR you get interpolated values and only then the Signed Distance Field method will work.

Thanks a lot…you f loosers

Thanks a lot…you f loosers

These comments don’t inspire us to offer you help

1 Like