IE11中未定义getImageData.data

Question

我使用以下功能获取点击坐标的像素数据：

Utils.GetPixel = function(imgData, index)
{
    var i = index*4, d = imgData.data;
    return [d[i], d[i+1], d[i+2], d[i+3]];
};

Utils.GetPixelXY = function(gObj, x, y)
{
    return Utils.GetPixel(gObj.ImgData, y*gObj.ImgData.width+x);
};

在Chrome / Firefox / Edge中打印出一些测试数据工作正常，但在IE11中没有，我对此非常陌生，所以我有点困惑。

var p = Utils.GetPixelXY(gObj, (mx - gObj.X), (my - gObj.Y));
console.log(p[0]+" "+p[1]+" "+p[2]+" "+p[3]);

Chrome / Firefox / Edge： 255 0 0 255

IE11： undefined undefined undefined undefined

更新：

我把一个小提琴复制品放在一起，对不起，我花了这么长时间才回到这里。

https://jsfiddle.net/1wwtxrjp/3/

经过一番乱搞之后，我发现了一些特殊的东西，画布上看似单个的像素返回了rgba像素数据，如下所示：

Answer 1

经过几个小时的完全混乱，阅读和测试我发现我必须parseInt() to ensure that the x and y values are integers because Internet Explorer 10 and later return mouse coordinates as floats to represent fractional pixels

以下是工作示例：https://jsfiddle.net/1wwtxrjp/4/

我真的很惊讶stackoverflow上没有人指出这一点，我花了很长时间才找到答案，我想很多人都犯了这个错误。