M
mrc.gran
Hello,
below is some javascript code using getIimageData() and putImageData()
that doesn't seem to do what it is supposed to do (to draw a thick
horizontal line inside a <canvas> element) in Firefox2 (Mozilla/5.0
(X11; U; Linux i686; en-US; rv:1.8.1b1) Gecko/20060710 Firefox/2.0b1).
I'm using the specs at http://whatwg.org/specs/web-apps/current-work/
..
The result is just a blank box. No error is displayed. I tried several
variations without success.
Am I missing something or putImageData() is still just a stub?
Thanks,
Mg.
--
<html>
<body>
<canvas id="canvas" width="200" height="100" style="border:solid">
</canvas>
</body>
<script language="JavaScript">
var mycanvas = document.getElementById('canvas').getContext("2d");
var imagedata = mycanvas.getImageData(0,0,200,100); // read from canvas
for(i=2000;i<2000+1000;i++) { //modifies 5 lines starting at the 10th
line
imagedata.data[i*4+0]=127;//r
imagedata.data[i*4+1]=128;//g //kind of grey.
imagedata.data[i*4+2]=129;//b
imagedata.data[i*4+3]=130;//a
}
mycanvas.putImageData(imagedata,0,0); //write back to canvas
</script>
</html>
below is some javascript code using getIimageData() and putImageData()
that doesn't seem to do what it is supposed to do (to draw a thick
horizontal line inside a <canvas> element) in Firefox2 (Mozilla/5.0
(X11; U; Linux i686; en-US; rv:1.8.1b1) Gecko/20060710 Firefox/2.0b1).
I'm using the specs at http://whatwg.org/specs/web-apps/current-work/
..
The result is just a blank box. No error is displayed. I tried several
variations without success.
Am I missing something or putImageData() is still just a stub?
Thanks,
Mg.
--
<html>
<body>
<canvas id="canvas" width="200" height="100" style="border:solid">
</canvas>
</body>
<script language="JavaScript">
var mycanvas = document.getElementById('canvas').getContext("2d");
var imagedata = mycanvas.getImageData(0,0,200,100); // read from canvas
for(i=2000;i<2000+1000;i++) { //modifies 5 lines starting at the 10th
line
imagedata.data[i*4+0]=127;//r
imagedata.data[i*4+1]=128;//g //kind of grey.
imagedata.data[i*4+2]=129;//b
imagedata.data[i*4+3]=130;//a
}
mycanvas.putImageData(imagedata,0,0); //write back to canvas
</script>
</html>