JSignature的使用

項目地址

• https://github.com/brinley/jSignature

demo地址

• http://willowsystems.github.io/jSignature/#/demo/

初始化

    <script type="text/javascript" src="path/to/flashcanvas.js"></script>
    <script src="path/to/jSignature.min.js"></script>
    <script> 
    (document).ready(function() {
        $("#signature").jSignature()
    })
    </script>

getData

• 獲得canvas上的圖像數據，推薦使用 base30格式，相對於其他格式，存儲數據量要小上許多
  base30 = $("#signature").jSignature("getData", "base30");

setData

• 將圖像數據賦給canvas

updatesetting

• 更新設置，如：lineWidth, color, background-color, decor-color, showUndoButton, data, signatureLine
  $("#signature").jSignature("updateSetting", param, val, forFuture);

格式與數據結構的對應關系

• JSignature instance的數據結構為 {type: type, data:data}
• 格式如下:
  | types| data string |
  |:-😐:-😐
  | image| 'image/png;base64' |
  | image/svg+xml;base64 | 'image/svg+xml;base64' |
  | image/svg+xml | 'image/svg+xml' |
  | svg | 'image/svg+xml' |
  | svgbase64 | 'image/svg+xml;base64' |

base30

• using the Arabic numerals 0-9 and the Latin letters A-T

如果您在使用JSignature的過程中有任何問題，歡迎留言討論