怎样用canvas画一个逐步变大的圆
1个回答
展开全部
<!DOCTYPE html>
<html>
<head>
<title></title>
<style>
</style>
</head>
<body>
<canvas id='canvas' width=200 height=200></canvas>
<script>
var canvas=document.querySelector('canvas'),
context=canvas.getContext('2d'),
r=20;
context.strokeStyle='rgba(255,0,0,1)';
change(context,r);
function change(context,r){
context.clearRect(0,0,200,200);
context.beginPath();
context.arc(100,100,r++,0,2*Math.PI);
context.closePath();
context.stroke();
if(r>=100){
r=20;
}
window.requestAnimationFrame(function(){
change(context,r++)
});
}
</script>
</body>
</html>
<html>
<head>
<title></title>
<style>
</style>
</head>
<body>
<canvas id='canvas' width=200 height=200></canvas>
<script>
var canvas=document.querySelector('canvas'),
context=canvas.getContext('2d'),
r=20;
context.strokeStyle='rgba(255,0,0,1)';
change(context,r);
function change(context,r){
context.clearRect(0,0,200,200);
context.beginPath();
context.arc(100,100,r++,0,2*Math.PI);
context.closePath();
context.stroke();
if(r>=100){
r=20;
}
window.requestAnimationFrame(function(){
change(context,r++)
});
}
</script>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
