@jianghh/canvas-graffiti
Version:
canvas涂鸦库,支持手写、笔写、鼠标,选中元素,并且移动、删除等功能。集成撤销重做操作。
2 lines (1 loc) • 1.29 kB
JavaScript
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("../element/index.js"),s=require("../utils/index.js"),c={buffer:!0,pointerdown({offsetX:t,offsetY:i}){this.bufferCtx.moveTo(t,i),this.points.push({x:s.roundToNDecimalPlaces(t),y:s.roundToNDecimalPlaces(i)})},pointermove({offsetX:t,offsetY:i}){this.bufferCtx.clearRect(0,0,this.el.width,this.el.height),this.bufferCtx.beginPath(),this.bufferCtx.arc(this.beginPoint.x,this.beginPoint.y,Math.abs(t-this.beginPoint.x),0,2*Math.PI),this.endPoint={x:t,y:i},this.bufferCtx.stroke()},pointerup(){if(this.endPoint){this.points.push({x:s.roundToNDecimalPlaces(this.endPoint.x),y:s.roundToNDecimalPlaces(this.endPoint.y)}),this.ctx.beginPath();const t=this.points[0],i=this.points[1],e=Math.abs(i.x-t.x);this.ctx.arc(t.x,t.y,e,0,2*Math.PI),this.ctx.stroke();const o=t.x<i.x?t.x-e:i.x,n=t.y-e,h=t.x<i.x?i.x:t.x+e,r=t.y+e;this.graffitiEleList.push(new l.GraffitiEle({tool:"Arc",left:o,top:n,right:h,bottom:r,points:this.points,shadowColor:this.shadowColor,lineWidth:this.lineWidth,shadowBlur:this.shadowBlur,strokeStyle:this.strokeStyle,fillStyle:this.fillStyle}))}},drawEle(t){let i=t[0],e=t[1];this.ctx.beginPath(),this.ctx.arc(i.x,i.y,Math.abs(e.x-i.x),0,2*Math.PI),this.ctx.stroke()}};exports.Arc=c;