Lightweight Touchable Angular Whiteboard Library

Author: mostafazke
Official Page: Go to website
Publish Date: April 30, 2020
License: MIT

Description:

A lightweight, customizable, touch-enabled whiteboard for online drawing & signature applications.

Based on SVG and downloadable as SVG/PNG/JPG files.

How to use it:

1. Install the package and import the NgWhiteboardModule.

# NPM
$ npm install ng-whiteboard --save
import { NgWhiteboardModule } from 'ng-whiteboard';
@NgModule({
  imports: [
    NgWhiteboardModule
  ]
  ...
)}

2. Add the whiteboard to your app template.

<ng-whiteboard></ng-whiteboard>

3. Possible options.

@Input() color: string;
@Input() backgroundColor: string;
@Input() size: string;
@Input() linejoin: 'miter' | 'round' | 'bevel' | 'miter-clip' | 'arcs';
@Input() linecap: 'butt' | 'square' | 'round';
@Input() whiteboardOptions: WhiteboardOptions = new WhiteboardOptions();

4. Methods.

@Output() init = new EventEmitter();
@Output() clear = new EventEmitter();
@Output() undo = new EventEmitter();
@Output() redo = new EventEmitter();
@Output() save = new EventEmitter<string | Blob>();
@Output() imageAdded = new EventEmitter();

Preview:

Lightweight Touchable Angular Whiteboard Library


You Might Be Interested In:

Add Comment