getimagedata - colorpicker - problem

Hi to all . Please help hereafter... I am trying either with the cursor or by scanning the photo you see to get the color per pixel. Sometimes it shows the color black as if there is no photo. Other times it gives me the wrong color (I don't know if it's the fault of the"alpha" ) and actually 2 or more colors in addition to every color it reads. Please check it out and if needed I will provide more information soon. Thanks

var pin_argb=[]
var st="";
var txt=this.txt;
var c =canvas.getContext('2d');
/* for (var i=320;i<=360;i++){
var p = c.getImageData(i, 200, 1, 1).data;
st+=p;
txt.text=st;
//alert(p);
}
*/

function componentToHex(c) {
var hex = c.toString(16);
return hex.length == 1 ? "0" + hex : hex;
}

function rgbToHex(r, g, b) {
return "#" + componentToHex(r) + componentToHex(g) + componentToHex(b);
}

//alert(rgbToHex(0, 51, 255)); // #0033ff

var shape = new createjs.Shape(new createjs.Graphics().beginFill("#ff0000").drawRect(5,5,100,100));
//this.addChild(shape);

var myInterval = setInterval(setColor, 1000);
var ii=0;
var jj=270;
var that=this;
function setColor() {
jj++;
//var p = c.getImageData(ii, 200, 1, 1).data;
var c = canvas.getContext('2d');
var p = c.getImageData(jj, 2, 1, 1).data;
var rr=p[1]
//st=p;
//txt.text=ii+" = "+st+" r="+rr+" "+ p[2];
that.removeChild(shape);
c_color=rgbToHex(p[1], p[2], p[3]);
pin_argb.push(c_color)
//st+=c_color;
//st+=",";
//txt.text=st;
// console.log(st);
shape = new createjs.Shape(new createjs.Graphics().beginFill(c_color).drawRect(jj,5,1,10));
that.addChild(shape);
shape.alpha=p[0]
if (jj>470){
stopColor();
}

}

function stopColor() {
alert(pin_argb.length)
clearInterval(myInterval);
}