@vislite/canvas/dist/canvas.min.js

一个更灵活好用的数据驱动的画布

/*!
 * @vislite/canvas v1.0.0
 * git+https://github.com/oi-contrib/vislite-plugin-canvas.git
 */
!function(t,i){"object"==typeof exports&&"undefined"!=typeof module?module.exports=i():"function"==typeof define&&define.amd?define(i):(t="undefined"!=typeof globalThis?globalThis:t||self).Canvas=i()}(this,function(){"use strict";
/*!
    * Canvas of VISLite JavaScript Library v1.4.0
    * git+https://github.com/oi-contrib/VISLite.git
    */var t=function(i,e){return t=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,i){t.__proto__=i}||function(t,i){for(var e in i)Object.prototype.hasOwnProperty.call(i,e)&&(t[e]=i[e])},t(i,e)};function i(i,e){if("function"!=typeof e&&null!==e)throw new TypeError("Class extends value "+String(e)+" is not a constructor or null");function n(){this.constructor=i}t(i,e),i.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)}var e=function(){return e=Object.assign||function(t){for(var i,e=1,n=arguments.length;e<n;e++)for(var r in i=arguments[e])Object.prototype.hasOwnProperty.call(i,r)&&(t[r]=i[r]);return t},e.apply(this,arguments)};"function"==typeof SuppressedError&&SuppressedError;var n=function(t,i,e,n,r){var o=Math.cos(e),s=Math.sin(e);return[+((n-t)*o-(r-i)*s+t).toFixed(7),+((n-t)*s+(r-i)*o+i).toFixed(7)]};var r=function(t,i,e,n,r){return t.beginPath(),t.translate(e,n),t.rotate(r),t.font=i.fontStyle+" "+i.fontWeight+" "+i.fontSize+"px "+i.fontFamily,t},o=function(t,i,e,r,o,s,a,l){if(o>s){var h=o;o=s,s=h}return a%=2*Math.PI,l>=1.999999*Math.PI||l<=1.999999*-Math.PI?l=2*Math.PI:l%=2*Math.PI,function(t,i,e,r,o,s,a){i<0&&(t+=i,i*=-1);var l,h=[];l=n(0,0,t,o,0),h[0]=l[0],h[1]=l[1],l=n(0,0,i,l[0],l[1]),h[2]=l[0],h[3]=l[1],l=n(0,0,t,s,0),h[4]=l[0],h[5]=l[1],l=n(0,0,i,l[0],l[1]),h[6]=l[0],h[7]=l[1],a(t,t+i,h[0]+e,h[1]+r,h[4]+e,h[5]+r,h[2]+e,h[3]+r,h[6]+e,h[7]+r,.5*(s-o))}(a,l,e,r,o,s,function(n,a,l,h,_,u,f,p,c,g,y){y<0&&(y=-y),t.beginPath(),t.moveTo(l,h),t.arc(e,r,o,n,a,!1),"round"==i.arcEndCap?t.arc(.5*(f+c),.5*(p+g),y,a-Math.PI,a,!0):"-round"==i.arcEndCap?t.arc(.5*(f+c),.5*(p+g),y,a-Math.PI,a,!1):t.lineTo(c,g),t.arc(e,r,s,a,n,!0),"round"==i.arcStartCap?t.arc(.5*(l+_),.5*(h+u),y,n,n-Math.PI,!0):"-round"==i.arcStartCap?t.arc(.5*(l+_),.5*(h+u),y,n,n-Math.PI,!1):t.lineTo(l,h)}),"butt"==i.arcStartCap&&t.closePath(),t},s=function(t,i,e,n){return t.beginPath(),t.moveTo(i+n,e),t.arc(i,e,n,0,2*Math.PI),t},a=function(t,i,e,n,r,o){t.beginPath();var s=[];if(Array.isArray(i.rectRadius)&&i.rectRadius.length>0)for(var a=0;a<4;a++)s.push.apply(s,i.rectRadius);return s.length>=4?(t.arc(e+s[0],n+s[0],s[0],Math.PI,1.5*Math.PI),t.arc(e+r-s[1],n+s[1],s[1],1.5*Math.PI,0),t.arc(e+r-s[2],n+o-s[2],s[2],0,.5*Math.PI),t.arc(e+s[3],n+o-s[3],s[3],.5*Math.PI,Math.PI),t.closePath()):t.rect(e,n,r,o),t};function l(t,i,e,n,r){for(var o=0,s="",a=0;a<i.length;a++)t.measureText(s+i[a]).width>e||/\n$/.test(s)?(r(s,((o+=1)-.5)*n),s=i[a]):a==i.length-1?(o+=1,r(s+i[a],(o-.5)*n)):s+=i[a];return o*n}function h(t){var i={fontSize:16,fontFamily:"sans-serif",fontWeight:400,fontStyle:"normal",arcStartCap:"butt",arcEndCap:"butt",rectRadius:[]},n={fillStyle:"black",strokeStyle:"black",lineWidth:1,lineCap:"butt",lineJoin:"miter",lineDash:[],textAlign:"left",textBaseline:"middle",shadowBlur:0,shadowColor:"black"};return"special"==t?i:"init"==t?n:e(e({},i),n)}var _=function(){function t(t,i,e,n,r){void 0===i&&(i={}),void 0===n&&(n=!1),this.__region=null,this.__onlyRegion=!1,this.__onlyView=!1,this.__specialConfig=h("special"),this.__initConfig=h("init"),this.painter=t.getContext("2d",i),this.__region=e,this.__isPainter=n,this.painter.textBaseline="middle",this.painter.textAlign="left"}return t.prototype.useConfig=function(t,i){if(this.__region&&!this.__onlyView&&["fillStyle","strokeStyle","shadowBlur","shadowColor"].indexOf(t)<0&&this.__region.useConfig(t,i),this.__isPainter&&this.__onlyRegion)return this;if("lineDash"==t)this.painter.setLineDash&&this.painter.setLineDash(i);else if(t in this.__specialConfig)"fontSize"==t&&(i=Math.round(i)),this.__specialConfig[t]=i;else{if(!(t in this.__initConfig))throw new Error("Illegal configuration item of painter : "+t+" !");this.painter[t]=i}return this},t.prototype.fillText=function(t,i,e,n){return void 0===n&&(n=0),this.__region&&!this.__onlyView&&this.__region.fillText(t,i,e,n),this.__isPainter&&this.__onlyRegion||(this.painter.save(),r(this.painter,this.__specialConfig,i,e,n).fillText(t,0,0),this.painter.restore()),this},t.prototype.strokeText=function(t,i,e,n){return void 0===n&&(n=0),this.__region&&!this.__onlyView&&this.__region.strokeText(t,i,e,n),this.__isPainter&&this.__onlyRegion||(this.painter.save(),r(this.painter,this.__specialConfig,i,e,n).strokeText(t,0,0),this.painter.restore()),this},t.prototype.fullText=function(t,i,e,n){return void 0===n&&(n=0),this.__region&&!this.__onlyView&&this.__region.fullText(t,i,e,n),this.__isPainter&&this.__onlyRegion||(this.painter.save(),r(this.painter,this.__specialConfig,i,e,n),this.painter.fillText(t,0,0),this.painter.strokeText(t,0,0),this.painter.restore()),this},t.prototype.fillTexts=function(t,i,e,n,o,s){var a=this;void 0===o&&(o=1.2),void 0===s&&(s=0);var h=0;if(this.__region&&!this.__onlyView&&(h=this.__region.fillTexts(t,i,e,n,o)),this.__isPainter&&this.__onlyRegion)return h;this.painter.save(),r(this.painter,this.__specialConfig,i,e,s);var _=l(this.painter,t,n,this.__specialConfig.fontSize*o,function(t,i){a.painter.fillText(t,0,i)});return this.painter.restore(),_},t.prototype.strokeTexts=function(t,i,e,n,o,s){var a=this;void 0===o&&(o=1.2),void 0===s&&(s=0);var h=0;if(this.__region&&!this.__onlyView&&(h=this.__region.fillTexts(t,i,e,n,o)),this.__isPainter&&this.__onlyRegion)return h;this.painter.save(),r(this.painter,this.__specialConfig,i,e,s);var _=l(this.painter,t,n,this.__specialConfig.fontSize*o,function(t,i){a.painter.strokeText(t,0,i)});return this.painter.restore(),_},t.prototype.fullTexts=function(t,i,e,n,o,s){var a=this;void 0===o&&(o=1.2),void 0===s&&(s=0);var h=0;if(this.__region&&!this.__onlyView&&(h=this.__region.fillTexts(t,i,e,n,o)),this.__isPainter&&this.__onlyRegion)return h;this.painter.save(),r(this.painter,this.__specialConfig,i,e,s);var _=l(this.painter,t,n,this.__specialConfig.fontSize*o,function(t,i){a.painter.fillText(t,0,i),a.painter.strokeText(t,0,i)});return this.painter.restore(),_},t.prototype.beginPath=function(){return this.__region&&!this.__onlyView&&this.__region.beginPath(),this.__isPainter&&this.__onlyRegion||this.painter.beginPath(),this},t.prototype.closePath=function(){return this.__region&&!this.__onlyView&&this.__region.closePath(),this.__isPainter&&this.__onlyRegion||this.painter.closePath(),this},t.prototype.moveTo=function(t,i){return this.__region&&!this.__onlyView&&this.__region.moveTo(t,i),this.__isPainter&&this.__onlyRegion||this.painter.moveTo(Math.round(t)+.5,Math.round(i)+.5),this},t.prototype.lineTo=function(t,i){return this.__region&&!this.__onlyView&&this.__region.lineTo(t,i),this.__isPainter&&this.__onlyRegion||this.painter.lineTo(Math.round(t)+.5,Math.round(i)+.5),this},t.prototype.arc=function(t,i,e,n,r){return this.__region&&!this.__onlyView&&this.__region.arc(t,i,e,n,r),this.__isPainter&&this.__onlyRegion||this.painter.arc(t,i,e,n,n+r,r<0),this},t.prototype.fill=function(){return this.__region&&!this.__onlyView&&this.__region.fill(),this.__isPainter&&this.__onlyRegion||this.painter.fill(),this},t.prototype.stroke=function(){return this.__region&&!this.__onlyView&&this.__region.stroke(),this.__isPainter&&this.__onlyRegion||this.painter.stroke(),this},t.prototype.full=function(){return this.__region&&!this.__onlyView&&this.__region.full(),this.__isPainter&&this.__onlyRegion||(this.painter.fill(),this.painter.stroke()),this},t.prototype.save=function(){return this.__region&&!this.__onlyView&&this.__region.save(),this.__isPainter&&this.__onlyRegion||this.painter.save(),this},t.prototype.restore=function(){return this.__region&&!this.__onlyView&&this.__region.restore(),this.__isPainter&&this.__onlyRegion||this.painter.restore(),this},t.prototype.clip=function(){return this.__region&&!this.__onlyView&&this.__region.clip(),this.__isPainter&&this.__onlyRegion||this.painter.clip(),this},t.prototype.quadraticCurveTo=function(t,i,e,n){return this.__region&&!this.__onlyView&&this.__region.quadraticCurveTo(t,i,e,n),this.__isPainter&&this.__onlyRegion||this.painter.quadraticCurveTo(t,i,e,n),this},t.prototype.bezierCurveTo=function(t,i,e,n,r,o){return this.__region&&!this.__onlyView&&this.__region.bezierCurveTo(t,i,e,n,r,o),this.__isPainter&&this.__onlyRegion||this.painter.bezierCurveTo(t,i,e,n,r,o),this},t.prototype.clearRect=function(t,i,e,n){return this.__region&&!this.__onlyView&&this.__region.clearRect(t,i,e,n),this.__isPainter&&this.__onlyRegion||this.painter.clearRect(t,i,e,n),this},t.prototype.clearCircle=function(t,i,e){return this.__region&&!this.__onlyView&&this.__region.clearCircle(t,i,e),this.__isPainter&&this.__onlyRegion||(this.painter.beginPath(),this.painter.globalCompositeOperation="destination-out",this.painter.arc(t,i,e,0,2*Math.PI),this.painter.fill(),this.painter.globalCompositeOperation="source-over",this.painter.closePath()),this},t.prototype.fillArc=function(t,i,e,n,r,s){return this.__region&&!this.__onlyView&&this.__region.fillArc(t,i,e,n,r,s),this.__isPainter&&this.__onlyRegion||o(this.painter,this.__specialConfig,t,i,e,n,r,s).fill(),this},t.prototype.strokeArc=function(t,i,e,n,r,s){return this.__region&&!this.__onlyView&&this.__region.strokeArc(t,i,e,n,r,s),this.__isPainter&&this.__onlyRegion||o(this.painter,this.__specialConfig,t,i,e,n,r,s).stroke(),this},t.prototype.fullArc=function(t,i,e,n,r,s){return this.__region&&!this.__onlyView&&this.__region.fullArc(t,i,e,n,r,s),this.__isPainter&&this.__onlyRegion||(o(this.painter,this.__specialConfig,t,i,e,n,r,s),this.painter.fill(),this.painter.stroke()),this},t.prototype.fillCircle=function(t,i,e){return this.__region&&!this.__onlyView&&this.__region.fillCircle(t,i,e),this.__isPainter&&this.__onlyRegion||s(this.painter,t,i,e).fill(),this},t.prototype.strokeCircle=function(t,i,e){return this.__region&&!this.__onlyView&&this.__region.strokeCircle(t,i,e),this.__isPainter&&this.__onlyRegion||s(this.painter,t,i,e).stroke(),this},t.prototype.fullCircle=function(t,i,e){return this.__region&&!this.__onlyView&&this.__region.fullCircle(t,i,e),this.__isPainter&&this.__onlyRegion||(s(this.painter,t,i,e),this.painter.fill(),this.painter.stroke()),this},t.prototype.fillRect=function(t,i,e,n){return this.__region&&!this.__onlyView&&this.__region.fillRect(t,i,e,n),this.__isPainter&&this.__onlyRegion||a(this.painter,this.__specialConfig,t,i,e,n).fill(),this},t.prototype.strokeRect=function(t,i,e,n){return this.__region&&!this.__onlyView&&this.__region.strokeRect(t,i,e,n),this.__isPainter&&this.__onlyRegion||a(this.painter,this.__specialConfig,t,i,e,n).stroke(),this},t.prototype.fullRect=function(t,i,e,n){return this.__region&&!this.__onlyView&&this.__region.fullRect(t,i,e,n),this.__isPainter&&this.__onlyRegion||(a(this.painter,this.__specialConfig,t,i,e,n),this.painter.fill(),this.painter.stroke()),this},t.prototype.draw=function(){return Promise.resolve()},t.prototype.drawImage=function(t,i,e,n,r,o){var s=this;return void 0===o&&(o=!1),new Promise(function(a){if(s.__region&&!s.__onlyView&&s.__region.fillRect(i,e,n,r),s.__isPainter&&s.__onlyRegion)a({});else if("string"!=typeof t||o)s.painter.drawImage(t,i,e,n,r),a({});else{var l=new Image;l.onload=function(){s.painter.drawImage(l,i,e,n,r),a({})},l.src=t}})},t.prototype.install=function(t){var i=this,e=function(e){if(e in n)throw new Error("VISLite Canvas:Method already exists and cannot be overwritten.");n[e]=function(){for(var n=[],r=0;r<arguments.length;r++)n[r]=arguments[r];var o=t[e].apply(i,n);return null!=o?o:i}},n=this;for(var r in t)e(r);return this},t}();var u=function(t,i){var e={value:function(){return t},setColor:function(n,r){return t.addColorStop(i?i(n):n,r),e}};return e},f=function(t){function e(i,e,n,r){void 0===n&&(n={}),void 0===r&&(r=1);var o=t.call(this,i,n,e?new _(e,{willReadFrequently:!0}):void 0,!0,r)||this;return o.name="Canvas",o.__regionList={},o.__regionAssemble=function(t,i,e,n){for(var r=[],o=0;o<n;o++)r[o]=t;return function(){for(var o=0;o<n;o++){if(r[o]+e<i){r[o]=+(r[o]+e).toFixed(7);break}o<n-1&&(r[o]=t)}return r}}(0,255,10,3),o.__scaleSize=r,o.setRegion(""),o}return i(e,t),e.prototype.config=function(t){for(var i in t)this.useConfig(i,t[i]);return this},e.prototype.reset=function(){return this.config(h()),this},e.prototype.onlyRegion=function(t){return this.__onlyRegion=t,this},e.prototype.onlyView=function(t){return this.__onlyView=t,this},e.prototype.setRegion=function(t){if(this.__region)if(t){if(null==this.__regionList[t]){var i=this.__regionAssemble();this.__regionList[t]="rgb("+i[0]+","+i[1]+","+i[2]+")"}this.__region.useConfig("fillStyle",this.__regionList[t])&&this.__region.useConfig("strokeStyle",this.__regionList[t])}else this.__region.useConfig("fillStyle","#000000")&&this.__region.useConfig("strokeStyle","#000000");return this},e.prototype.getRegion=function(t,i){var e=this;return new Promise(function(n){var r=e.__region?e.__region.painter.getImageData(t-.5,i-.5,1,1):{data:[0,0,0,0]},o=r.data,s=function(){if(e.__region)for(var t in e.__regionList)if("rgb("+o[0]+","+o[1]+","+o[2]+")"==e.__regionList[t]){n(t);break}n("")};o?s():r.then(function(t){o=t,s()})})},e.prototype.textWidth=function(t){this.painter.save(),r(this.painter,this.__specialConfig,0,0,0);var i=this.painter.measureText(t+"").width;return this.painter.restore(),i},e.prototype.getContext=function(t){return void 0===t&&(t=!1),t?this.__region?this.__region.painter:null:this.painter},e.prototype.getInfo=function(){return{width:this.painter.canvas.width/this.__scaleSize,height:this.painter.canvas.height/this.__scaleSize}},e.prototype.createLinearGradient=function(t,i,e,n){return function(t,i,e,n,r){var o=t.createLinearGradient(i,e,n,r);return u(o)}(this.painter,t,i,e,n)},e.prototype.createRadialGradient=function(t,i,e){return function(t,i,e,n){var r=t.createRadialGradient(i,e,0,i,e,n);return u(r)}(this.painter,t,i,e)},e.prototype.createConicGradient=function(t,i,e,n){return function(t,i,e,n,r){var o=t.createConicGradient(n,i,e);return u(o,r?function(t){return r/(2*Math.PI)*t}:void 0)}(this.painter,t,i,e,n)},e.prototype.getColor=function(t,i){t*=this.__scaleSize,i*=this.__scaleSize;var e=this.painter.getImageData(t-.5,i-.5,1,1).data;return"rgba("+e[0]+","+e[1]+","+e[2]+","+e[3]+")"},e}(_);var p,c=function(t){function e(i,e,n,r){void 0===e&&(e={}),void 0===n&&(n=0),void 0===r&&(r=0);var o=this;if(!i)throw new Error("VISLite Canvas:The mount point requires an HTMLElement type but encountered null.");e=function(t,i){for(var e in t)i[e]=t[e];return i}(e,{region:!0,willReadFrequently:!1}),n=n||i.clientWidth,r=r||i.clientHeight;var s,a=null,l=i;l._vislite_canvas_?(s=l._vislite_canvas_[0],a=l._vislite_canvas_[1]):(s=document.createElement("canvas"),i.appendChild(s),e.region&&(a=document.createElement("canvas")),l._vislite_canvas_=[s,a],i.setAttribute("vislite","Canvas"));for(var h=[a,s],_=0;_<h.length;_++){var u=h[_];u&&(u.style.width=n+"px",u.setAttribute("width",_*n+n+""),u.style.height=r+"px",u.setAttribute("height",_*r+r+""))}return(o=t.call(this,s,a,{willReadFrequently:e.willReadFrequently},2)||this).__canvas=s,o.__el=i,o.painter.scale(2,2),o}return i(e,t),e.prototype.toDataURL=function(){var t=this;return new Promise(function(i){i(t.__canvas.toDataURL())})},e.prototype.bind=function(t,i){var e=this;return this.__el.addEventListener(t,function(t){e.getRegion(t.offsetX,t.offsetY).then(function(e){i(e,t.offsetX,t.offsetY)})}),this},e}(f),g=[];
