3

我使用屏幕外canvas根据某些变量的运行时值动态生成某些图像。在屏幕外画布上绘制图像后,我想获取它并在我的 web 应用程序的几个地方使用它。

策略 1:使用屏幕外画布的toDataURL()方法获取data:包含图像的 URI,我可以通过编程方式img在页面中应该显示它的多个元素上设置该 URI。

策略二:使用离屏画布的getImageData()方法获取ImageData实例。img用元素替换canvas元素并调用putImageData()它们。

哪种策略在记忆方面更有效?哪个更“惯用”?我试图避免重复保存显示图像实例所需的内存。其他建议?

4

1 回答 1

5

使用画布元素而不是 img 元素。

然后将内存中的画布绘制到屏幕画布上。一个画布元素可以使用另一个画布作为 drawImage 源:

context.drawImage(inMemoryCanvasElementReference,0,0);

顺便说一句,imageData 命令 (.getImageData.putImageData) 的内存效率非常低,因为它们构建了一个全新的像素数据数组。它们还缺乏性能,因为它们不是 GPU 加速的。

于 2015-10-21T14:49:28.020 回答