Dessin

Introdution

Dessin is an HTML5 canvas render library witch is lightweight and clever. You can draw a rectangle, a circle even a text to use dessin. Here is a demo

Fetures

• Completely canvas based rendering
• Supports text, rectangles, circles, and more...
• Chain API
• Import and export JSON data

Install

npm i dessin

Getting Started

import { Canvas, Text, Rect, Circle } from 'dessin';

let canvasView = document.getElementById('canvas');
let canvas = new Canvas({ canvas: canvasView });
let text = new Text({
  texts: ['hollo world', 'I am Yukiniro'],
  fillColor: '#FF0000',
  x: 100,
  y: 200,
});
let rect = new Rect({
  x: 20,
  y: 20,
  width: 120,
  height: 100,
  fillColor: '#0F0',
});
let circle = new Circle({
  x: 150,
  y: 20,
  radius: 30,
  fillColor: '#00F',
});
canvas.add(text);
canvas.add(rect);
canvas.add(circle);
canvas.render();