Из-за чего растягивается картинка при анимации в canvas?

Question

[imagance]

При анимации картинки она почему-то растягивается. Что делать?

var cvs = document.getElementById("canvas");
var ctx = cvs.getContext("2d");

var bird = new Image();
var stop = new Image();

bird.src = "hero.png";
stop.src = "stopped.png";

var xPos = 100;
var yPos = 0;


function draw() {
	
	ctx.drawImage(stop, 300, 0);
	ctx.drawImage(bird, xPos, 0);
	
	xPos += 1;

	requestAnimationFrame(draw);
}

setTimeout(draw, 200)

<canvas id="canvas" width="1088px" height="912px"></canvas>
<script src="script.js"></script>

Answer 1

[Alexandroppolus]

Функция draw не затирает то, что было нарисовано на канве.
Сделай перед рисованием картинок очистку канвы, например, ctx.clearRect(0, 0, cvs.width, cvs.height);

Comments

[imagance]

Спасибо огромное!!