问答详情
源自:2-1 绘制背景

canvas画背景的一个问题

var can1;
var can2;

var ctx1;
var ctr2;

var lastTime;
var daltaTime;

var canWidth;
var canHeight;

var bgPic = new Image();
document.body.onload = game;
function game(){
	init();
	lastTime = Date.now();
	daltaTime = 0;
	//gameloop();
}
function init(){
	can1 = document.getElementById("canvas1");
	ctx1 = can1.getContext('2d');

	can2 = document.getElementById("canvas2");
	ctx2 = can2.getContext('2d');

	bgPic.src = "./src/background.jpg";

	canWidth = can1.width;
	canHeight = can1.height;
	ctx2.drawImage(bgPic, 0, 0, canWidth, canHeight);
}

我想在调用init方法的时候画,为什么会画不出来

提问者:taba 2017-03-26 16:12

个回答

  • qq_风龙_0
    2017-03-26 22:47:57

    增加图片加载监听(等待图片加载完),加上bgPic.onload=function(){ctx2.drawImage(bgPic, 0, 0, canWidth, canHeight);}要不就增加页面自动刷新函数,使用setInterval或者requestAnimationFrame,不断调用game函数,但不能使用两者一起使用,会不显示(估计是不断刷新,不断等待图片加载造成图片永远加载中而不显示)