draw canvas

[Yang03]

}
drawCircle(color, percent) {
this.ctx.beginPath()
this.ctx.setLineCap('round')
this.ctx.setStrokeStyle(color)
this.ctx.setLineWidth(5)
this.ctx.arc(100, 100, 90, Math.PI * 1, Math.PI * percent, 0)
this.ctx.stroke()
this.ctx.closePath()
}
drawPercent(percent = 1) {
const { homeStore: { homeState }} = this.props
const nowSteps = parseInt(homeState.step, 10)
const userTarget = parseInt(homeState.targetStep, 10)
let max = nowSteps / userTarget + 1
max = max >= 2 ? 2 : max
if (this.cacheStep === nowSteps) return
const timer = setInterval(() => {
if (percent < max) {
percent += 0.01
this.drawCircle('#dedede', 2)
this.drawCircle('#15CD8D', percent)
this.ctx.draw()
} else {
clearInterval(timer)
}
}, 1000 / 60)
if (this.cacheStep != nowSteps) {
this.cacheStep = nowSteps
}

}