Core API Reference

1. The onpaint Event Hook

The browser triggers the onpaint callback inside the Canvas element tree whenever a nested DOM node changes state, gains focus, or needs rendering updates.

2. Canvas2DContext: drawElementImage

Draws an HTML DOM subtree at coordinate offsets and returns the DOMMatrix representation of the layout.

// Syntax
DOMMatrix ctx.drawElementImage(Element element, double x, double y);

// Usage example inside paint loop
canvas.onpaint = () => {
  ctx.reset();
  const matrix = ctx.drawElementImage(myElement, 10, 10);
  myElement.style.transform = matrix.toString(); // Map event coordinates
};