Question

我在网页上从计算机加载黑白图像，然后在画布上绘制图像。然后我想检索第一个像素的颜色。这是我正在使用的JavaScript函数：

function loadImage(){
    var c=document.getElementById("canvas");
    var ctx=c.getContext("2d");
    var img=document.getElementById("first");
    ctx.drawImage(img,0,0);
    var z1=ctx.getImageData(0, 0, 1, 1).data[0];
    document.getElementById("1").value=z1;
};

我收到以下错误：

Uncaught SecurityError: Failed to execute 'getImageData' on 'CanvasRenderingContext2D': The canvas has been tainted by cross-origin data.

我有什么想法可以达到我的要求？这是我正在创建一个绘制给定图片的遗传算法的项目的一部分。该项目的一个重要部分是比较初始图像（在画布中加载）和填充伪随机像素的画布的像素。然后，我向像素引入小方差，将其演变为初始图像。

如果我手动绘制画布（使用fillRect），我可以使用＆＃39; getImageData＆＃39;来检索像素数据。但是，当我使用图像（drawImage）绘制画布时，我得到了上面提到的错误。

请帮忙。

编辑：我已查看过：How to fix getImageData() error The canvas has been tainted by cross-origin data?

但事实并非如此。我正在从我自己的计算机上加载图像。我只是将.html，.js和.png文件放在同一个文件夹中并运行.html文件。

Answer 1

好的，我已经安装了WAMP，将所有内容放在“www”文件夹中并从那里运行。工作

无法从画布

1 个答案: