问题标签 [putimagedata]

我对 Html5 很陌生，我想知道是否有人可以对此有所了解：

根据我对 Html5 的有限知识，除了不断显示“图像”之外，这段代码应该什么都不做。但是相反，图像很快就烧成了几乎白色，这表明每次从画布读取或写入画布时，imageData 都会发生轻微变化......

基本上我想淡化鼠标所在的图像，以便在鼠标移动时显示背景图像。有没有办法解决这个问题，还是我必须在这个过程中变得更有创意？无论如何我可以操纵“图像” ImageData 而不是每次都从画布上获取它？

在此先感谢，我尝试使用 jpg 和 png 并加载到 DOM 而不是通过 image.src 但它们都有相同的问题。

顺便说一句，使用最新的 Chrome。

这是 requestionAnimationFrame 的设置，用于处理故障转移到 SetTimeout 的一系列浏览器：

这是画布的代码

这就是所有的代码。

由于 putImageData 不受变换的影响，我如何操作图像中的像素然后对结果使用变换？例如，我想让图片中的红色更亮，然后将图片旋转 36 度。

使用 putImageData 似乎不是答案，因为我无法旋转它。我尝试放在一个新的画布上并使用 drawImage(newCanvas,0,0) 但这甚至根本没有绘制图像。

我难住了。

我要做的是 context.createImageData(xxx,xxx) 然后获取该图像数据并对其进行操作，然后使用图像数据 context.createPattern(imagedata, 'repeat') 用图像数据填充我绘制的对象我程序化了。我遇到的问题是 createPattern 接受图像对象而不是图像数据对象。所以我需要找到一种将图像数据对象转换为图像对象的方法，或者找到一种更好的方法来使用程序生成的图像填充（）。

感谢您的帮助！！

有没有办法使用 getImageData 和 putImageData 来缩放画布。下面是代码片段。

我已经试过了http://jsbin.com/efixur/1/edit。

谢谢阿杰恩

我想知道是否有任何方法可以从之前从画布元素获得的 imageData 创建新图像？

我已经寻找解决方案，但他们似乎都将结果绘制到画布上。因此，如果可能的话，基本上我需要一种将 ImageData 对象直接转换为 Image 的方法。

我正在从事 2D/3D 图形项目，但遇到了性能问题。

我的算法需要两张图像：一张图片和相对灰度深度图。我还有一组 10 个画布（“图层”）最初是空白的。注意：所有图像具有相同的尺寸。

我需要检查深度图的每个像素 X;Y，并根据其颜色值访问 10 个画布之一并在其上绘制原始图像的 X;Y 像素。

结果算法类似于：

在 200x200 的图像上完成这样的循环大约需要 3 分钟！我很确定缓慢是由最后一个函数 putImageData 引起的。有没有更快的方法以我需要的方式绘制像素？谢谢

我正在尝试使用 PDF.js 阅读整个 .pdf 文档，然后在单个画布上呈现所有页面。

我的想法：将每个页面渲染到画布上并获取 ImageData (context.getImageData())，清除画布做下一页。我将所有 ImageDatas 存储在一个数组中，一旦所有页面都在那里，我想将数组中的所有 ImageDatas 放到一个画布上。

所以从我理解的方式来看，这应该有效，对吧？当我运行它时，我最终得到的画布足够大，可以包含 pdf 的所有页面，但不显示 pdf ......

感谢您的帮助。

我正在开发一个可以加密图像并在画布上重绘解密图像的项目。由于我对编码和编程仍然很陌生，因此我目前在重绘解密的图像数据时遇到问题，这是一个 R、G、B、A 形式的像素数组。我认为只需将数据放入

但是萤火虫告诉我该值没有实现图像数据的接口。我已经在这里发布了整个数组。图像宽 160 像素，高 120 像素。

有没有办法重新格式化数组，使其可以在画布上绘制？

我正在尝试创建一些像这样的图像的黑白副本

对于某些图片，它可以完美运行，而对于某些图片，我会得到这种倾斜的结果，正如您在链接上看到的那样。

这是我的代码：