How to get the color value for a pixel in canvas

Gmacro

I'm try to get a pixels[] type value for a pixel in the canvas, but all the methods I've found seem to deal exclusively with images as far as I can tell. Is there a way to use loadPixels() and subsequently pixels[] on the canvas or is it necessary to turn the canvas into an image somehow in order to sample it?

jeremydouglass

You want get() -- https://p5js.org/reference/#/p5/get

GoToLoop

http://p5js.org/reference/#/p5/pixels[]

Gmacro

I tried get, but it just returns the color of the canvas background, even through objects of other colors

jeremydouglass

I'm try to get a pixels[] type value for a pixel in the canvas

You have to draw those objects to the canvas first, then use get or pixels to check the canvas. If you call background and then check a color when you haven't actually drawn your object yet, get() and pixels[] will only see background.

Gmacro

I have drawn the objects to the canvas at that point. The sketch has a bunch of line objects emanating from the center of the canvas, and even after drawing the lines, calling get on the center (or any other) pixel just returns the background color.

Edit: it seems like the real problem is something to do with how I'm passing the pixel value to get, because random patches of the canvas show up as the object color, even though the object itself does not. I'm calling get as mycolor = get(mouseX, mouseY);

Is there some way this could be getting other pixels for some reason

jeremydouglass

Well, this is clearly a bug -- probably in your code, although possibly somewhere else. You really need to share a short, complete sketch if you want feedback on this.

The line you shared is trying to get whatever color is under the mouse pointer at that moment.

Try a test sketch with a rect? does a rect work? Start with it work, change until it doesn't work, then figure out why not.

var mycolor;
function setup() {
}
function draw() {
  background(0);
  fill(255,0,0);
  rect(10,10,20,20);
  mycolor = get(mouseX, mouseY);
  if(red(mycolor) == 255){
    fill(255,255,255);
    rect (40,40,20,20);
  }
}