Javascript图像数据到多维数组性能问题

Javascript image data to multidimensional array performance issues

本文关键字：数组 性能 问题 图像 数据 Javascript      更新时间：2023-09-26

我编写了一个将画布图像数据数组转换为基于多维坐标的数组的方法，如下所示：

parse: function() {
    var x = y = 0;
    var step = 0;
    for(var i = 0; i <= this.imageData.length - 4; i += 4) {
        if(step == this.width) {
            ++ y;
            step = 0;
        }
        this.data[x][y] = [this.imageData[i],
                           this.imageData[i+1],
                           this.imageData[i+2],
                           this.imageData[i+3]];
        ++ x;
        ++ step;
    }
}

我已经在较小的规模（10x10 图像）上对其进行了测试，但是当我移动到更大的图像（在我的情况下为 800x800）时，它会完全崩溃浏览器（选项卡）。我可以理解为什么，但是，我想知道是否有更有效的方法可以解决这个问题。

有什么想法吗？

你可以通过

利用%（模）运算符来做一些数学运算，如下所示：

var floor = Math.floor; // store a reference to Math.floor, anything goes when you have 640,000 iterations 
parse: function(imageHeight, imageWidth) {
    for(var i = 0; i < this.imageData.length; i++) {
        this.data[i % imageWidth][Math.floor(i/imageHeight)] = [this.imageData[i],
                           this.imageData[i+1],
                           this.imageData[i+2],
                           this.imageData[i+3]];
    }
}​

当然，您必须提出imageHeight和imageWidth的值。

相关文章：