responsive-sketchpad
TypeScript icon, indicating that this package has built-in type declarations

1.3.0 • Public • Published

Responsive-Sketchpad

npm version Build

A completely responsive, HTML5 canvas sketchpad for use on desktop and mobile browsers with no dependencies.

Demo

Installation

npm install responsive-sketchpad

Follow node-canvas setup instructions

Example Usage

<!-- index.html -->
<html>
  <head>
    <script src="script.js" async></script>
  </head>
  <body>
    <div id="sketchpad"></div>
  </body>
  <!-- Can also include global bindings if not using JS modules -->
  <!-- <script src="sketchpad.js"></script> -->
</html>
// script.js
var Sketchpad = require('responsive-sketchpad');

// Initialize Sketchpad
var el = document.getElementById('sketchpad');
var pad = new Sketchpad(el, {
    line: {
        color: '#f44335',
        size: 5
    }
});

// Set line color
pad.setLineColor('#f44336');

// Set line size
pad.setLineSize(10);

// Undo
pad.undo();

// Redo
pad.redo();

// Clear canvas
pad.clear();

// Resize canvas
pad.resize(100);

// Make read only
pad.setReadOnly(true);

Package Sidebar

Install

npm i responsive-sketchpad

Weekly Downloads

49

Version

1.3.0

License

MIT

Unpacked Size

35.9 kB

Total Files

6

Last publish

Collaborators

  • tsanders