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的过程中有任何问题，欢迎留言讨论