Direction describes the orientation of movement relative to a reference axis. In UI work, a vector pairs direction with distance: [x, y] means how far an element moves horizontally and vertically. With browser coordinates, x increases rightward and y increases downward, so adding [50, 20] to (100, 100) produces (150, 120). section 10.1
Use direction calculations to connect geometry with interface behavior:
- Represent a displacement as an [x, y] vector rather than an unspecified movement. section 10.1
- Find the direction between two points with Math.atan2(), after measuring their coordinate differences. section 13.5
Pointer direction in a gesture
Read event.clientX and event.clientY relative to the viewport, convert them to an element’s local coordinates by subtracting its bounding-rectangle offsets, then use Math.atan2() to determine the pointer’s direction. The resulting angle can drive a slider, animation, or other interactive response. section 13.5
