Infinite loop error when trying to get pixels of an image

[madebygomez1]

Hi there! This is part of a larger build where I need to store the coordinates of the black pixels in an image.

Here though, as a test I was first trying to simply change any pixel with an alpha of 255 to red.

The for loop is creating an infinite loop error. This doesn’t seem to happen in older versions (I’m using 2.3.4 right now) but it also doesn’t work either in older versions. My theory is that the image is just too big – I’m loading in an image at 4K resolution

It actually does start running before it hits the error as seen in the screenshot. I tried turning off loop protection and that just crashed the tab. Any help realllly appreciated as this is for an assignment due tomorrow.

Thanks!

let img;

async function setup() {
  createCanvas(windowWidth, windowHeight);

  img = await loadImage('silhouette.png');

  img.loadPixels();

  for (let i = 0; i < img.pixels.length; i += 4) {
    if (img.pixels[i + 3] > 1) {
      // Red.
      img.pixels[i] = 255;
    }
  }

  img.updatePixels();
}

function draw() {
  background(img);

}