viewportCoordinate
Provides the local coordinate of the current pixel relative to the bottom-left corner of its rendering viewport, where the origin is always (0,0).
Core Advantages
It provides a local coordinate system relative to the viewport, making the implementation of effects like gradients or UI layouts independent of the viewport's actual position on the screen, greatly simplifying shader logic and enhancing code modularity and reusability.
Common Uses
Generating standardized viewport UV coordinates
Drawing viewport borders or grid lines
Creating radial effects (e.g., radar scan)
How to adjust
This is a read-only node with no parameters. Its effect is 'adjusted' by applying mathematical operations in the shader to its output coordinate vector (e.g., multiplication to scale patterns, or functions to warp coordinates) to achieve various screen-space patterns and distortions.
Code Examples
1// Divide the viewport-relative pixel coordinate by the viewport size to get normalized UVs [0, 1].
2const viewportUV = viewportCoordinate.div( viewport.zw );
3
4// Use the UVs to create a gradient from bottom-left (black) to top-right (yellow)
5return vec3( viewportUV.x, viewportUV.y, 0 );