art

Cross-browser Vector Graphics

Usage no npm install needed!

<script type="module">
  import art from 'https://cdn.skypack.dev/art';
</script>

README

ART

ART is a retained mode vector drawing API designed for multiple output modes. There's also a built-in SVG parser. It uses Node style CommonJS modules.

The first line in your program should select rendering mode by requiring either:

  • art/modes/canvas - HTML5 Canvas
  • art/modes/svg - SVG for modern browsers and vector tools
  • art/modes/vml - VML for Internet Explorer or Office
  • art/modes/script - Code generation for ART modules
  • art/modes/dom - SVG or VML depending on environment
  • art/modes/fast - Canvas, SVG or VML depending on environment

These modules exposes four core rendering classes:

  • Surface - Required rectangular rendering area. Container for the rest.
  • Group - Container for Shapes, Text or other Groups.
  • Shape - Fill and/or stroke an arbitrary vector path.
  • Text - Fill and/or stroke text content rendered using native fonts.

There are also helper classes to work with vector paths, 3x3 transformation matrices, colors, morphing, common shapes etc.

Demos

See ./demos