materialLineDashOffset
Provides access to the material's dash offset, used within the TSL node graph to read or drive the starting position of a dashed line pattern.
Core Advantages
Exposes the dash offset to the TSL node graph, allowing it to be programmatically controlled on the GPU by other nodes (like time or noise), enabling easy implementation of dynamic and interactive dashed line animations without manual CPU-side updates.
Common Uses
Creating scrolling dashed line animations by connecting a time node, to represent data flow or travel routes.
Changing the offset based on user interaction state (e.g., hover) to provide visual feedback.
Simulating data transfer or loading animations by linking to a progress value.
Adding irregular jitter to stylized, hand-drawn lines by connecting a noise node.
How to adjust
This node itself is read-only. To control the dash offset, provide a node (e.g., `timerLocal`, `uniform`) to the `dashOffset` property when creating a `lineDashedMaterial`. Changing this input node's value will cause the dash pattern to "scroll" or "move" along the line.
Code Examples
1// In a material definition, connect a time-varying node to the dashOffset property
2const animatedDashOffset = timerLocal( 1 ).mul( -2 ); // Scrolls 2 units per second
3
4const dashedMaterial = lineDashedMaterial( {
5 dashOffset: animatedDashOffset
6} );