Summary
Add setLineDash(), getLineDash(), and lineDashOffset to the renderer API, matching the Canvas 2D API.
Requirements
setLineDash(segments) — set the dash pattern (array of on/off lengths)getLineDash() — return the current dash patternlineDashOffset — offset for where the dash pattern starts- Available on both Canvas and WebGL renderers
Use Cases
- Debug drawing (collision shapes, grid lines, bounding boxes)
- Range/radius indicators in strategy games
- UI elements (selection borders, focus indicators)
- Path previews in level editors
Approach
Canvas renderer: Direct pass-through to ctx.setLineDash() / ctx.getLineDash() / ctx.lineDashOffset.
WebGL renderer: Implement in the primitive batcher. When drawing lines, compute cumulative distance along the line segments, then use the dash pattern array to alternate between drawing and skipping segments. Store the dash state alongside the existing lineWidth / lineJoin properties. The batcher emits geometry only for the "on" portions of the dash pattern.
Summary
Add
setLineDash(),getLineDash(), andlineDashOffsetto the renderer API, matching the Canvas 2D API.Requirements
setLineDash(segments)— set the dash pattern (array of on/off lengths)getLineDash()— return the current dash patternlineDashOffset— offset for where the dash pattern startsUse Cases
Approach
Canvas renderer: Direct pass-through to
ctx.setLineDash()/ctx.getLineDash()/ctx.lineDashOffset.WebGL renderer: Implement in the primitive batcher. When drawing lines, compute cumulative distance along the line segments, then use the dash pattern array to alternate between drawing and skipping segments. Store the dash state alongside the existing
lineWidth/lineJoinproperties. The batcher emits geometry only for the "on" portions of the dash pattern.