Processing mapping function - help

Hello,
I have to code 2 circles that are following the mouse. But the red one stays inside the square and I have to do it with the map() function but I don’t really understand it. It’s not working. Could someone help me out?
Thanks in advance!

void setup() {
  surface.setTitle("Mapping");
  size(600, 600);
  surface.setLocation(CENTER, CENTER);
}

void draw() {
  background(0);
  stroke(255);

  fill(255, 255, 255);
  circle(mouseX, mouseY, 20);
  mouseMoved();
  text("Maus X/Y:"+mouseX+"/"+mouseY, 250, 300);

  fill(255, 0, 0);
  float  col = map(mouseX, 300, 500, 300, 500);
  circle(mouseX, mouseY, 20);
  mouseMoved();
  text("map to:"+mouseX+"/"+mouseY, 255, 320);

  rectMode(CENTER);
  noFill();
  rect(300, 300, 400, 400);
}

Take a look at the example in the references:

https://processing.org/reference/map_.html

Please format your code as a courtesy to the community:
https://discourse.processing.org/faq#format-your-code

:)

1 Like