// to play about

link1 = 'https://discourse.processing.org/t/blurred-image-instead-of-pixels-visible/14071/3'

link2 = 'https://p5js.org/reference/#/p5/createImage'

link3 = 'https://p5js.org/reference/#/p5.Image'

​

/*

 * @name Create Image

 * @description The createImage() function provides a fresh buffer of pixels to play with.

 */

​

let img;              // Declare variable 'img' for a PImage pixelbuffer.

let iw = 255,

    ih = 255;

​

function setup() {

  createCanvas(400, 400);

  img = createImage(iw, ih);

  img.loadPixels();

  for (let x = 0; x < iw; x++)

    for (let y = 0; y < iw; y++)

      img.set(x, y, [255, 255, 0, 255-x]);

  img.updatePixels();

  //noSmooth();  // try  @micycle

  print(link1+'\n'+link2+'\n'+link3);

}

​

function draw() {

  background(0);

  image(img, 0, 0);

  //image(img, 0, 0, mouseX, mouseY);  // test stretch

}