Live primitives

APIs you can click

This chrome is a nested layout chain. Desk pages sit in two shells; Motion, Canvas, and Errors use the outer shell. Sibling navigations keep parent controllers mounted.

nc-canvas

HiDPI-aware canvas with three modes. Use draw or signature for pointer input, or static and call getContext() from a controller.

API: /api/components/nc-canvas. Catalog: /components.

Draw

<nc-canvas mode="draw" height="240"></nc-canvas>

Live example

Signature

<nc-canvas mode="signature" height="160" placeholder="Sign here"></nc-canvas>

Live example

Static (controller draw)

<nc-canvas ref="chartCanvas" mode="static" height="180"></nc-canvas> const ctx = this.chartCanvas.getContext(); ctx.fillStyle = '#2dd4bf'; ctx.fillRect(24, 24, 80, 80);

Live example

Stamp a square Clear