Bilinear filtering

Bilinear filtering is a texture mapping method used to smooth textures when displayed larger or smaller than they actually are.

Most of the time, when drawing a textured shape on the screen, the texture is not displayed exactly as it is stored, without any distortion. Because of this, most pixels will end up needing to use a point on the texture that's 'between' texels, assuming the texels are points (as opposed to, say, squares) in the middle (or on the upper left corner, or anywhere else; it doesn't matter, as long as it's consistent) of their respective 'cells'. Bilinear filtering uses these points to perform bilinear interpolation between the four texels nearest to the point that the pixel represents (in the middle or upper left of the pixel, usually).

The formula

In these equations, u_k and v_k are the texture coordinates and y_k is the color value at point k. Values without a subscript refer to the pixel point; values with subscripts 0, 1, 2, and 3 refer to the texel points, starting at the top left, reading right then down, that immediately surround the pixel point. These are linear interpolation equations. We'd start with the bilinear equation, but since this is a special case with some elegant results, it is easier to start from linear interpolation.

<math>y_a = y_0 + \frac{y_1-y_0}{u_1-u_0}(u-u_0) \,\!<math>

<math>y_b = y_2 + \frac{y_3-y_2}{u_3-u_2}(u-u_2) \,\!<math>

<math>y = y_b + \frac{y_b-y_a}{v_2-v_0}(v-v_0) \,\!<math>

Assuming that the texture is a square bitmap,

<math>v_1 = v_0 \,\!<math>

<math>v_2 = v_3 \,\!<math>

<math>u_1 = u_3 \,\!<math>

<math>u_2 = u_0 \,\!<math>

<math>v_3 - v_0 = u_3 - u_0 = w \,\!<math>

Are all true. Further, define

<math>U = \frac{u - u_0}{w} \,\!<math>

<math>V = \frac{v - v_0}{w} \,\!<math>

With these we can simplify the interpolation equations:

<math>y_a = y_0 + (y_1-y_0)U \,\!<math>

<math>y_b = y_2 + (y_3-y_2)U \,\!<math>

<math>y = y_a + (y_b-y_a)V \,\!<math>

And combine them:

<math>y = y_0 + (y_1 - y_0)U + (y_2 - y_0)V + (y_3 - y_2 - y_1 + y_0)UV \,\!<math>

Or, alternatively:

<math>y = y_0(1 - U)(1 - V) + y_1 U (1 - V) + y_2 (1 - U) V + y_3 U V \,\!<math>

Which is rather convenient. However, if the image is merely scaled (and not rotated, sheared, put into perspective, or any other manipulation), it can be considerably faster to use the separate equations and store y_b (and sometimes y_a, if we are increasing the scale) for use in subsequent rows.

Limitations

Bilinear filtering is rather accurate until the scaling of the texture gets below half or above double the original size of the texture - that is, if the texture was 256 pixels in each direction, scaling it to below 128 or above 512 pixels can make the texture look bad, because of missing pixels or too much smoothness. often, mipmapping is used to provide a scaled-down version of the texture for better performance; however, the transition between two differently-sized mipmaps on a texture in perspective using bilinear filtering can be very abrupt. Trilinear filtering, though somewhat more complex, can make this transition smooth throughout.

For a quick demonstration of how a texel can be missing from a filtered texture, here's a list of numbers representing the centers of boxes from an 8-texel-wide texture, intermingled with the numbers from the centers of boxes from a 3-texel-wide texture (in blue). The red numbers represent texels that would not be used in calculating the 3-texel texture at all.

0.0625, 0.1667, 0.1875, 0.3125, 0.4375, 0.5000, 0.5625, 0.6875, 0.8125, 0.8333, 0.9375

Special Cases

Textures aren't infinite, in general, and sometimes you end up with a pixel coordinate that lies outside the grid of texel coordinates. There are a few ways to handle this:

• wrap the texture, so that the last texel in a row also comes right before the first, and the last texel in a column also comes right above the first. This works best when the texture is being tiled.
• make the area outside the texture all one color. This is probably not that great an idea, but it might work if the texture is designed to be laid over a solid background or be transparent.
• repeat the edge texels out to infinity. This works well if the texture is designed to not be repeated.

See also

• Trilinear filtering
• Anisotropic filtering