Loading...
Logo
Processing Forum

rotate shape

in Programming Questions  •  2 months ago  

Hi,

I try to rotate a shape. The shape is a rect which is supposed to stay in the middle of the 500x500 (second window with map) screen.
It should turn to "theta" (variable submitted from my robot).

But when it rotates, it significantly moves away from the center.

What do I do wrong?

 

My code:

Copy code
  1. void setup(){
  2. Robot = createShape(RECT, 0, 0, 20, 16);
  3. Robot.setFill(255);
  4. }

  5. void draw(){
  6. Robot.resetMatrix();
  7. Robot.rotate(-theta);
  8. Robot.translate(240,242);
  9. Map.papplet.shape(Robot);
  10. }


Thanks
Robert

Replies(4)

Re: rotate shape

2 months ago
Changed topic type to questions.

Your code example is not runnable.

The problem is you are not using the examples that come with Processing to acquire basic knowledge.

See: File > Examples > Basic > Transform

Then you will learn that you have to first use translate() to change the center of rotation and then use rotate().

Re: rotate shape

2 months ago

Thanks for the instruction.

I changed the topic type and I'll try to provide running code.

I used the examples as well as checking older posts. Rotating the whole screen worked for me. My main confusion came from trying to rotate the shape and not the rest of the screen. Didn’t get it to work correctly. Certainly a mistake on my side .. but I was not able to find it. 


What works:

Copy code
  1. PShape Robot;
  2. float theta = 0;

  3. void setup (){
  4. size(500, 500, P2D);
  5. frameRate(10); 
  6. Robot = createShape(RECT, -9.5, -8, 19, 16);
  7. Robot.setFill(255);
  8. }

  9. void draw(){
  10. background(255);
  11. theta += 0.1;

  12. pushMatrix();
  13. translate(250,250);
  14. rotate(-theta);
  15. shape(Robot);
  16. popMatrix();
  17. }


What doesn’t work is rotating the shape. Doesn’t matter where I place the translate. (well, it matters but I don’t get the point on how I have to do it)

I imagine that I can rotate the object independent from the rest of the screen and then draw the rotated object. Maybe that’s not correct?


Copy code
  1. PShape Robot;
  2. float theta = 0;

  3. void setup (){
  4. size(500, 500, P2D);
  5. frameRate(10); 
  6. Robot = createShape(RECT, -9.5, -8, 19, 16);
  7. Robot.setFill(255);
  8. }

  9. void draw(){
  10. background(255);
  11. theta += 0.1;

  12. Robot.resetMatrix();
  13. Robot.translate(0,0);
  14. Robot.rotate(-theta);
  15. Robot.translate(250,250);
  16. shape(Robot);
  17. }


Thanks
Robert


Re: rotate shape

2 months ago
These translation / rotation combinations can be difficult to get right, indeed.
You generally don't rotate in the shape, but rotate the shape like you do for all graphics assets. At least, that's what I do...

Copy code
  1. PShape robot;
  2. float theta;
  3.  
  4. void setup (){
  5. size(500, 500, P2D);
  6. frameRate(10);
  7. robot = createShape(RECT, -9.5, -8, 19, 16);
  8. robot.setFill(255);
  9. }
  10.  
  11. void draw(){
  12. background(255);
  13. theta += 0.1;
  14.  
  15. pushMatrix();
  16. translate(250, 250);
  17. rotate(-theta);
  18. shape(robot);
  19. popMatrix(); // Not necessary as it is reset at the end of draw, but useful if you want to draw something after this point
  20. }

Re: rotate shape

2 months ago
Thanks a lot for the response.
I thought I could save some of the rotation work.

Processing is really great. But rotating something is a pain. Should be a oneliner. :-)

Thanks
Robert