JavaScript Не удалось выполнить 'drawImage'

Хорошо, поэтому я создаю игру с элементами холста JavaScript и т.д. Мне удалось загрузить в TONS изображений, но в нескольких избранных ответах JavaScript с ошибками, такими как

Uncaught TypeError: не удалось выполнить 'drawImage' в 'CanvasRenderingContext2D': не было обнаружено никакой функции, которая соответствовала предоставленной подписи.

Что делает НЕТ НЕСКОЛЬКО, потому что тот же код работает в других местах!?!

Вот пример, который у меня есть в моем коде:

board.drawImage(document.getElementById("player_explode"), this.x, this.y);

Внутри метода объектов Player.die(), соответственно.

Кто-нибудь знает, почему такое поведение происходит? Я очень расстраиваюсь...

Вот JSFiddle, чтобы продемонстрировать, помимо всего кода. Player.die() находится на line[242].

Ответ 1

Проблема заключалась в том, что я загружал свои Картинки, я должен был делать:

var image = new Image();
image.src = "imagesource.jpg";

Но вместо этого я получил элементы по id со страницы document.

Ресурсы

Объяснение при загрузке изображений

Объяснение того, как html загружает изображения

Ответ 2

вы должны ждать загрузки всех элементов, поэтому выполните следующие действия:

window.onload=function(){
       board.drawImage(document.getElementById("player_explode"), this.x, this.y);
}