/*!
    * animation of OIPage v1.3.1
    * git+https://github.com/oi-contrib/OIPage.git
    */let y=[{name:"circle",draw:function(t){this.painter[t.type+"Circle"](t.cx,t.cy,t.radius)},attr:{type:{type:"string"},cx:{type:"number"},cy:{type:"number"},radius:{type:"number"}}},{name:"arc",draw:function(t){this.painter[t.type+"Arc"](t.cx,t.cy,t.r1,t.r2,t.beginDeg,t.deg)},attr:{type:{type:"string"},cx:{type:"number"},cy:{type:"number"},r1:{type:"number"},r2:{type:"number"},beginDeg:{type:"number"},deg:{type:"number"}}},{name:"rect",draw:function(t){this.painter[t.type+"Rect"](t.x,t.y,t.width,t.height)},attr:{type:{type:"string"},x:{type:"number"},y:{type:"number"},width:{type:"number"},height:{type:"number"}}},{name:"text",draw:function(t){t.width>0?this.painter[t.type+"Texts"](t.text,t.x,t.y,t.width,t.lineHeight,t.deg):this.painter[t.type+"Text"](t.text,t.x,t.y,t.deg)},attr:{type:{type:"string"},text:{type:"string"},x:{type:"number"},y:{type:"number"},deg:{type:"number",default:0},width:{type:"number",default:-1},lineHeight:{type:"number",default:1.2}}}];var d=(t,i,e)=>(t-i)*e+i;let v;function w(t){v||(v=document.createElement("div"),v.style.position="fixed",v.style.widht="1px",v.style.height="1px",v.style.left="-100px",document.getElementsByTagName("body")[0].appendChild(v)),v.style.color=t;let i=(e=v,n="color",r=document.defaultView&&document.defaultView.getComputedStyle?document.defaultView.getComputedStyle(e,null):e.currentStyle,"string"==typeof n?r.getPropertyValue(n):r).replace(/^rgba{0,1}\(/,"").replace(/ /g,"").replace(")",",1").split(",");
/*!
    * style of OIPage v1.3.1
    * git+https://github.com/oi-contrib/OIPage.git
    */
var e,n,r;return[+i[0],+i[1],+i[2],+i[3]]}var m={number:function(t,i){return e=>d(t,i,e)},color:function(t,i){let e=w(t),n=w(i);return function(t){return`rgba(${Math.round(d(e[0],n[0],t))},${Math.round(d(e[1],n[1],t))},${Math.round(d(e[2],n[2],t))},${d(e[3],n[3],t).toFixed(2)})`}}};function b(t,i){let e=this,n=[],r={},o={},s=function(t,a,l,h){for(let _=0;_<t.length;_++){let u=t[_],f=i[u.name],p=[];if("for"in u){let t="function"==typeof u.for?u.for(e):u.for;for(let i=0;Array.isArray(t)&&i<t.length;i++)p.push({$parent:h,$value:t[i],$index:i})}else p=[{$parent:h,$value:void 0,$index:-1}];for(let t=0;t<p.length;t++){let i=a+"-"+_,h=l+u.name+"#"+_+" ";"for"in u&&(i=i+"for"+t,h=h.trim()+"for"+t+" ");let c={...e,...p[t]};if("if"in u&&!("function"==typeof u.if?u.if(c):u.if))continue;let g={};for(let t in u.attr)"function"==typeof u.attr[t]?g[t]=u.attr[t](c):g[t]=u.attr[t];for(let t in f.attr)if(!(t in g)){if(f.attr[t].required)return void console.error(h+"\n属性 "+t+" 为必输项，未设置值");g[t]=f.attr[t].default}let y={};for(let t in u.config)"function"==typeof u.config[t]?y[t]=u.config[t](c):y[t]=u.config[t];n.push({name:u.name,id:i,attr:g,config:y}),o[i]=n.length,r[i]=u.event,Array.isArray(u.children)&&s(u.children,i,h,p[t])}}};return s(t,"id","",{}),{els:n,elsMap:o,events:r}}let P;const C={};let R=0;let x={};function T(t){t.el.style.overflow="hidden";let i=new c(t.el),e=i.getInfo(),n={painter:i,data:t.data,width:e.width,height:e.height},r={els:[],elsMap:{},events:{}};for(let t of["click","dblclick","mousemove"])i.bind(t,function(i,e,o){r.events&&r.events[i]&&r.events[i][t]?.call(n,{event:t,x:e,y:o})});let o=!1;return n.setData=function(i){for(let t in i)n.data[t]=i[t];o||(o=!0,setTimeout(function(){let i=b.call(n,t.template,x);!function(t,i,e){arguments.length<2&&(i=400),arguments.length<3&&(e=function(){});var n={timer:function(t,i,e){if(!t)throw new Error("Tick is required!");var r=(new Date).valueOf()+"_"+(1e3*Math.random()).toFixed(0);return g.push({id:r,createTime:new Date,tick:t,duration:i,callback:e}),n.start(),r},start:function(){p||(p=setInterval(n.tick,13))},tick:function(){var t,i,e,r,o,s,a,l=g;for((g=[]).length=0,i=0;i<l.length;i++)t=(o=l[i]).createTime,e=o.tick,s=o.duration,r=o.callback,e(a=(a=(+(new Date).valueOf()-t.valueOf())/s)>1?1:a),a<1&&o.id?g.push(o):r(a);g.length<=0&&n.stop()},stop:function(){p&&(clearInterval(p),p=null)}},r=n.timer(function(i){t(i)},i,e)}
/*!
    * throttle of OIPage v1.3.1
    * git+https://github.com/oi-contrib/OIPage.git
    */(function(t){n.painter.clearRect(0,0,n.width,n.height);for(let e of i.els){let i=r.elsMap[e.id];if(n.painter.config(e.config),i){let o={},s=e.attr,a=r.els[i-1].attr,l=x[e.name].attr;for(let i in l)l[i].animation?o[i]=l[i].animation(s[i],a[i])(t):o[i]=e.attr[i];x[e.name].draw.call(n,e.id,o)}else x[e.name].draw.call(n,e.id,e.attr)}},500,function(){o=!1,r=i})}))},function(t,i){try{return P||(P=new ResizeObserver(t=>{for(const i of t)C[i.target._resize_observer_]()})),R++,t._resize_observer_=R,C[R]=i,P.observe(t),function(){P&&(P.unobserve(t),delete C[t._resize_observer_])}}catch(t){i(),console.error("ResizeObserver undefined!")}}(t.el,function(t,i){var e={time:200,keep:!1,opportunity:"end"};if(i)for(var n in i)e[n]=i[n];var r,o=!1,s=!1,a=!1;return function(){const i=this;if(r=arguments,o)s=!0,a=!0;else{"end"!=e.opportunity&&t.apply(i,r),o=!0;var n=setInterval(()=>{s?e.keep||t.apply(i,r):("begin"!=e.opportunity&&(a||"end"==e.opportunity)&&t.apply(i,r),o=!1,a=!1,clearInterval(n)),s=!1},e.time)}}}(function(){i=new c(t.el),e=i.getInfo(),n.width=e.width,n.height=e.height,n.painter.clearRect(0,0,n.width,n.height),r=b.call(n,t.template,x);for(let t of r.els)n.painter.config(t.config),x[t.name].draw.call(n,t.id,t.attr)},{keep:!0})),n}return T.defineElement=function(t){for(let i=0;i<y.length;i++)t(y[i].name,y[i].draw,y[i].attr);return t}(function(t,i,e){let n={};for(let t in e){let i=e[t];n[t]={required:!("default"in i)},"default"in i&&(n[t].default=i.default),m[i.type]&&(n[t].animation=m[i.type])}x[t]={draw:function(t,e){this.painter.setRegion(t),i.call(this,e)},attr:n}}),T});