getImageData函数的问题
getImageData函数的问题
提问于 2011-07-11 16:49:57
因此，我在<script>部件中创建的"context“变量上使用了此函数getImageData，当我执行某些操作时，例如绘制一个矩形，然后执行ctx.getImageData.data，它将显示我在画布上绘制的矩形的红色值。但是，当我导入图像并将其绘制到画布上，并尝试使用getImageData.data时，我得到的所有结果都是0，这没有任何意义，我不确定为什么它不能正确读取图像。我已经尝试过这方面的教程，但它们都是模糊的，只有片断写在一起。
因此，当我绘制矩形时，它的颜色值显示得很好，但同样，当我绘制图像时，即使没有在画布上绘制矩形，我也无法获得图像上特定像素的值。
有人能帮我吗？这是我当前的代码：
<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>回答 2
Stack Overflow用户
回答已采纳
发布于 2011-07-14 00:35:54
下面的提示有什么意义吗？
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(", "));
}Stack Overflow用户
发布于 2011-07-11 17:35:26
可能是图像是透明的。尝试使用单色非透明图像。
您使用的是哪种浏览器？不允许在从另一个域加载图像时使用getImageData (安全问题)，如果我没记错的话，有些浏览器在本地运行脚本时在确定域时会出现问题
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/6647748
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号