Java脚本如何在类方法中正确使用drawimage答案

【问题标题】：Java script how do i properly use drawimage in a class methodJava脚本如何在类方法中正确使用drawimage
【发布时间】：2018-07-11 03:24:05
【问题描述】：

我有一个图片变量列表：skeletonIdle；我想要一个一个接一个地绘制的课程，所以我有一个动画

class Skeleton{

    constructor(){

        this.skelframe = 0 ;

    }

    drawSkeleton(){

        this.skelIdle1 = document.getElementById("skel1");
        this.skelIdle2 = document.getElementById("skel2");
        this.skelIdle3 = document.getElementById("skel3");
        this.skelIdle4 = document.getElementById("skel4");
        this.skelIdle5 = document.getElementById("skel5");
        this.skelIdle6 = document.getElementById("skel6");
        this.skelIdle7 = document.getElementById("skel7");
        this.skelIdle8 = document.getElementById("skel8");
        this.skelIdle9 = document.getElementById("skel9");
        this.skelIdle10 = document.getElementById("skel10");

        this.skeletonIdle = [

            this.skelIdle1,
            this.skelIdle2,
            this.skelIdle3,
            this.skelIdle4,
            this.skelIdle5,
            this.skelIdle6,
            this.skelIdle7,
            this.skelIdle8,
            this.skelIdle9,
            this.skelIdle10

        ];

我正在尝试遍历每一个并绘制它这样我就有动画了

        this.skelframe += 0.1 ; 



        if (this.skelframe > 9 ){
            this.skelframe = 0 ;
        }

canvasContext.drawImage(this.skeletonIdle[this.skelframe],10,10,100,100);

似乎我无法让 drawImage 在课堂上工作是否可以在一个类中有 drawImage 。如果是这样，我该怎么做这是我调用方法。

window.onload= function() {

    canvas = document.getElementById("Gamecanvas");
    canvasContext = canvas.getContext("2d");
    canvasContext.fillStyle = 'red' ;
    canvasContext.fillRect(0,0,canvas.width,canvas.height);
    var GlacierImage = document.getElementById("glacier");
    canvasContext.drawImage(GlacierImage,0,0,canvas.width,canvas.height);
    skeletonChar.drawSkeleton();
}

【问题讨论】：

标签： javascript class methods scope elements

【解决方案1】：

看来我需要使用 RequestAnimationFrame() 作为 repainting 的更好选择。 setInterval() 函数可能会导致浏览器出错。

【讨论】：