p5.tree/hud

Drawing in screen space over the scene.

Draw 2D overlays — text, cursors, gauges — on top of a WEBGL scene using plain pixel coordinates. Call beginHUD(), draw as in 2D mode with the origin at the top-left corner of the canvas, then call endHUD() to return to 3D.

Reach for it whenever a readout or a marker should sit at a fixed spot on the canvas, whatever the camera does.

p5

beginHUD()

Start drawing in screen space over the 3D scene: pixel coordinates with the origin at the top-left corner of the canvas, as in 2D mode. Pair every call with endHUD() (see the frame-rate example). Needs a WEBGL canvas; text needs a loaded font.

Returns p5 this

Frame-rate readout over a 3D scene

endHUD()

End HUD mode, restoring the 3D camera and depth state.

Returns p5 this

3D drawing resumes after endHUD()