首页 > 代码库 > 【canvas】圆弧运动

【canvas】圆弧运动

var canvas = document.getElementById(‘canvas‘)var context = canvas.getContext(‘2d‘)var angle = 0function move() {    context.clearRect(0,0,canvas.width,canvas.height)    context.save()    context.beginPath()    context.lineWidth = 0.5    context.strokeStyle = ‘red‘    context.arc(canvas.width / 2, canvas.height / 2, 200, 0, Math.PI*2, false)    context.stroke()    context.restore()    context.save()    context.beginPath()    context.fillStyle = ‘green‘    context.strokeStyle = ‘green‘    context.arc(canvas.width / 2 + Math.cos(angle) * 200, canvas.height / 2 + Math.sin(angle) * 200, 5, 0, Math.PI*2, false)    angle += Math.PI * 2 / 360    context.stroke()    context.fill()    context.restore()    window.requestAnimationFrame(move)}window.requestAnimationFrame(move)

 

【canvas】圆弧运动