我在Chrome 39和屏幕外画布渲染方面遇到了一些问题。当我将6000x4000 JPEG image加载到普通元素中时,它工作正常:
var img = document.getElementById('org');
img.src = "https://s3.eu-central-1.amazonaws.com/transferxl-public/Monkeys-6000x4000.jpg";
图片如下所示:
当我通过屏幕外图像加载并将其渲染到画布时,当启用Chrome硬件加速时,它会在很多计算机上崩溃:
var img = document.createElement('img');
img.onload = function() {
var canvas = document.getElementById('canvas');
canvas.width = img.width;
canvas.height = img.height;
var context = canvas.getContext('2d')
context.drawImage(img, 0, 0);
};
img.src = "https://s3.eu-central-1.amazonaws.com/transferxl-public/Monkeys-6000x4000.jpg";
图像失真(见下文)并将图像绘制到画布上需要大约10秒钟(并阻止GUI线程):
当Chrome的硬件加速功能被禁用时,一切正常。有人知道如何解决这个问题吗?我可以从Javascript禁用Chrome的硬件加速,还是您知道其他解决方案?
可以在http://jsfiddle.net/ramondeklein/k0wtaq9m/1/上找到演示此问题的完整小提琴。