jQuery基于canvas画布获取图片文件，利用钢笔工具点到点绘制图片轮廓，可拖动点来调整，进行抠图裁剪下载等功能。这是一款仿ps钢笔图片抠图工具代码。
使用方法：
1、head引入css文件
<link href="css/penCutout.css" rel="stylesheet"/>
2、head引入js文件
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/penCutout.js"></script>
<script type="text/javascript">
$(function () {
// 使用（通过init方法覆盖默认属性，并初始化事件）
var _penCutout = new penCutout();
_penCutout.init({
//覆盖属性
drawPanel: "drawPanel",
imgSrc: "file/target.jpg",
penColor: "#ff40ef",
width: 400,
height: 400
});
//事件
$("#btnPoints").click(function () {
alert(JSON.stringify(_penCutout.can.pointList));
})
$("#btnCut").click(function () {
_penCutout.createCutImg(function (imgSrcData, w, h) {
$("#imgCutShow").attr("src", imgSrcData).css({"display": "block", "width": w, "height": h});
})
})
$("#btnDown").click(function () {
_penCutout.downLoad();
})
$("#redo").click(function () {
_penCutout.ReDo();
})
})
</script>
3、body引入HTML代码
<div class="canvasDiv" id="drawPanel"></div>
<div class="tools">
<input type="button" value="坐标" id="btnPoints">
<input type="button" value="重做" id="redo"/>
<input type="button" value="裁剪" id="btnCut"/>
<input type="button" value="下载" id="btnDown"/>
</div>
<img id="imgCutShow">
