javascript - Problem with getImageData function -



javascript - Problem with getImageData function -

so, i'm using function getimagedata on "context" variable i've made within of <script> part, , when such draw rectangle ctx.getimagedata.data[0] show reddish value of rectangle drew on canvas. but, when import image , draw onto canvas, , seek utilize getimagedata.data[0] 0, makes no sense, i'm not sure why not reading image correctly. i've tried tutorials on they're vague , have segments written together.

so, when draw rectangle, color value comes out fine, again, when draw image, without drawing rectangle on canvas, never value of particular pixel on image.

can help me? here's currrent code:

<html> <head> <title> color test :) </title> </head> <body> <canvas id = "colortest" width = "500" height = "500"> please don't utilize shitty browsers :) </canvas> <script> //netscape.security.privilegemanage… var canvas = document.getelementbyid("colortest") , ctx = canvas.getcontext("2d") , image = new image() image.onload = function(){ ctx.drawimage(image,0,0) } image.src = 'pikachu.gif' ctx.fillstyle = "rgb(123,40,170)" ctx.fillrect(0,0,100,100) var imagedata = ctx.getimagedata(0,0,100,100) , spot = 0 while(imagedata.data[spot] == 0){ spot++ } console.log(imagedata.data[0]) </script> </body> </html>

does next alert sensible?

image.onload = function() { ctx.drawimage(image, 0, 0); var id = ctx.getimagedata(0,0,canvas.width,canvas.height); alert([id.data[0], id.data[1], id.data[2], id.data[3]].join(", ")); }

javascript image html5 canvas getimagedata

Comments

Popular posts from this blog

iphone - Dismissing a UIAlertView -

intellij idea - Update external libraries with intelij and java -

javascript - send data from a new window to previous window in php -