DOM

Use the dom plugin to use a DOM element as the artboard.

Requirements

• The root element should be position: relative (or anything that creates a new stacking context such as absolute or fixed)
• The artboard element must be position: absolute and anchored to the top left

Minimal Example

<div id="root">
  <div id="artboard">Hello World!</div>
</div>

#root {
  position: relative;
  width: 500px;
  height: 500px;
}

#artboard {
  background: white;
}

import { createArtboard, dom, mouse, wheel, raf } from 'artboard-deluxe'

const artboard = createArtboard(document.getElementById('root'), [
  dom({ element: document.getElementById('artboard') }),
  mouse(),
  wheel(),
  raf(),
])