canvas利用循环画实心圆的问题
- 需求的场景描述(希望解决的问题)
希望画出如上图的效果图
- 希望提供的能力
const ctx = wx.createCanvasContext(‘firstCanvas’)
for (var i = 0; i <= 39; i++) {
var hang = Math.floor(i / 5)
var ge = i % 5
var fanzheng = hang % 2
var gao = hang * 50 + 50
if (fanzheng == 0) {
var kuan = ge * 70 + 20
} else {
var kuan = 300 - ge *70
}
console.log(“i:”+i+’,hang:’+hang+",ge:"+ge+",fanzheng:"+fanzheng+",gao:"+gao+",kuan:"+kuan)
ctx.arc(kuan, gao, 4, 0, 2 * Math.PI)
//ctx.setFillStyle(’#f00’)
//ctx.setStrokeStyle(’#8d8d8d’)
ctx.stroke()
}
ctx.draw()
目前有上面的代码,但一直做不出如图的效果。
求助大家,应该怎么写。