OSS 가이드

이 화면은 https://github.com/szimek/signature_pad 사이트에서 제공하는 라이브러리 샘플 화면이다.

signature_pad 라이브러리는 HTML canvas 오브젝트 기반으로 서명을 처리하기 위한 기능을 제공한다.

템플릿 위치: /HTML5/OSS/signaturepad_basic

템플릿 파일

        
          
          
              
              // SignaturePad 오브젝트
this.signaturePad = null;
 
// "1. loadjs" 버튼 이벤트
function btn_loadjs_on_click(objInst)
{
    // 라이브러리 로드 (프로젝트 환경에 따라 경로를 달라질 수 있음)
    screen.loadjs("./ext/lib/signature_pad.umd.min.js");
}
 
// "2. create" 버튼 이벤트
function btn_create_on_click(objInst)
{
    var canvas;
 
    canvas = this.cvs_sign.getdom();
    this.signaturePad = new SignaturePad(canvas);
}
 
// "3. dataurl" 버튼 이벤트
function btn_data_url_on_click(objInst)
{
    var image_data = this.signaturePad.toDataURL();
 
    this.img.setimagedata(image_data);
}
 
// "clear" 버튼 이벤트
function btn_clear_on_click(objInst)
{
    this.signaturePad.clear();
}
 
// "undo" 버튼 이벤트
function btn_undo_on_click(objInst)
{
    var data = this.signaturePad.toData();
    if (data) {
        data.pop(); // remove the last dot or line
        this.signaturePad.fromData(data);
    }
}

            

        
      

signature pad 기본 가이드

예시

화면 스크립트