canvas.drawImage 做动画,每30ms频繁调用该接口cpu发热严重怎么办?
求助~ 求助~ 求助~
// 目的是让小动物从右侧向左侧移动
const ctx = wx.createCanvasContext('canvasID');
function drawPic(){
ctx.save();
var picList = that.data.picList;
//频繁调用 ctx.drawImage 。。。。
for (var i = 0; i < picList.length;i++){
if (picList[i].isStop != 1) {//目标没有被射中
ctx.drawImage(
picList[i].picName,
picList[i].posleft,
picList[i].postop,
picList[i].width,
picList[i].height
)
}
}
ctx.restore();
ctx.draw();
}
/-----------分割线----------/
//调用方法
goAnimate();
var lastTime = 0;
function goAnimate() {
var currTime = new Date().getTime();
var timeToCall = Math.max(0, 30 - (currTime - lastTime));
fishMaoTimeOut = setTimeout(function() {
goAnimate();
}, timeToCall);
drawPic();
}