Signature Pad

Signature Pad is a jQuery plugin that takes advantage of HTML5 canvas element and javascript to create a flexible and smooth Signature Pad on your web page & app. For more details

HTML Code
<canvas id="visitsignature" #signaturePad class="roundCorners"
style="position: relative; margin: 0; padding: 0; max-width:100%"></canvas>
Script

import SignaturePad from 'signature_pad'
export class DoctorVisitComponent implements OnInit, AfterViewInit {

  public isCollapsed = false;
  public timeOptions: FlatpickrOptions = {
    enableTime: true,
    noCalendar: true,
  };
  public signaturePad: any;
  @ViewChild('signaturePad', {static: false}) signaturePadCanvas!: ElementRef
  ngOnInit(): void {
  }
  ngAfterViewInit(): void {
    this.signaturePad = new SignaturePad(this.signaturePadCanvas.nativeElement, {
      backgroundColor: 'rgb(233, 236, 239)'
  });
  }
  public clear() {
    this.signaturePad.clear();
  }
}
Previous Next