user2055839
user2055839

Reputation: 21

Javascript createImageData throwing DOM exception 9, rgb data not working

on the Chrome Browser v. 24 when I call the following

brush(x,y,w,h)

the console reports a

DOM Exception error 9

at this line:

var imageData = cvs.createImageData(w,h);

Also, setPixel() should change the r,g,b,a values of imageData.data as instructed but on my browser it appears transparent. The brush(...) creates a transparent, w * h square, which is not what I want it to do.

function setPixel(imageData, x, y, r, g, b, a) {
    index = (x + y * imageData.width) * 4;
    imageData.data[index+0] = r;
    imageData.data[index+1] = g;
    imageData.data[index+2] = b;
    imageData.data[index+3] = a;
}

function brush(x, y, w, h) {
        var canvas = document.getElementById('maincanvas');
        var cvs = canvas.getContext('2d');
        var imageData = cvs.createImageData(w,h);
        var r = 0;
        var g = 0;
        var b = 0;

        setPixel(imageData, x, y , r, g, b, 255);
        cvs.putImageData(imageData, x, y);
}

My question: is there another reason why the output is transparent besides an exception to createImageData?

Upvotes: 2

Views: 611

Answers (2)

Nelson Asinowski
Nelson Asinowski

Reputation: 1

A Quote from the following page

" When no styling rules are applied to the canvas it will initially be fully transparent."

https://developer.mozilla.org/en-US/docs/HTML/Canvas/Tutorial/Basic_usage?redirectlocale=en-US&redirectslug=Canvas_tutorial%2FBasic_usage

Upvotes: 0

lakenen
lakenen

Reputation: 3496

Try to logging (console.log()) your arguments to createImageData. This function seems to throw NOT_SUPPORTED_ERR: DOM Exception 9 when the first argument is NaN or Infinity (possibly in other cases as well).

Upvotes: 1

Related Questions