javascript library for free form drawing

Question

Is there a javascript library which lets me draw on a web page and then save the state of that drawing?

I want to draw an 2D image using the mouse and then how to store and load that drawing

Answer 1

You should look at ProcessingJS.

Answer 2

Use HTML5 Canvas. A simple example for drawing images is here: http://jsfiddle.net/ghostoy/wTmFE/1/.

I recommend this online book: Dive Into HTML5.

Answer 3

If you want the free drawing to work with touchscreens, I recommend Fabric.js:

• Demo
• Tutorial

Code:

<canvas id="c1" width="100" height="100" style="border:1px solid black;">
</canvas>

var canvas = new fabric.Canvas('c1');
canvas.isDrawingMode = true;
canvas.freeDrawingBrush.width = 5;
console.log(canvas);

See JSfiddle