Question

我正在尝试制作一个简单的游戏，但如果我需要一个用于弹跳球的图像，那么我该怎么做呢？我这样做 -

function draw() {
    ctx.clearRect(0, 0, 300, 300);
    if (ctx.getContext) {

            Snooker = new Image();
            Snooker.onload = loadingComplete;
            Snooker.src = "http://www.wpclipart.com/toys/balls/red_snooker_ball.png";
        }
    x += dx;
    y += dy;
    bounce();
}

和 - ＆GT;

function init() {
    var ctx = document.getElementById("canvas");

    return setInterval(draw, 10);
}

现在画布是空白的。

这是小提琴链接 - http://jsfiddle.net/stackmanoz/QcLTw/1/

想要添加的图像而不是这个简单的球 - http://www.wpclipart.com/toys/balls/red_snooker_ball.png

Answer 1

以下是使用图片而非arc的脚本的工作版本。您可能希望使用Javascript的new Image()加载img，然后将源设置为您想要的图像。然后使用drawImage代替arc。

http://jsfiddle.net/QcLTw/7/

如何将图像添加到此画布球？

1 个答案: