| 1 |
- import{_ as t,a9 as a,b as s,d as i,p as h,w as e,H as n,i as c,o as d,f as r,ah as o}from"./index-2PZN6pGH.js";function v({x:t,y:a,vx:s,vy:i,canvasWidth:h,canvasHeight:e,ctx:n}){this.canvasWidth=h,this.canvasHeight=e,this.ctx=n,this.x=t,this.y=a,this.vx=s,this.vy=i,this.radius=5}v.prototype.draw=function(){this.ctx.beginPath(),this.ctx.fillStyle="#007AFF",this.ctx.arc(this.x,this.y,this.radius,0,2*Math.PI),this.ctx.closePath(),this.ctx.fill()},v.prototype.move=function(){this.x+=this.vx,this.y+=this.vy,this.x<this.radius?this.vx=Math.abs(this.vx):(this.x>this.canvasWidth-this.radius&&(this.vx=-Math.abs(this.vx)),this.y<this.radius?this.vy=Math.abs(this.vy):this.y>this.canvasWidth-this.radius&&(this.vy=-Math.abs(this.vy)))};const l={methods:{start(t,a,s,i){let h=i.getDataset().width,e=i.getDataset().height,n=document.querySelectorAll(".canvas>canvas")[0],c=n.getContext("2d"),d=[];for(let l=0;l<3;l++){let t=(r=h/2,o=e/2,Math.pow(Math.pow(r,2)+Math.pow(o,2),.5)/3*l);for(let a=0;a<20;a++){let s=2*a*Math.PI/20,i=Math.sin(s),n=Math.cos(s),r=t*n+h/2,o=t*i+e/2,l=3*n,u=3*i;d.push(new v({x:r,y:o,vx:l,vy:u,canvasWidth:h,canvasHeight:e,ctx:c,radius:5}))}}var r,o;!function t(a){c.clearRect(0,0,n.width,n.height),a.forEach((function(t){t.move(),t.draw()})),requestAnimationFrame((function(){t(a)}))}(d)}}},u=t=>{t.$renderjs||(t.$renderjs=[]),t.$renderjs.push("animate"),t.mixins||(t.mixins=[]),t.mixins.push({beforeCreate(){this.animate=this},mounted(){this.$ownerInstance=this.$gcd(this,!0)}}),t.mixins.push(l)},x={data:()=>({title:"canvas",canvasWidth:0,startStatus:!1,ballList:[]}),onReady:function(){this.$nextTick((()=>{a().select(".canvas").boundingClientRect((t=>{this.canvasWidth=t.width,this.startStatus=!0})).exec()}))}};u(x);const f=t(x,[["render",function(t,a,v,l,u,x){const f=s(i("page-head"),n),y=o,p=c;return d(),h(p,null,{default:e((()=>[r(f,{title:u.title},null,8,["title"]),r(p,{class:"page-body"},{default:e((()=>[r(p,{class:"page-body-wrapper"},{default:e((()=>[r(y,{"canvas-id":"canvas",class:"canvas",start:u.startStatus,"change:start":t.animate.start,"data-width":u.canvasWidth,"data-height":u.canvasWidth},null,8,["start","change:start","data-width","data-height"])])),_:1})])),_:1})])),_:1})}],["__scopeId","data-v-783ffccd"]]);export{f as default};
|
