getImageData函數的問題

所以，我在<script>部分內部製作的「context」變量上使用了該函數的getImageData，並且當我執行諸如繪製矩形之類的東西時，請執行ctx.getImageData.data [0]它會顯示我畫在畫布上的矩形的紅色值。但是，當我導入圖像並將其繪製到畫布上，並嘗試使用getImageData.data [0]時，我得到的全部爲0，這是沒有意義的，我不確定它爲什麼不能正確讀取圖像。我已經嘗試過這方面的教程，但他們都是模糊的，只有段被編寫在一起。因此，當我繪製矩形時，它的顏色值顯得很好，但是當我繪製圖像時，即使沒有在畫布上繪製矩形，我也不會獲取圖像上特定像素的值。getImageData函數的問題

有人可以幫助我嗎？這是我的當前代碼：

<html> 
<head> 
<title> 
Color Test :) 
</title> 
</head> 

<body> 

<canvas id = "ColorTest" width = "500" height = "500"> 
please don't use 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>

來源

2011-07-11 Feng Huo

下列警報是否合理？

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(", ")); 
}

來源

2011-07-13 16:35:53

這可能曾經工作過一次，但唉，不再。（至少在本地主機文件系統上運行時）。錯誤消息是'Uncaught SecurityError：'CanvasRenderingContext2D'上執行'getImageData'失敗：畫布已被交叉源數據污染。 – zipzit

這可能是圖像是透明的。嘗試使用單色非轉印圖像。

您使用的瀏覽器是？從另一個域加載圖像時使用getImageData是不允許的（安全問題），如果我沒有記錯的話，有一些瀏覽器在運行腳本時確定域名時遇到問題本地化

來源

2011-07-11 09:35:26 Rickard

getImageData函數的問題

回答

相關問題