Изменить спрайт путем изменения индекса массива - PullRequest
0 голосов
/ 02 ноября 2019

Я пишу простую игру с орфографией и хочу циклически перебирать доступные буквенные спрайты при нажатии левой клавиши.

Я могу загрузить эти спрайты нормально:

 function loadSprite(fileName){
    assetsStillLoading++;

    let spriteImage = new Image();
    spriteImage.src = "assets/sprites/" + fileName;

    spriteImage.onload = function()
    {
        assetsStillLoading--;
    }

    return spriteImage;
}

sprites.letterA = loadSprite('/Letters/letter_A.png');
sprites.letterB = loadSprite('/Letters/letter_B.png');
sprites.letterC = loadSprite('/Letters/letter_C.png');

Вот мой массив строк:

var lts = [
"letterA",
"letterB",
"letterC",
"letterD",
"letterE",
"letterF"
 ];

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

Letter.prototype.letterLeft  = function(){

console.log("left");
letterNo = letterNo + 1;

var string = "sprites." + lts[letterNo];
console.log("sprite loading:" + string);
this.sprite = string;

}

Но я получаю ошибку:

TypeError: Argument 1 of CanvasRenderingContext2D.drawImage could not be converted to any of: HTMLImageElement, SVGImageElement, HTMLCanvasElement, HTMLVideoElement, ImageBitmap.

Я часами гуглял, пытаясь найти способы приведения строки к объекту или изменить спрайт из массива, пробовал несколько попыток, но не могу выполнить это простое действие; - (

РЕДАКТИРОВАТЬ: показать изображение:

GameWorld.prototype.draw = function(){
Canvas.drawImage(sprites.background, {x:0, y:0});

for(let i=0; i < this.letters.length; i++){
    this.letters[i].draw(DELTA);
}

this.whiteBall.draw();

} ​​

...