Reading pixels from an image

p5.js Coding Questions
10

OK, let’s try another piece of code with the polar_bear.jpg file:

let img;

function preload() {
  img = loadImage("polar_bear.jpg");
}

function setup() {
  createCanvas(653, 320);
  noLoop();
}

function draw() {
  img.loadPixels();
  for (let i = 0; i < img.pixels.length; i += 4) {
    img.pixels[i + 1] = 0;
    img.pixels[i + 2] = 0;
  }
  img.updatePixels();
  image(img, 0, 0);
}

If you run it exactly as is, you should see the image with only its red component. Please let us know what happens.

It is best to format code when you post it. See Guidelines—Asking Questions. It includes information on formatting code.