Search code examples
javascriptjquerytampermonkey

Parse image pixel coordinates from URL


Is it possible to parse a image's pixel coordinates from a URL?

Possibly log each pixel coordinate and the hex value of that current pixel index using variables and forEach?

var pixelcoord = foo..

var hexcolorofcoord = foo.

console.log(pixelcoord) //example output = 123, 456

console.log(hexcolorofcoord ) //example output = #fff000


Solution

  • Solved using MarvinJ.

    image = new MarvinImage();
    image.load("https://i.imgur.com/2sGyojB.png", imageLoaded);
    
    function imageLoaded() {
    
    for (var y = 0; y < image.getHeight(); y++) {
        for (var x = 0; x < image.getWidth(); x++) {
            var red = image.getIntComponent0(x, y);
            var green = image.getIntComponent1(x, y);
            var blue = image.getIntComponent2(x, y);
            var alpha = image.getAlphaComponent(x, y);
            var RBGCOLOR = "rgb(" + red + "," + green + "," + blue + ")";
    
            var HexColor = red.toString(16) + green.toString(16) + blue.toString(16)
    
            if (HexColor === "ffffff") {
                console.log("White") // If it's a white pixel, log
            } else {
                console.log(HexColor) // Log the hex color.
                console.log(x + " : " + y) // Log the X & Y coordinates for each pixel.
            }
    
        }
    }
    }