rough/docs

Rough.js

This is a light weight Canvas based library that lets you draw in a sketchy, hand-drawn-like, style. The library defines primitives to draw lines, curves, arcs, polygons, circles, and ellipses. It also supports drawing SVG paths.

This project was inspired by Handy, a java based library for Processing. Rough.js borrows some core algorithms from Handy, but it is not a JS port for processing.js.

Releases

The latest Rough.js release (beta version 0.1): Download

How to use Rough.js

Setup

Initialize a RoughCanvas object by passing in the canvas node and the size of the canvas. Following code snippet draws a

var rough = new RoughCanvas(document.getElementById('myCanvas'), 500, 500);
rough.rectangle(10, 10, 200, 200);

Drawing lines and shapes

Filling

Sketching style

Arcs and Curves

SVG Paths

Dynamic shapes

API