Question

我无法在画布上绘制图像。我确定图像在绘图之前已加载。如果我确定图像已加载，为什么我无法绘制精灵？

错误如下

Uncaught TypeError: Failed to execute 'drawImage' on 'CanvasRenderingContext2D': The provided value is not of type '(HTMLImageElement or HTMLVideoElement or HTMLCanvasElement or ImageBitmap)'

和示例代码：

//Canvas
var canvas;
var ctx;
var sprite;

var load = function(){

    canvas = document.createElement("canvas");
    ctx = canvas.getContext("2d");

    canvas.width = 400;
    canvas.height = 300;
    document.body.appendChild(canvas);

    var spriteSheet = new Image();
    spriteSheet.onload = function(){
        initSprites(this);
        draw();
    };
    spriteSheet.src = "http://users.aber.ac.uk/jov2/sprite.png";
};

var draw = function(){
    ctx.drawImage(sprite,0,0);
}

var initSprites = function(img){
    sprite = new Sprite(img, 0,  0, 32, 32);
};

function Sprite(img, x, y, width, height) {
    this.img = img;
    this.x = x*2;
    this.y = y*2;
    this.width = width*2;
    this.height = height*2;
};

Code

Answer 1

因为您正在尝试绘制Sprite而不是Image的实例。试试这个

"select * from my_table where row_names in ('a', 'b') order by row_names"

我无法在加载图像的画布上绘图

1 个答案: