Directly mapping texels to pixels (direct3d 9)

Document directory

• Summary

Original article address: directly mapping texels to pixels (direct3d 9)

When rendering 2D output using pre-transformed vertices, care must be taken to ensure that each Texel area correctly corresponds to a single pixel area, otherwise texture distortion can occur. by understanding the basics of the process that direct3d follows
When rasterizing and texturing triangles, You can ensure your direct3d application correctly renders 2D output.

The preceding dimo-shows pixels that are modeled as squares. in reality, however, pixels are dots, not squares. each square in the preceding dimo-indicates the area identified by the pixel, but a pixel is always just a dot at the center of a square. this
Distinction, though seemingly small, is important. A better authentication of the same display is shown in the following diwing.

The preceding dimo-correctly shows each physical pixel as a point in the center of each cell. the screen space coordinate (0, 0) is located directly at the top-left pixel, and therefore at the center of the top-left cell. the top-left corner of the display
Is therefore at (-0.5,-0.5) because it is 0.5 cells to the left and 0.5 cells up from the top-left pixel. direct3d will render a quad With corners at (0, 0) and (4, 4), as shown in the following validation.

The preceding authentication shows where the mathematical quad is in relation to the display, but does not show what the Quad will look like once direct3d rasterizes it and sends it to the display. in fact, it is impossible for a raster display to fill
Quad exactly as shown because the edges of the quad do not coincide with the boundaries between pixel cells. in other words, because each pixel can only display a single color, each pixel cell is filled with only a single color; if the display were to render
The quad exactly as shown, the pixel cells along the quad's edge wowould need to show two distinct colors: Blue where covered by the quad and white where only the background is visible.

Instead, the graphics hardware is tasked with determining which pixels shoshould be filled to approximate the quad. This process is called Rasterization, and is detailed in
Rasterization rules (direct3d 9). For this special case, the rasterized quad is shown in the following validation.

Note that the quad passed to direct3d has corners at (0, 0) and (4, 4), but the rasterized output (the preceding authentication) has corners at (-0.5, -0.5) and (3.5, 3.5 ). compare the preceding two configurstrations for rendering differences. you can see that what
The display actually renders is the correct size, but has been shifted by-0.5 cells in the X and Y directions ctions. however, doesn t for multi-sampling techniques, this is the best possible approximation to the quad. (See
Antialias sample for thorough coverage of Multi-sampling.) be aware that if the Rasterizer filled every cell the quad crossed, the resulting area wocould be of dimension 5x5 instead
The desired 4x4.

If you assume that screen coordinates originate at the top-left corner of the display grid instead of the top-left pixel, the quad appears exactly as expected. however, the difference becomes clear when the quad is given a texture. the following validation
Shows the 4x4 texture You'll map directly onto the quad.

Because the texture is 4x4 texels and the quad is 4x4 pixels, you might should CT the textured quad to appear exactly like the texture regardless of the location on the screen where the quad is drawn. however, this is not the case; even slight changes in
Position influence how the texture is displayed. The following procedure shows how a quad between (0, 0) and (4, 4) is displayed after being rasterized and textured.

The quad drawn in the preceding authentication shows the textured output (with a linear filtering mode and a clamp addressing mode) with the superimposed rasterized outline. the rest of this article explains exactly why the output looks the way it does instead
Of looking like the texture, but for those who want the solution, here it is: the edges of the input quad need to lie upon the boundary lines between pixel cells. by simply shifting the X and Y quad coordinates by-0.5 units, Texel cells will perfectly cover
Pixel cells and the quad can be perfectly recreated on the screen. (The last authentication in this topic shows the quad at the corrected coordinates .)

The details of why the rasterized output only bears slight resecreance to the input texture are directly related to the way direct3d addresses and samples textures. What follows assumes you have a good understanding
Texture coordinate space and
Bilinear texture filtering.

Getting back to our investigation of the strange pixel output, it makes sense to trace the output color back to the pixel shader: the pixel shader is called for each pixel selected to be part of the rasterized shape. the solid blue quad depicted in an earlier
Authorization cocould have a particle ly simple shader:

float4 SolidBluePS() : COLOR{ return float4( 0, 0, 1, 1 );} 

For the textured quad, the pixel shader has to be changed slightly:

texture MyTexture;sampler MySampler = sampler_state { Texture = <MyTexture>;MinFilter = Linear;MagFilter = Linear;AddressU = Clamp;AddressV = Clamp;};float4 TextureLookupPS( float2 vTexCoord : TEXCOORD0 ) : COLOR{return tex2D( MySampler, vTexCoord );} 

That Code assumes the 4x4 texture is stored in mytexture. as shown, the mysampler texture sampler is set to perform bilinear filtering on mytexture. the pixel shader gets called once for each rasterized pixel, and each time the returned color is the sampled
Texture color at vtexcoord. each time the pixel shader is called, The vtexcoord argument is set to the texture coordinates at that pixel. that means the shader is asking the texture sampler for the filtered texture color at the exact location of the pixel,
As detailed in the following validation.

The texture (shown superimposed) is sampled directly at pixel locations (shown as black dots ). texture coordinates are not affected by Rasterization (they remain in the projected screen-space of the original quad ). the black dots show where the Rasterization
Pixels are. the texture coordinates at each pixel are easily determined by interpolating the coordinates stored at each vertex: The pixel at (0, 0) coincides with the vertex at (0, 0); therefore, the texture coordinates at that pixel are simply the texture
Coordinates stored at that vertex, UV (0.0, 0.0 ). for the pixel at (3, 1), the interpolated coordinates are UV (0.75, 0.25) because that pixel is located at three-fourths of the texture's width and one-fourth of its height. these interpolated coordinates are
What get passed to the pixel shader.

The texels do not line up with the pixels in this example; each pixel (and therefore each sampling point) is positioned at the corner of four texels. because the filtering mode is set to linear, the sampler will average the colors of the four texels sharing
That corner. this explains why the pixel expected to be red is actually three-fourths gray plus one-fourth red, the pixel expected to be Green is one-half gray plus one-fourth red plus one-fourth green, and so on.

To fix this problem, all you need to do is correctly map the quad to the pixels to which it will be rasterized, and thereby correctly map the texels to pixels. the following validation shows the results of drawing the same quad between (-0.5,-0.5) and
(3.5, 3.5), which is the quad intended from the outset.

The preceding authentication demonstrates that the Quad (shown outlined from (-0.5,-0.5) to (3.5, 3.5) exactly matches the rasterized area.

Summary

In summary, pixels and texels are actually points, not solid blocks. screen Space originates at the top-left pixel, but texture coordinates originate at the top-left corner of the texture's grid. most importantly, remember to subtract 0.5 units from
X and Y components of your vertex positions when working in transformed screen space in order to correctly align texels with pixels.

The following code is an example of offsetting the vertices of a 256 by 256 square to properly display a 256 by 256 texture in transformed screen space.