问题
My canvas color is 50 255 50 155. When I do a code:
function getClickedAreaColor(x, y) {
var data = ctx.getImageData(x, y, 1, 1).data,
color = [];
for (var i = 0; i < data.length; i++) {
color.push(data[i]);
}
return color;
}
It returns 49 255 49 155 Why is that?
回答1:
There is a note in the specs for the getImageData method for such situations:
Due to the lossy nature of converting to and from premultiplied alpha color values, pixels that have just been set using putImageData() might be returned to an equivalent getImageData() as different values.
It can explain why you see such difference in
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
ctx.fillStyle="rgba(50, 255, 50, 0.607843137254902)"
ctx.rect(0, 0, 100, 100);
ctx.fill();
console.log(ctx.getImageData(0, 0, 1, 1).data);
http://jsfiddle.net/jtav1dm6/2/
来源:https://stackoverflow.com/questions/27961537/why-function-returns-wrong-color-in-canvas