IE9的HTML5 Canvas getImageData(）函数存在问题

IE9 has problems with HTML5 Canvas getImageData() function

本文关键字：函数 存在 问题 getImageData HTML5 Canvas IE9      更新时间：2023-09-26

由于某些原因，下面的代码将无法工作。它停在有getImageData的线路上。IE9抛出此错误：SCRIPT5022: DOM Exception: INDEX_SIZE_ERR (1)。有解决办法吗？然而，它在Chrome和FF中都有效。

//Select our canvas and context
var canvas = document.getElementById("imageCanvas");
var context = canvas.getContext('2d');
//Select the image from the DOM
var selectedImage = document.getElementById("image");
//Draw the image to the canvas then read in the data
context.drawImage(selectedImage, 0, 0);
var originalLakeImageData = context.getImageData(0,0, width, height);
//Image data is now stored in an array in the form
//originalLakeImageData.data = [r1, g1, b1, a1, r2, g2, b2, a2....]

注意：以上代码不是我的代码。消息来源在这里。然而，我的问题与这个例子完全相同。要查看错误IE9，请尝试此链接

刚在搜索另一个问题时遇到您的问题。您遇到的问题与CSS中将oldImage设置为display: none有关。这将导致width和height属性为零。

您应该尝试使用visibility: hidden。CSS display:none意味着根本不应该显示元素，但visibility:hidden意味着元素在那里，但不可见。这是一个微小的差异，但应该会让你的例子发挥作用。

你也可以使用绝对定位和z索引来"隐藏"你想要看到的图像后面的其他图像。

相关文章：