mocanvasv4.11.2

OverlayManager

declare class OverlayManager extends EditorManager

The registry of canvas overlays.

v5 draws the brush, the scribbles, the snap lines, the handles and the shape indicators into one 2D canvas above the scene rather than as React elements. This manager is what owns those painters: it holds the utils, decides the order they paint in, and answers which overlay the pointer is over — the thing a tool needs in order to let a click land on a handle rather than on the shape behind it.

Reach it as editor.overlays. Utils are ordinary OverlayUtil subclasses; register them at construction or with register.

On this page

constructor dispose getActiveOverlayEntries getCurrentOverlays getHoveredOverlay getHoveredOverlayId getOverlayAtPoint getOverlayGeometry getOverlayUtilsInZOrder registerUtil render renderMinimap setHoveredOverlay unregisterUtil getOverlayUtil

Methods · 14

constructor(editor: Editor, utils?: readonly TLAnyOverlayUtilConstructor[])

dispose(): void

getActiveOverlayEntries(): OverlayEntry[]

The same, paired with the util each one came from.

getCurrentOverlays(): TLOverlay[]

The overlays that want drawing right now, back to front.

A util that says it is not active contributes nothing, and one that names no overlays contributes a single implicit overlay with its own type as the id — enough for a util that only paints and is never pointed at.

getHoveredOverlay(): TLOverlay | undefined

The hovered overlay, or undefined when nothing is hovered.

getHoveredOverlayId(): string | null

Id of the hovered overlay, or null.

getOverlayAtPoint(point: VecLike, margin?: number): OverlayEntry | undefined

The topmost overlay under a page-space point, or undefined.

Front-to-back, so the overlay painted last is the one that answers — the same rule the eye applies.

getOverlayGeometry(overlay: TLOverlay): Geometry2d | undefined

The geometry an overlay can be pointed at through, if it has any.

getOverlayUtilsInZOrder(): OverlayUtil<Editor>[]

Every util, back to front. Painting in this order and hit-testing in the reverse of it is what makes the topmost overlay the one you click.

registerUtil(Util: TLAnyOverlayUtilConstructor): OverlayUtil<Editor>

Add an overlay util. Registering a type that is already present replaces it — which is how an app overrides one of the built-ins — and disposes the one it displaced.

render(ctx: CanvasRenderingContext2D): void

Paint every active overlay into ctx, back to front.

ctx arrives in screen space; applying the camera is each util's own job, because some overlays live in screen space (a handle, a brush outline) and some in page space (a shape indicator).

renderMinimap(ctx: CanvasRenderingContext2D): void

The minimap pass: only utils that opt in by implementing renderMinimap.

setHoveredOverlay(overlay: TLOverlay | string | null): this

Set (or clear, with null) the hovered overlay.

unregisterUtil(type: string): void

Remove an overlay util by type.

Properties · 1

getOverlayUtil<U extends OverlayUtil<Editor> = OverlayUtil<Editor>>(type: string): U | undefined

The util registered under type, or undefined.

Mentioned here

OverlayUtil

All of @mocanvas/editor Guides Demos

mocanvas

Docs Licensing mocanvas@symbio.agency

mocanvas is built by Symbio. Free for non-commercial, non-profit and development use; commercial use needs an agreement. Not affiliated with or endorsed by tldraw.