putImageData / Canvas - Как мне вывести массив пикселей здесь? - PullRequest
Новая
       18

putImageData / Canvas - Как мне вывести массив пикселей здесь?

0 голосов
/ 01 сентября 2010

Как мне перерисовать массив пикселей после того, как я ранее использовал getImageData? То, что я считал разумным, дает мне ошибку: Указана неверная или недопустимая строка "code:" 12 

function makeImage(canvasId, background, object) {

    var canvas = document.getElementById(canvasId);
    var ctx = canvas.getContext('2d');
    var backgroundData = null;
    var objectData = null;

    //Get image Data
    function getDataFromImage(img) {
        canvas.width = img.width;
        canvas.height = img.height;
        ctx.clearRect(0, 0, img.width, img.height);
        ctx.drawImage(img, 0 ,0);
        return ctx.getImageData(0, 0, img.width, img.height);
    }

    //Load image
    function loadImage(src, callback) {
        var img = document.createElement('img');
        img.onload = callback;
        img.src = src;
        return img;
    }

    //Get Background Image Data
    var backgroundImg = loadImage(background, function() {
        backgroundData = getDataFromImage(backgroundImg);
        ctx.clearRect(0, 0, canvas.width, canvas.height); 
        });

    //Get Object Image Data
    var objectImg = loadImage(object, function() {
        objectData = getDataFromImage(objectImg);
        ctx.clearRect(0, 0, canvas.width, canvas.height);
        });

    main();

    function main() {
        ctx.putImageData(backgroundData, 0, 0); //Try to redraw the background??
    }
 };

1 Ответ

1 голос
/ 01 сентября 2010

Я думаю, вам может понадобиться поместить вызов 

main()

внутри вызова loadImage, который заполняет backgroundData.Возможно, что main вызывается до загрузки изображения. 

var backgroundImg = loadImage(background, function() {
    backgroundData = getDataFromImage(backgroundImg);
    ctx.clearRect(0, 0, canvas.width, canvas.height); 
    main();
});
...