Coordinates and Raster

NDC to Screen Mapping

Map a point from normalized device coordinates to screen coordinates, then choose the pixel cell.

ndc-to-screen-mapping This lesson uses NDC values in [-1,1]. The viewport transform maps them to screen space, with y flipped downward for raster rows.

Example

Map normalized device coordinates to screen space, then choose a pixel.

highlighted = computed this step

Step 1 — Set up NDC mapping

Use NDC in the standard square before mapping.

NDC square before viewport mapping\text{NDC square before viewport mapping}
NDC mapped pixelThe NDC point maps to screen pixel row 3, column 5.01234567012345P

Step 2 — Read the NDC point

Read the NDC point coordinates.

Pndc=(12,−13)P_{ndc}=( \hlmath{\frac{1}{2}} , \hlmath{\frac{-1}{3}} )

Step 3 — Map x to screen space

Map x from NDC to screen space.

xs=(12+1)/2⋅7=214x_s=( \frac{1}{2} + 1 )/ 2 \cdot 7 = \hlmath{\frac{21}{4}}

Step 4 — Map y down to screen space

Map y down from NDC to screen space.

ys=(1−−13)/2⋅5=103y_s=( 1 - \frac{-1}{3} )/ 2 \cdot 5 = \hlmath{\frac{10}{3}}

Step 5 — Floor to the pixel

Floor the mapped point to a pixel.

pixel=(3,5)pixel=( \hl{3} , \hl{5} )
NDC mapped pixelThe NDC point maps to screen pixel row 3, column 5.01234567012345P