Shifted Mouse Coordinates

Zac

I am trying to make a paint-style program with a canvas in the middle. However the mouse coordinates are shifted in the PGraphics when I click.

Can someone please have a look at this break down of the code and tell me where I am going wrong?

`PGraphics canvas; int rect[] = new int[1]; int rect2[] = new int[1];

void setup() { size(1000, 750); canvas = createGraphics(500, 500); imageMode(CORNERS); rect[0] = 100; rect2[0] = 100; }

void draw() { canvas.beginDraw(); canvas.background(100); canvas.line(10, 0, 1100, 1100); for(int i = 0; i < rect.length; i++) canvas.rect(rect[i], rect2[i], 10, 10); canvas.endDraw(); image(canvas, 50, 50, 500, 500); }

void mouseClicked() { rect = append(rect, mouseX); rect2 = append(rect2, mouseY); println(mouseX); } `

Thanks

Alex_Pr

You did not take into account the reference point of the canvas.

PGraphics canvas; 
int rect[] = new int[1]; 
int rect2[] = new int[1];

void setup() { 
  size(1000, 750); 
  canvas = createGraphics(500, 500); 
  imageMode(CORNERS); 
  rect[0] = 100; 
  rect2[0] = 100;
}

void draw() { 
  canvas.beginDraw(); 
  canvas.background(100); 
  canvas.line(10, 0, 1100, 1100); 
  for (int i = 0; i < rect.length; i++) canvas.rect(rect[i], rect2[i], 10, 10); 
  canvas.endDraw(); 
  image(canvas, 250, 125, 750, 625);
}

void mouseClicked() { 
  rect = append(rect, mouseX-250); 
  rect2 = append(rect2, mouseY-125); 
  println(mouseX);
}

Zac

Turns out that was a problem with the example provided but I realised the issue was that when the graphics is larger than the image() dimensions it warps the image.

What I need is a way to load the image at the default resolution and only show the portion a certain portion of the graphic through the image.

(Which I worked out from another post now I found now that I better understand my problem)