Include the script located at dist/atrament.min.js in the
<head> tag of your HTML.
Alternatively, you can use Bower:
bower install atrament and include
bower_components/atrament/dist/atrament.min.js as a script tag.
If you're using a tool like webpack or browserify to bundle your code, you can install it using npm.
npm install --save atrament.
var atrament = require('atrament');
var Atrament = require('atrament').Atrament;
atramentpassing in the selector string of your canvas:
var sketcher = ;//or use a more object-oriented stylevar sketcher = '#mySketcher';//you can also pass the canvas Node itselfvar sketcher = document;
var sketcher = ;
sketcherweight = 20; //in pixels
sketchercolor = '#ff485e'; //just like CSS
sketchermode = 'erase'; // eraser toolsketchermode = 'fill'; // click to fill areasketchermode = 'draw'; // default
sketchersmoothing = false;
sketcheradaptiveStroke = false;
sketcheropacity = 05; //number between 0-1
//we have to get the dataURL of the imagevar dataURL = sketcher;//then we can, for instance, open a new window with itwindow;
dirtyevent – do something when the canvas becomes dirty:
// this also fires when you clear the canvas// the dirty property is then false// note that we attach the event to canvascanvas;
To obtain the dependencies,
cd into the atrament directory and run
You should be able to then build atrament by simply running
npm run build.
I didn't bother writing tests because it's such a small package. Contributions are welcome!