imageData set in InternetExplorer

问题:

I have an arraybuffer - named MEM - larger than the canvas width*height size. And I would like to draw the arrayBuffer data to the canvas.

imgData.data.set(...) should work, because imgData.data is an Uint8Array, which has the .set hethod. It works in FireFox, and Chrome, but in IE I get this error: Object doesn't support this property or method: 'set'

Initializaton:

var MEM = new ArrayBuffer(2*1024*1024);
var canvas, ctx, imgData;

var init = function() {

    canvas = document.getElementById('canvas');
    ctx = canvas.getContext('2d');

    imgData=ctx.createImageData(canvas.width, canvas.height);

    repaint();
};

Repaint function:

var repaint = function() {
    // .... //

    imgData.data.set(new Uint8Array(MEM, 0, canvas.width*canvas.height*4));
    ctx.putImageData(imgData, 0, 0);

    requestAnimationFrame(repaint);
};

回答1:

With this code, it works

if(window.CanvasPixelArray) {
    CanvasPixelArray.prototype.set = function(arr) {
        var l=this.length, i=0;

        for(;i<l;i++) {
            this[i] = arr[i];
        }
    };
}