# Rotate arc in pacman animation
**URL:** https://discourse.processing.org/t/rotate-arc-in-pacman-animation/45367
**Category:** Coding Questions
**Created:** [November 21, 2024, 10:34am UTC](https://discourse.processing.org/t/rotate-arc-in-pacman-animation/45367 "2024-11-21T10:34:00Z")
**Posts on this page:** 5
**Page:** 3
### Author:  [@svan](https://discourse.processing.org/u/svan)
#### Post date: [November 27, 2024, 1:24am UTC](https://discourse.processing.org/t/rotate-arc-in-pacman-animation/45367/42 "2024-11-27T01:24:31Z")
This is one technique using pushMatrix()…rotate()…popMatrix:
```auto
float startAngle;
float endAngle;
float biteSize;
void setup() {
size(410, 200);
}
void draw() {
background(0);
fill(255, 255, 0);
// Update start and stop angles.
biteSize = PI / 16; //smaller the denominator, bigger the bite
startAngle = biteSize * sin(frameCount * 0.1) + biteSize;
endAngle = TWO_PI - startAngle;
// Draw the arc.
arc(50, 50, 80, 80, startAngle, endAngle, PIE);
pushMatrix();
translate(150,50);
rotate(radians(90));
arc(0, 0, 80, 80, startAngle, endAngle, PIE);
popMatrix();
pushMatrix();
translate(250,50);
rotate(radians(180));
arc(0, 0, 80, 80, startAngle, endAngle, PIE);
popMatrix();
pushMatrix();
translate(350,50);
rotate(radians(270));
arc(0, 0, 80, 80, startAngle, endAngle, PIE);
popMatrix();
}
```
**Alternate technique by changing start/end angles (converted to p5.js):**
```auto
var startAngle;
var endAngle;
let biteSize;
function setup() {
createCanvas(450, 200);
}
function draw() {
background(0);
fill(255, 255, 0);
biteSize = PI / 16; //smaller denominator => bigger bite
// Right
startAngle = radians(12) + biteSize * sin(frameCount * 0.1);
endAngle = radians(348) - biteSize * sin(frameCount * 0.1);
arc(50, 50, 80, 80, startAngle, endAngle, PIE);
// Left
startAngle = radians(-168.75) + biteSize * sin(frameCount * 0.1);
endAngle = radians(168.75) - biteSize * sin(frameCount * 0.1);
arc(150, 50, 80, 80, startAngle, endAngle, PIE);
// Up
startAngle = radians(-78.75) + biteSize * sin(frameCount * 0.1);
endAngle = radians(258.75) - biteSize * sin(frameCount * 0.1);
arc(250, 50, 80, 80, startAngle, endAngle, PIE);
// Down
startAngle = radians(-258.75) + biteSize * sin(frameCount * 0.1);
endAngle = radians(78.75) - biteSize * sin(frameCount * 0.1);
arc(350, 50, 80, 80, startAngle, endAngle, PIE);
}
```
---
### Author:  [@edufissure](https://discourse.processing.org/u/edufissure)
#### Post date: [November 27, 2024, 9:13am UTC](https://discourse.processing.org/t/rotate-arc-in-pacman-animation/45367/43 "2024-11-27T09:13:00Z")
@svan as promised:
Can you explain please the idea bitesize\*sin _framecount_0.1 where came from… ?
Also remember that you dont need to use radians(…) if you use angleMode(DEGREES); from that instruction and below…would use DEGREES in rotate and similar instructions that need values in radians.
Another detail, it seems that popMatrix and pushMatrix no longer exist…is pop and push
Its been a really interesting post ( created by me 😉 )
Thanks
---
### Author:  [@GoToLoop](https://discourse.processing.org/u/GoToLoop)
#### Post date: [November 27, 2024, 10:50am UTC](https://discourse.processing.org/t/rotate-arc-in-pacman-animation/45367/44 "2024-11-27T10:50:44Z")
> [@edufissure](#):
>
> … if you use `angleMode(DEGREES);`…
[**angleMode()**](https://p5js.org/reference/p5/angleMode/) doesn’t exist on PDE’s Java Mode’s API:
> **[Reference](https://processing.org/reference/)**
>
> Find further documentation of the Processing language
> [@edufissure](#):
>
> … it seems that **popMatrix()** and **pushMatrix()** no longer exist… it is **pop()** and **push()**.
Indeed for p5.js it has always been [**push()**](https://p5js.org/reference/p5/push/) & [**pop()**](https://p5js.org/reference/p5/pop/).
However on Java Mode:
1. [**pushMatrix()**](https://processing.org/reference/pushMatrix_.html)
2. [**popMatrix()**](https://processing.org/reference/popMatrix_.html)
3. [**pushStyle()**](https://processing.org/reference/pushStyle_.html)
4. [**popStyle()**](https://processing.org/reference/popStyle_.html)
have always existed!
Actually [**push()**](https://processing.org/reference/push_.html) & [**pop()**](https://processing.org/reference/pop_.html) were much later additions on Java Mode for p5.js interoperability.
---
### Author:  [@svan](https://discourse.processing.org/u/svan)
#### Post date: [November 27, 2024, 1:51pm UTC](https://discourse.processing.org/t/rotate-arc-in-pacman-animation/45367/45 "2024-11-27T13:51:46Z")
> [@edufissure](#):
>
> Can you explain please the idea bitesize\*sin _framecount_0.1 where came from… ?
Where did you get the source code initially? Usually there would be a reference to where the code originated.
Here is one reference on using sin() to drive animation: [https://stackoverflow.com/questions/40291618/animating-sine-waves-in-processing](https://stackoverflow.com/questions/40291618/animating-sine-waves-in-processing)
---
### Author:  [@edufissure](https://discourse.processing.org/u/edufissure)
#### Post date: [February 20, 2025, 10:02pm UTC](https://discourse.processing.org/t/rotate-arc-in-pacman-animation/45367/46 "2025-02-20T22:02:15Z")
The work of my class till today: [GitHub - ejgutierrez74/pacmanclasse: Repositori PacmanClasse](https://github.com/ejgutierrez74/pacmanclasse)
We changed the rotation for different images of pacman, as rotation for them was too difficult. I made classes and functions.
@svan @eightohnine @GoToLoop @glv
[Previous page](https://discourse.processing.org/t/rotate-arc-in-pacman-animation/45367.md?page=2)