0

我现在正在做的是，我得到所有像素var getPixels = require("get-pixels")，然后我用这个代码循环像素数组：

var pixelation = 10;
var imageData = ctx.getImageData(0, 0, img.width, img.height);
var data = imageData.data;

for(var y = 0; y < sourceHeight; y += pixelation) {
    for(var x = 0; x < sourceWidth; x += pixelation) {
        var red = data[((sourceWidth * y) + x) * 4];
        var green = data[((sourceWidth * y) + x) * 4 + 1];
        var blue = data[((sourceWidth * y) + x) * 4 + 2];

        //Assign
        for(var n = 0; n < pixelation; n++) {
            for(var m = 0; m < pixelation; m++) {
                if(x + m < sourceWidth) {
                    data[((sourceWidth * (y + n)) + (x + m)) * 4] = red;
                    data[((sourceWidth * (y + n)) + (x + m)) * 4 + 1] = green;
                    data[((sourceWidth * (y + n)) + (x + m)) * 4 + 2] = blue;
                }
            }
        }

    }
}

这种方法的问题是结果图像太锐利。在此处输入图像描述

我正在寻找的是类似于 ImageMagick -sale 完成的这个

在此处输入图像描述

我用于第二个的命令是

convert -normalize -scale 10% -scale 1000% base.jpg base2.jpg

这种方法的问题是我不知道如何指定实际的像素大小。

那么是否有可能通过该for循环获得第二个结果。或者更好地使用 imagemagick -scale 但如果有人可以帮助数学，那么我可以拥有实际的像素大小会很棒。

4

2 回答 2

2

不确定您正在努力解决什么数学问题，但如果我们从这样的 600x600 图像开始：

在此处输入图像描述

然后，如果您希望最终图像的宽度只有 5 个块状像素，页面下方只有 5 个块状像素，您可以将其缩小到 5x5，然后再将其缩放回原来的大小：

convert start.png -scale 5x5 -scale 600x600 result.png

在此处输入图像描述

或者，如果您想使用 10x10 块状像素：

convert start.png -scale 10x10 -scale 600x600 result2.png

在此处输入图像描述

于 2016-11-28T09:19:14.677 回答
0

你写这个的方式，图像被处理成大小由你的变量指定的nxn像素。增加将提供所需的“粗糙度”。npixelationpixelation

于 2016-11-27T20:47:00.647 回答