慕粉1470305008
2018-05-31 23:28
var me=document.getElementById('me'); me.width=500; me.height=500; var tex=me.getContext('2d'); tex.beginPath(); tex.moveTo(100,100); tex.lineTo(100,300); tex.lineTo(250,300); tex.lineTo(250,250); tex.lineTo(150,250); tex.lineTo(150,100); tex.closePath(); tex.stroke(); var aball=[]; for(var i=0;i<1000;i++){ var r=Math.floor(Math.random()*255); var g=Math.floor(Math.random()*255); var b=Math.floor(Math.random()*255); var R=Math.random()*10+5; ball={ color:'rgb('+r+','+g+','+b+')', R:R, x1:Math.random()*50+100, y1:Math.random()*200+100, vx1:Math.random()*2+2, vy1:Math.random()*2+2, x2:Math.random()*200+150, y2:Math.random()*50+250, vx2:Math.random()*3+3, vy2:Math.random()*3+3 }; aball[i]=ball; } function qq() { tex.clearRect(0, 0, me.width, me.height); for (var i = 0; i < aball.length; i++) { /*tex.globalCompositeOperation='lighter';*/ tex.beginPath(); tex.arc(aball[i].x1, aball[i].y1, aball[i].R, 0, 2 * Math.PI); tex.closePath(); tex.fillStyle = aball[i].color; tex.fill(); } } setInterval(function () { qq(); move(); },20); function move() { for (var i = 0; i < aball.length; i++) { aball[i].x1 += aball[i].vx1; aball[i].y1 += aball[i].vy1; if (aball[i].x1 - aball[i].R <= 100) { aball[i].vx1 = -aball[i].vx1; aball[i].x1 = 100 + aball[i].R; } if (aball[i].x1 + aball[i].R >= 150) { aball[i].vx1 = -aball[i].vx1; aball[i].x1 = 150 - aball[i].R; } if(aball[i].x1+aball[i].R>=150||aball[i].y1-aball[i].R>=250){ aball[i].x1 += aball[i].vx1; aball[i].y1 += aball[i].vy1; } /*else { aball[i].vx1 = -aball[i].vx1; aball[i].x1 = 150 - aball[i].R; }*/ /*if(aball[i].x1+aball[i].R>=250){ aball[i].vx1=-aball[i].vx1; aball[i].x1=250-aball[i].R; }*/ /*if(aball[i].y1-aball[i].R>=250){ aball[i].vy1=-aball[i].vy1; aball[i].vy1=250-aball[i].R; }*/ if (aball[i].y1 - aball[i].R <= 100) { aball[i].vy1 = -aball[i].vy1; aball[i].y1 = 100 + aball[i].R; } if (aball[i].y1 + aball[i].R >= 300) { aball[i].vy1 = -aball[i].vy1; aball[i].y1 = 300 - aball[i].R; } } }
还没有人回答问题,可以看看其他问题
Canvas绘图详解
72974 学习 · 426 问题
相似问题