I was recently asked about coordinate systems used in WebGL, so I decided to summarize them below:
There are six coordinate systems in WebGL:
Local space: an object made up of vertices has its own coordinate system, which is used to define the the position of its vertices relative to the object itself.
World space: The one consisting of all its objects, which is used for to define the position of an object within the scene
View space: It represent the field of view of a camera.similar to how human eyes perceive the world.
Clip space: a space defined by a specific viewing area
NDC(Normal Device Coordinate) space: a normalized space where coordinates range from -1 to 1 on the x and y axes.
Screen space: it is a final 2D space where objects are rendered onto the WebGL canvas.
Vertex postion is always represented by a four-dimensional vector (x, y, z, w) before being transformed into NDC space.
gl_position is sent to NDC space that uses left-handed coordinate system, and is then transformed into right-handed coordinate system through the multiplication of Model-View-Projection(mvp) matrix and gl_position
there is an illustration showing the transformation between coordinate systems in WebGL Programming Guide
Top comments (0)