0

我正在尝试开发一个基本的 JavaScript 绘图脚本。

该脚本工作正常，但我的问题不是控制台记录每个像素所在的位置。它可以简单地记录一个数组吗？所以基本上如果前一个像素的颜色与循环中的当前像素相同，则将该像素坐标添加到数组中。如果它与前一个像素的颜色不匹配，请记录该数组，然后创建一个新数组并重复。

我希望有人能理解我的意思，最终我想保存点击或控制台日志。

我试图通过创建一个数组并使用 lineArray.push(x, y) 将 curXY 添加到数组中来实现这一点，但它似乎失败了。

这是我的脚本：

var image = new MarvinImage();
image.load("https://i.imgur.com/rrc2Qjl.png", imageLoaded);
var precolor = '000000';
var curcolor = '';

var preXY = (0, 0);
var curXY = (0, 0);
var lineArray = ["0,0"]

function imageLoaded() {
    for (var y = 0; y < image.getHeight(); y = y + 1) {
        for (var x = 0; x < image.getWidth(); x = x + 1) {

            var red = image.getIntComponent0(x, y);
            var green = image.getIntComponent1(x, y);
            var blue = image.getIntComponent2(x, y);
            var alpha = image.getAlphaComponent(x, y);

            //Make it into a RBG value. // rgb("255,255,255") /example/
            var RGBCOLOR = "rgb(" + red + "," + green + "," + blue + ")";
            //console.log(alpha)

            //Convert the RBG to HEX.
            var changetohex = RGBCOLOR.split("(")[1].split(")")[0];
            changetohex = changetohex.split(",");
            var hexcolor = changetohex.map(function(x) { //For each array element
                x = parseInt(x).toString(16); //Convert to a base16 string
                return (x.length == 1) ? "0" + x : x; //Add zero if we get only one character
            });
            hexcolor = hexcolor.join("");

            //set the curcolor var as the current pixel color from loop.
            curcolor = hexcolor
                //set the curXY var as the current XY pixel from loop.
            curXY = (x, y);

            //if the previous pixel color matches the current pixel's color from the loop.
            if (precolor === curcolor) {
                //SOMEHOW ADD THAT PIXEL'S COORDS TO THE ARRAY.
                lineArray.push(x, y)
                console.log(lineArray)
                    //console.log('This pixel color is same as last pixel color.')
            } else {
                precolor = curcolor
                    //console.log(precolor)
            }

        }

    }
}

4

1 回答 1

1

lineArray 可以是简单的声明

var lineArray = []

你应该准备一个像这样的对象来保留每个点。

           //if the previous pixel color matches the current pixel's color from the loop.
            if (precolor === curcolor) {
                //SOMEHOW ADD THAT PIXEL'S COORDS TO THE ARRAY.
                let point={"x":x,"y":y};
                lineArray.push(point)
                console.log(lineArray)
                    //console.log('This pixel color is same as last pixel color.')
            } else {
                precolor = curcolor
                    //console.log(precolor)
            }
于 2020-02-10T23:59:10.063 回答