canvas-to-mark/dist/index.js

一个小范围使用的canvas图片标注小工具

!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t="undefined"!=typeof globalThis?globalThis:t||self).CanvasToMark=e()}(this,(function(){"use strict";
/*! *****************************************************************************
    Copyright (c) Microsoft Corporation.

    Permission to use, copy, modify, and/or distribute this software for any
    purpose with or without fee is hereby granted.

    THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
    REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
    AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
    INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
    LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
    OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
    PERFORMANCE OF THIS SOFTWARE.
    ***************************************************************************** */var t=function(e,i){return t=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i])},t(e,i)};function e(e,i){if("function"!=typeof i&&null!==i)throw new TypeError("Class extends value "+String(i)+" is not a constructor or null");function a(){this.constructor=e}t(e,i),e.prototype=null===i?Object.create(i):(a.prototype=i.prototype,new a)}function i(t,e,i,a){return new(i||(i=Promise))((function(n,r){function o(t){try{c(a.next(t))}catch(t){r(t)}}function s(t){try{c(a.throw(t))}catch(t){r(t)}}function c(t){var e;t.done?n(t.value):(e=t.value,e instanceof i?e:new i((function(t){t(e)}))).then(o,s)}c((a=a.apply(t,e||[])).next())}))}function a(t,e){var i,a,n,r,o={label:0,sent:function(){if(1&n[0])throw n[1];return n[1]},trys:[],ops:[]};return r={next:s(0),throw:s(1),return:s(2)},"function"==typeof Symbol&&(r[Symbol.iterator]=function(){return this}),r;function s(r){return function(s){return function(r){if(i)throw new TypeError("Generator is already executing.");for(;o;)try{if(i=1,a&&(n=2&r[0]?a.return:r[0]?a.throw||((n=a.return)&&n.call(a),0):a.next)&&!(n=n.call(a,r[1])).done)return n;switch(a=0,n&&(r=[2&r[0],n.value]),r[0]){case 0:case 1:n=r;break;case 4:return o.label++,{value:r[1],done:!1};case 5:o.label++,a=r[1],r=[0];continue;case 7:r=o.ops.pop(),o.trys.pop();continue;default:if(!(n=o.trys,(n=n.length>0&&n[n.length-1])||6!==r[0]&&2!==r[0])){o=0;continue}if(3===r[0]&&(!n||r[1]>n[0]&&r[1]<n[3])){o.label=r[1];break}if(6===r[0]&&o.label<n[1]){o.label=n[1],n=r;break}if(n&&o.label<n[2]){o.label=n[2],o.ops.push(r);break}n[2]&&o.ops.pop(),o.trys.pop();continue}r=e.call(t,o)}catch(t){r=[6,t],a=0}finally{i=n=0}if(5&r[0])throw r[1];return{value:r[0]?r[1]:void 0,done:!0}}([r,s])}}}function n(t,e){var i="function"==typeof Symbol&&t[Symbol.iterator];if(!i)return t;var a,n,r=i.call(t),o=[];try{for(;(void 0===e||e-- >0)&&!(a=r.next()).done;)o.push(a.value)}catch(t){n={error:t}}finally{try{a&&!a.done&&(i=r.return)&&i.call(r)}finally{if(n)throw n.error}}return o}function r(t,e){for(var i=0,a=e.length,n=t.length;i<a;i++,n++)t[n]=e[i];return t}var o=function(t,e,i,a){this.label="",this.coor=[],this.strokeStyle="",this.fillStyle="",this.labelFillStyle="",this.labelFont="",this.active=!1,this.creating=!1,this.dragging=!1,this.uuid=function(){for(var t=[],e="0123456789abcdef",i=0;i<36;i++)t[i]=e.substr(Math.floor(16*Math.random()),1);return t[14]="4",t[19]=e.substr(3&t[19]|8,1),t[8]=t[13]=t[18]=t[23]="-",t.join("")}();var n=i.strokeStyle,r=i.fillStyle,o=i.labelFillStyle,s=i.labelFont;this.index=t,this.label=e,this.strokeStyle=n,this.fillStyle=r,this.labelFillStyle=o,this.labelFont=s,a&&(this.uuid=a)},s=function(t){function i(e,i,a,n,r){void 0===n&&(n={});var o=t.call(this,i,a,n,r)||this;return o.type=1,o.coor=e,o}return e(i,t),Object.defineProperty(i.prototype,"ctrlsData",{get:function(){var t=n(this.coor,2),e=n(t[0],2),i=e[0],a=e[1],r=n(t[1],2),o=r[0],s=r[1];return[[i,a],[i+(o-i)/2,a],[o,a],[o,a+(s-a)/2],[o,s],[i+(o-i)/2,s],[i,s],[i,a+(s-a)/2]]},enumerable:!1,configurable:!0}),i}(o),c=function(t){function i(e,i,a,n,r){void 0===n&&(n={});var o=t.call(this,i,a,n,r)||this;return o.type=2,o.coor=e,o}return e(i,t),Object.defineProperty(i.prototype,"ctrlsData",{get:function(){return this.coor.length>2?this.coor:[]},enumerable:!1,configurable:!0}),i}(o),l=function(t){function i(e,i,a,n,r){void 0===n&&(n={});var o=t.call(this,i,a,n,r)||this;return o.type=3,o.coor=e,o}return e(i,t),i}(o),h=function(){function t(){this._eventTree={}}return t.prototype.on=function(t,e){var i=this._eventTree[t];Array.isArray(i)?i.push(e):this._eventTree[t]=[e]},t.prototype.emit=function(t){for(var e=[],i=1;i<arguments.length;i++)e[i-1]=arguments[i];var a=this._eventTree[t];Array.isArray(a)&&a.forEach((function(t){return t.apply(void 0,r([],n(e)))}))},t.prototype.off=function(t,e){var i=this._eventTree[t],a=i.find((function(t){return t===e}));Array.isArray(i)&&a&&i.splice(a,1)},t}();return function(t){function r(e,i){var a=t.call(this)||this;a.lock=!1,a.MIN_WIDTH=10,a.MIN_HEIGHT=10,a.strokeStyle="rgb(0, 0, 255)",a.fillStyle="rgba(0, 0, 255,0.1)",a.activeStrokeStyle="#f00",a.ctrlFillStyle="#fff",a.ctrlRadius=5,a.pointRadius=5,a.labelFillStyle="#fff",a.labelFontSize=12,a.labelFontColor="#000",a.labelMaxLen=5,a.rollScal=!0,a.dataset=[],a.remmberOrigin=[0,0],a.createType=0,a.ctrlIndex=-1,a.image=new Image,a.originX=0,a.originY=0,a.scaleStep=0,a.zoomCenter="canvasCenter";var n="string"==typeof e?document.querySelector(e):e;return Object.prototype.toString.call(n).includes("HTMLCanvasElement")?(a.canvas=n,a.ctx=a.canvas.getContext("2d"),a.WIDTH=a.canvas.clientWidth,a.HEIGHT=a.canvas.clientHeight,a.offlineCanvas=document.createElement("canvas"),a.offlineCanvas.width=a.WIDTH,a.offlineCanvas.height=a.HEIGHT,a.offlineCtx=a.offlineCanvas.getContext("2d"),a.initScreen(),i&&a.setImage(i)):console.warn("HTMLCanvasElement is required!"),a}return e(r,t),Object.defineProperty(r.prototype,"activeShape",{get:function(){return this.dataset.find((function(t){return t.active}))},enumerable:!1,configurable:!0}),Object.defineProperty(r.prototype,"scale",{get:function(){return this.IMAGE_ORIGIN_WIDTH&&this.IMAGE_WIDTH?this.IMAGE_WIDTH/this.IMAGE_ORIGIN_WIDTH:1},enumerable:!1,configurable:!0}),r.prototype.initScreen=function(){var t=this;this.canvas.style.userSelect="none",this.canStart=new Promise((function(e){t.imageLoaded?e(!0):t.image.addEventListener("load",(function(){t.emit("load"),t.IMAGE_ORIGIN_WIDTH=t.IMAGE_WIDTH=t.image.width,t.IMAGE_ORIGIN_HEIGHT=t.IMAGE_HEIGHT=t.image.height,t.fitZoom(),e(!0)}))})),this.canvas.addEventListener("contextmenu",(function(e){t.lock||e.preventDefault()})),this.canvas.addEventListener("mousewheel",(function(e){if(!t.lock&&t.rollScal){e.preventDefault(),t.setScale(e.deltaY<0,e);var i=Math.round(e.offsetX/t.scale),a=Math.round(e.offsetY/t.scale);t.movePoint=[i,a],t.update()}})),this.canvas.addEventListener("mousedown",(function(e){var i,a;if(!t.lock){var r=Math.round(e.offsetX/t.scale),o=Math.round(e.offsetY/t.scale),h=[e.offsetX,e.offsetY];if(2===e.buttons)t.remmberOrigin=[e.offsetX-t.originX,e.offsetY-t.originY];else if(1===e.buttons){var f=(null===(i=t.activeShape)||void 0===i?void 0:i.ctrlsData)||[];if(t.ctrlIndex=f.findIndex((function(e){return t.isPointInCircle(h,e,t.ctrlRadius)})),t.ctrlIndex>-1){var u=n(f[t.ctrlIndex],2),p=u[0],d=u[1];return void(t.remmber=[[r-p,o-d]])}var v=n(t.hitOnShape(h),2),I=v[0],y=v[1];if(2===(null===(a=t.activeShape)||void 0===a?void 0:a.type)&&t.activeShape.creating){if(t.isInBackground(e)){var g=t.activeShape,S=n(g.coor[g.coor.length-1],2),b=S[0],m=S[1];if(b!==r&&m!==o){var H=Math.round(r-t.originX/t.scale),T=Math.round(o-t.originY/t.scale);g.coor.push([H,T]),t.update()}}}else if(I>-1){if(t.emit("select",y),t.dataset.forEach((function(t,e){t.active=e===I})),y.dragging=!0,t.dataset.splice(I,1),t.dataset.push(y),t.remmber=[],3===y.type){var x=n(y.coor,2);b=x[0],m=x[1];t.remmber=[[r-b,o-m]]}else y.coor.forEach((function(e){t.remmber.push([r-e[0],o-e[1]])}));t.update()}else if(t.createType>0&&t.isInBackground(e)){var E=void 0,M=[H=Math.round(r-t.originX/t.scale),T=Math.round(o-t.originY/t.scale)];1===t.createType?(E=new s([M,M],t.dataset.length)).creating=!0:2===t.createType?(E=new c([M],t.dataset.length)).creating=!0:3===t.createType&&(E=new l(M,t.dataset.length),t.emit("add",E)),t.dataset.forEach((function(t){t.active=!1})),E.active=!0,t.dataset.push(E),t.emit("updated",E),t.update()}else t.activeShape&&(t.activeShape.active=!1,t.update())}}})),this.canvas.addEventListener("mousemove",(function(e){var i,a;if(!t.lock){var r=Math.round(e.offsetX/t.scale),o=Math.round(e.offsetY/t.scale);if(t.movePoint=[r,o],2===e.buttons&&3===e.which)t.originX=Math.round(e.offsetX-t.remmberOrigin[0]),t.originY=Math.round(e.offsetY-t.remmberOrigin[1]),t.update();else if(1===e.buttons&&t.activeShape){if(t.ctrlIndex>-1&&t.isInBackground(e)){var s=n(t.remmber,1),c=n(s[0],2),l=c[0],h=c[1];if(1===t.activeShape.type){var f=n(t.activeShape.coor,2),u=n(f[0],2),p=u[0],d=u[1],v=n(f[1],2),I=v[0],y=v[1],g=[];switch(t.ctrlIndex){case 0:g=[[r-l,o-h],[I,y]];break;case 1:g=[[p,o-h],[I,y]];break;case 2:g=[[p,o-h],[r-l,y]];break;case 3:g=[[p,d],[r-l,y]];break;case 4:g=[[p,d],[r-l,o-h]];break;case 5:g=[[p,d],[I,o-h]];break;case 6:g=[[r-l,d],[I,o-h]];break;case 7:g=[[r-l,d],[I,y]]}var S=n(g,2),b=n(S[0],2),m=b[0],H=b[1],T=n(S[1],2),x=T[0],E=T[1];x-m>=t.MIN_WIDTH&&E-H>=t.MIN_HEIGHT?t.activeShape.coor=g:t.emit("error","宽不能小于".concat(t.MIN_WIDTH,",高不能小于").concat(t.MIN_HEIGHT,"。"))}else if(2===t.activeShape.type){var M=[Math.round(r-t.originX/t.scale),Math.round(o-t.originY/t.scale)];t.activeShape.coor.splice(t.ctrlIndex,1,M)}}else if(t.activeShape.dragging){g=[];var G=!0,_=t.IMAGE_ORIGIN_WIDTH||t.WIDTH,k=t.IMAGE_ORIGIN_HEIGHT||t.HEIGHT;if(3===t.activeShape.type){var w=n(t.remmber[0],2),D=w[0];h=o-w[1];((l=r-D)<0||l>_||h<0||h>k)&&(G=!1),g=[l,h]}else for(var A=0;A<t.activeShape.coor.length;A++){var W=t.remmber[A];l=r-W[0],h=o-W[1];(l<0||l>_||h<0||h>k)&&(G=!1),g.push([l,h])}G&&(t.activeShape.coor=g)}else if(t.activeShape.creating&&1===t.activeShape.type&&t.isInBackground(e)){l=Math.round(r-t.originX/t.scale),h=Math.round(o-t.originY/t.scale);t.activeShape.coor.splice(1,1,[l,h])}t.emit("updated",t.activeShape),t.update()}else 2===(null===(i=t.activeShape)||void 0===i?void 0:i.type)&&(null===(a=t.activeShape)||void 0===a?void 0:a.creating)&&t.update()}})),this.canvas.addEventListener("mouseup",(function(e){if(!t.lock&&(t.remmber=[],t.activeShape&&(t.activeShape.dragging=!1,t.activeShape.creating&&1===t.activeShape.type))){var i=n(t.activeShape.coor,2),a=n(i[0],2),r=a[0],o=a[1],s=n(i[1],2),c=s[0],l=s[1];Math.abs(r-c)<t.MIN_WIDTH||Math.abs(o-l)<t.MIN_HEIGHT?(t.dataset.pop(),t.emit("error","宽不能小于".concat(t.MIN_WIDTH,",高不能小于").concat(t.MIN_HEIGHT))):(t.activeShape.coor=[[Math.min(r,c),Math.min(o,l)],[Math.max(r,c),Math.max(o,l)]],t.activeShape.creating=!1,t.emit("add",t.activeShape)),t.update()}})),this.canvas.addEventListener("dblclick",(function(){var e;t.lock||2===(null===(e=t.activeShape)||void 0===e?void 0:e.type)&&t.activeShape.coor.length>2&&(t.emit("add",t.activeShape),t.emit("updated",t.activeShape),t.activeShape.creating=!1,t.update())})),document.body.addEventListener("keyup",(function(e){t.lock||["Escape","Backspace"].includes(e.key)&&t.activeShape&&t.deleteByIndex(t.activeShape.index)}))},r.prototype.setImage=function(t){this.imageLoaded=!1,this.image.src=t},r.prototype.setData=function(t){return i(this,void 0,void 0,(function(){var e,i,n=this;return a(this,(function(a){switch(a.label){case 0:e=[],a.label=1;case 1:return a.trys.push([1,3,,4]),[4,this.canStart];case 2:return a.sent(),t.forEach((function(t,i){if(Object.prototype.toString.call(t).indexOf("Object")>-1){var a=t.label,r=t.type,o=t.coor,h=t.strokeStyle,f=t.fillStyle,u=t.labelFillStyle,p=t.uuid,d={strokeStyle:h,fillStyle:f,labelFillStyle:u},v=void 0;switch(r){case 1:v=new s(o,i,a,d,p);break;case 2:v=new c(o,i,a,d,p);break;case 3:v=new l(o,i,a,d,p)}e.push(v)}else n.emit("error","".concat(t," in data must be an enumerable Object."))})),this.dataset=e,this.update(),[3,4];case 3:return i=a.sent(),this.emit("error",i),[3,4];case 4:return[2]}}))}))},r.prototype.hitOnShape=function(t){var e=this,i=-1,a=this.dataset.reduceRight((function(a,n,r){return a||(3===n.type&&e.isPointInCircle(t,n.coor,e.pointRadius)||1===n.type&&e.isPointInRect(t,n.coor)||2===n.type&&e.isPointInPolygon(t,n.coor))&&(i=r,a=n),a}),null);return[i,a]},r.prototype.isInBackground=function(t){var e=t.offsetX/this.scale,i=t.offsetY/this.scale;return e>=this.originX/this.scale&&i>=this.originY/this.scale&&e<=this.originX/this.scale+this.IMAGE_ORIGIN_WIDTH&&i<=this.originY/this.scale+this.IMAGE_ORIGIN_HEIGHT},r.prototype.isPointInRect=function(t,e){var i=this,a=n(t,2),r=a[0],o=a[1],s=n(e.map((function(t){return t.map((function(t){return t*i.scale}))})),2),c=n(s[0],2),l=c[0],h=c[1],f=n(s[1],2),u=f[0],p=f[1];return l+this.originX<=r&&r<=u+this.originX&&h+this.originY<=o&&o<=p+this.originY},r.prototype.isPointInPolygon=function(t,e){var i=this;this.offlineCtx.save(),this.offlineCtx.clearRect(0,0,this.WIDTH,this.HEIGHT),this.offlineCtx.translate(this.originX,this.originY),this.offlineCtx.beginPath(),e.forEach((function(t,e){var a=n(t.map((function(t){return Math.round(t*i.scale)})),2),r=a[0],o=a[1];0===e?i.offlineCtx.moveTo(r,o):i.offlineCtx.lineTo(r,o)})),this.offlineCtx.closePath(),this.offlineCtx.fill();var a=this.offlineCtx.getImageData(0,0,this.WIDTH,this.HEIGHT),r=(t[1]-1)*this.WIDTH*4+4*t[0];return this.offlineCtx.restore(),0!==a.data[r+3]},r.prototype.isPointInCircle=function(t,e,i){var a=this,r=n(t,2),o=r[0],s=r[1],c=n(e.map((function(t){return t*a.scale})),2),l=c[0],h=c[1];return Math.sqrt(Math.pow(l-(o-this.originX),2)+Math.pow(h-(s-this.originY),2))<=i},r.prototype.drawRect=function(t){var e=this;if(2===t.coor.length){var i=t.labelFillStyle,a=t.strokeStyle,r=t.fillStyle,o=t.active,s=t.creating,c=t.coor,l=t.label,h=n(c.map((function(t){return t.map((function(t){return Math.round(t*e.scale)}))})),2),f=n(h[0],2),u=f[0],p=f[1],d=n(h[1],2),v=d[0],I=d[1];this.ctx.save(),this.ctx.fillStyle=r||this.fillStyle,this.ctx.strokeStyle=o||s?this.activeStrokeStyle:a||this.strokeStyle;var y=v-u,g=I-p;this.ctx.strokeRect(u,p,y,g),s||this.ctx.fillRect(u,p,y,g),this.ctx.restore();var S=[c[0][0]+(c[1][0]-c[0][0])/2,c[0][1]+(c[1][1]-c[0][1])/2];this.drawLabel(S,l,i)}},r.prototype.drawPolygon=function(t){var e=this,i=t.labelFillStyle,a=t.strokeStyle,r=t.fillStyle,o=t.active,s=t.creating,c=t.coor,l=t.label;if(this.ctx.save(),this.ctx.fillStyle=r||this.fillStyle,this.ctx.strokeStyle=o||s?this.activeStrokeStyle:a||this.strokeStyle,this.ctx.beginPath(),c.forEach((function(t,i){var a=n(t.map((function(t){return Math.round(t*e.scale)})),2),r=a[0],o=a[1];0===i?e.ctx.moveTo(r,o):e.ctx.lineTo(r,o)})),s){var h=n(this.movePoint.map((function(t){return Math.round(t*e.scale)})),2),f=h[0],u=h[1];this.ctx.lineTo(f-this.originX,u-this.originY)}else c.length>2&&this.ctx.closePath();this.ctx.fill(),this.ctx.stroke(),this.ctx.restore(),this.drawLabel(c[0],l,i)},r.prototype.drawDot=function(t){var e=this,i=t.labelFillStyle,a=t.strokeStyle,r=t.fillStyle,o=t.active,s=t.coor,c=t.label,l=n(s.map((function(t){return t*e.scale})),2),h=l[0],f=l[1];this.ctx.save(),this.ctx.fillStyle=r||this.ctrlFillStyle,this.ctx.strokeStyle=o?this.activeStrokeStyle:a||this.strokeStyle,this.ctx.beginPath(),this.ctx.arc(h,f,this.pointRadius,0,2*Math.PI,!0),this.ctx.fill(),this.ctx.arc(h,f,this.pointRadius,0,2*Math.PI,!0),this.ctx.stroke(),this.ctx.restore();var u=[s[0],s[1]+1*(this.pointRadius+2)/this.scale];this.drawLabel(u,c,i)},r.prototype.drawCtrl=function(t){var e=this,i=n(t.map((function(t){return t*e.scale})),2),a=i[0],r=i[1];this.ctx.save(),this.ctx.beginPath(),this.ctx.fillStyle="#fff",this.ctx.strokeStyle="rgb(52,244,39)",this.ctx.arc(a,r,this.ctrlRadius,0,2*Math.PI,!0),this.ctx.fill(),this.ctx.arc(a,r,this.ctrlRadius,0,2*Math.PI,!0),this.ctx.stroke(),this.ctx.restore()},r.prototype.drawCtrlList=function(t){var e=this;t.ctrlsData.forEach((function(t){e.drawCtrl(t)}))},r.prototype.drawLabel=function(t,e,i){var a=this;if(void 0===e&&(e=""),void 0===i&&(i=""),e.length){var r=e.length<this.labelMaxLen+1?e:"".concat(e.substr(0,this.labelMaxLen),"...");this.ctx.font="".concat(this.labelFontSize,"px 楷体");var o=this.ctx.measureText(r),s=n(t.map((function(t){return t*a.scale})),2),c=s[0],l=s[1];this.ctx.save(),this.ctx.fillStyle=i||this.labelFillStyle,this.ctx.fillRect(c-(o.width+8)/2,l,o.width+8,1.3*this.labelFontSize),this.ctx.fillStyle=this.labelFontColor,this.ctx.fillText(r,c-(o.width+4)/2,l+this.labelFontSize),this.ctx.restore()}},r.prototype.paintImage=function(){this.ctx.drawImage(this.image,0,0,this.IMAGE_WIDTH,this.IMAGE_HEIGHT)},r.prototype.clear=function(){this.ctx.clearRect(0,0,this.WIDTH,this.HEIGHT)},r.prototype.update=function(){var t=this;this.ctx.save(),this.clear(),this.ctx.translate(this.originX,this.originY),this.paintImage(),this.dataset.forEach((function(e){switch(e.type){case 1:t.drawRect(e);break;case 2:t.drawPolygon(e);break;case 3:t.drawDot(e)}})),this.activeShape&&[1,2].includes(this.activeShape.type)&&this.drawCtrlList(this.activeShape),this.ctx.restore()},r.prototype.deleteByIndex=function(t){var e=this.dataset.findIndex((function(e){return e.index===t}));e>-1&&(this.emit("delete",this.dataset[e]),this.dataset.splice(e,1),this.dataset.forEach((function(t,e){t.index=e})),this.update())},r.prototype.calcStep=function(t){t&&(this.scaleStep=100,this.setScale(!1)),(this.IMAGE_WIDTH>this.WIDTH||this.IMAGE_HEIGHT>this.HEIGHT)&&(this.setScale(!1),this.calcStep())},r.prototype.setScale=function(t,e){var i=t?1.05:.95;if(this.IMAGE_WIDTH=this.IMAGE_WIDTH*i,this.IMAGE_HEIGHT=this.IMAGE_HEIGHT*i,"mouse"===this.zoomCenter&&e){var a=this.getElementTop(this.canvas),n=i*(e.clientX-a.pageLeft-this.originX),r=i*(e.clientY-a.pageTop-this.originY);this.originX=this.originX+(e.clientX-a.pageLeft-this.originX)-n,this.originY=this.originY+(e.clientY-a.pageTop-this.originY)-r}else this.originX=(this.WIDTH-this.IMAGE_WIDTH)/2,this.originY=(this.HEIGHT-this.IMAGE_HEIGHT)/2;this.update()},r.prototype.fitZoom=function(){this.calcStep(!0),this.IMAGE_HEIGHT/this.IMAGE_WIDTH>=this.HEIGHT/this.WIDTH?(this.IMAGE_WIDTH=this.IMAGE_ORIGIN_WIDTH/(this.IMAGE_ORIGIN_HEIGHT/this.HEIGHT),this.IMAGE_HEIGHT=this.HEIGHT):(this.IMAGE_WIDTH=this.WIDTH,this.IMAGE_HEIGHT=this.IMAGE_ORIGIN_HEIGHT/(this.IMAGE_ORIGIN_WIDTH/this.WIDTH)),this.originX=(this.WIDTH-this.IMAGE_WIDTH)/2,this.originY=(this.HEIGHT-this.IMAGE_HEIGHT)/2,this.update()},r.prototype.getElementTop=function(t){for(var e=t.offsetTop,i=t.offsetLeft,a=t.offsetParent;null!=a;)e+=a.offsetTop,i+=a.offsetLeft,a=a.offsetParent;return{pageLeft:i,pageTop:e}},r}(h)}));
//# sourceMappingURL=index.js.map