# Make the object move in the circle (asteroids game)

**URL:** <https://discourse.processing.org/t/make-the-object-move-in-the-circle-asteroids-game/4606>\
**Category:** Coding Questions\
**Created:** [October 18, 2018, 4:01pm UTC](https://discourse.processing.org/t/make-the-object-move-in-the-circle-asteroids-game/4606 "2018-10-18T16:01:20Z")\
**Posts on this page:** 15\
**Page:** 1

<div class="post-metadata">

**Author:** ![nhghi](https://avatars.discourse-cdn.com/v4/letter/n/f0a364/32.png) [@nhghi](https://discourse.processing.org/u/nhghi)\
**Post date:** [October 18, 2018, 4:01pm UTC](https://discourse.processing.org/t/make-the-object-move-in-the-circle-asteroids-game/4606/1 "2018-10-18T16:01:20Z")

</div>

i have an object like an arrow and if i want to move all the arrow to move in the circle how can i do it

---

<div class="post-metadata">

**Author:** ![TfGuy44](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/tfguy44/32/41_2.png) [@TfGuy44](https://discourse.processing.org/u/TfGuy44)\
**Post date:** [October 18, 2018, 4:21pm UTC](https://discourse.processing.org/t/make-the-object-move-in-the-circle-asteroids-game/4606/2 "2018-10-18T16:21:24Z")

</div>

“Arrows moving in a circle” is not very descriptive.

Are the arrows contained inside a circle and moving about?  
Are the arrows going along a circle’s curve?  
Are the arrows staying in place and rotating?

Post your code. If you have no code, attempt to write some and post the attempt.  
Post a picture of what you’re trying to do as well. Even if it’s a crappy drawing in MS paint.

---

<div class="post-metadata">

**Author:** ![nhghi](https://avatars.discourse-cdn.com/v4/letter/n/f0a364/32.png) [@nhghi](https://discourse.processing.org/u/nhghi)\
**Post date:** [October 18, 2018, 4:39pm UTC](https://discourse.processing.org/t/make-the-object-move-in-the-circle-asteroids-game/4606/3 "2018-10-18T16:39:18Z")

</div>

this is my code a little messy:

```auto
float ship_Pos_X=250, 
  ship_Pos_Y=250, 
  angle_of_the_Ship=0, 
  d1=55, 
  d2=30, 
  angle_of_wing=0.7;
float x=0, 
  y=0, 
  x1=0, 
  y1=0, 
  x3=0, 
  y3=0;
float ship_Pos_X1=ship_Pos_X, 
  ship_Pos_Y1=ship_Pos_Y,
  angle_both_first=0,
  angle_both_second=0;
  
  
void setup()
{
  size(1000, 1000);
}
void draw()
{  
  calcPoints();
  drawSHIP();
  
  Move_Ship();
}

void calcPoints()
{

  x =cos(angle_of_the_Ship)*d1;
  y =sin(angle_of_the_Ship)*d1;
  angle_both_first=angle_of_the_Ship+angle_of_wing;
  angle_both_second=angle_of_the_Ship-angle_of_wing;
  x1=cos(angle_both_first)*d2;
  y1=sin(angle_both_first)*d2;
  x3=cos(angle_both_second)*d2;
  y3=sin(angle_both_second)*d2;
}

void drawSHIP()
{
  fill(255);
  quad(ship_Pos_X1, ship_Pos_Y1, ship_Pos_X1-x1, ship_Pos_Y1-y1, ship_Pos_X1+x, ship_Pos_Y1+y, ship_Pos_X1-x3, ship_Pos_Y1-y3);
 if (key=='d'||key=='l') {angle_of_the_Ship+=0.01;} 
  if (key=='a'||key=='j') {angle_of_the_Ship-=0.01;}
}
void Move_Ship()

{
ship_Pos_X1+=1;
ship_Pos_Y1+=1;

if (ship_Pos_X1>width){ship_Pos_X1=ship_Pos_X;}
if (ship_Pos_Y1>height){ship_Pos_Y1=ship_Pos_Y;}

}

void keyPressed()
{ 
}

```

like when I pressed “d” all of the ship will turn slowly to the right and will create a movement in a circle. I learn everything online so some of them may sound stupid. Hop you can help me.

---

<div class="post-metadata">

**Author:** ![TfGuy44](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/tfguy44/32/41_2.png) [@TfGuy44](https://discourse.processing.org/u/TfGuy44)\
**Post date:** [October 18, 2018, 5:15pm UTC](https://discourse.processing.org/t/make-the-object-move-in-the-circle-asteroids-game/4606/4 "2018-10-18T17:15:27Z")

</div>

So basically you want an Asteroids ship. Why don’t people just say that?

(Hmm… maybe they don’t realize that this is what they’re making??)

```auto
class Ship {
  PVector p, v;
  float a;
  Ship() {
    p = new PVector( width/2, height/2 );
    v = new PVector( 0, 0 );
  }
  void draw() {
    simulate();
    render();
  }
  void simulate() {
    if ( key_down[2] ) { // LEFT
      a-=0.1;
    }
    if ( key_down[3] ) { // RIGHT
      a+=0.1;
    }
    a %= TWO_PI;
    if ( key_down[0] ) { // UP
      v.x+=.1*cos(a);
      v.y+=.1*sin(a);
    }
    p.x+=v.x;
    p.y+=v.y;
  }
  void render() {
    fill(255);
    translate(p.x, p.y);
    rotate(a);//map(millis()%7000,0,7000,0,TWO_PI));
    noStroke();
    quad(20, 0, -20, 10, -10, 0, -20, -10);
  }
}

Ship ship;

void setup() {
  size(1000, 1000);
  ship = new Ship();
}

void draw() {
  background(0);
  ship.draw();
}

char[] tracked_keys = { UP, DOWN, LEFT, RIGHT };
boolean[] key_down = { false, false, false, false };

void keyPressed() {
  keyTrack(true);
}

void keyReleased() {
  keyTrack(false);
}

void keyTrack(boolean b) {
  for ( int i = 0; i < tracked_keys.length; i++) {
    if ( keyCode == tracked_keys[i] ) {
      key_down[i] = b;
    }
  }
}

```

---

<div class="post-metadata">

**Author:** ![nhghi](https://avatars.discourse-cdn.com/v4/letter/n/f0a364/32.png) [@nhghi](https://discourse.processing.org/u/nhghi)\
**Post date:** [October 18, 2018, 6:14pm UTC](https://discourse.processing.org/t/make-the-object-move-in-the-circle-asteroids-game/4606/5 "2018-10-18T18:14:20Z")

</div>

thanks for your idea. but I faced a different with that, normally the ship will fly at a constant speed ( we didn’t to press anything). then when we press d or LEFT it should slowly move to the right, when we press a or RIGHT it should slowly turn to the right. the last one is when we press s or DOWN it stops turning, and fly in a straight line

---

<div class="post-metadata">

**Author:** ![TfGuy44](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/tfguy44/32/41_2.png) [@TfGuy44](https://discourse.processing.org/u/TfGuy44)\
**Post date:** [October 18, 2018, 7:45pm UTC](https://discourse.processing.org/t/make-the-object-move-in-the-circle-asteroids-game/4606/6 "2018-10-18T19:45:57Z")

</div>

Okay. This took a lot of fiddling to get right.

```auto
class Ship {
  PVector p, v;
  float a;
  float da = 0;
  Ship() {
    p = new PVector( width/2, height/5 );
    v = new PVector( 3, 0 );
  }
  void draw() {
    simulate();
    render();
  }
  void simulate() {
    if ( key_down[2] ) { // LEFT
      da = -radians(1);
    }
    if ( key_down[3] ) { // RIGHT
      da = radians(1);
    }
    if ( key_down[1] ) { // DOWN
      da = 0;
    }
    a = atan2(v.y,v.x);
    
    v.x=3*cos(a+da);
    v.y=3*sin(a+da);
    
    p.x+=v.x;
    p.y+=v.y;
  }
  void render() {
    fill(255);
    translate(p.x, p.y);
    rotate(a);//map(millis()%7000,0,7000,0,TWO_PI));
    noStroke();
    quad(20, 0, -20, 10, -10, 0, -20, -10);
  }
}

Ship ship;

void setup() {
  size(1000, 1000);
  ship = new Ship();
}

void draw() {
  background(0);
  ship.draw();
}

char[] tracked_keys = { UP, DOWN, LEFT, RIGHT };
boolean[] key_down = { false, false, false, true };

void keyPressed() {
  keyTrack(true);
}

void keyReleased() {
  keyTrack(false);
}

void keyTrack(boolean b) {
  for ( int i = 0; i < tracked_keys.length; i++) {
    if ( keyCode == tracked_keys[i] ) {
      key_down[i] = b;
    }
  }
}

```

NOTE: I set the RIGHT key\_down to true so the ship starts to turn immediately (for debug reasons, to keep the ship on the screen normally) - you’ll have to tap the right arrow to get controlling it properly.

---

<div class="post-metadata">

**Author:** ![nhghi](https://avatars.discourse-cdn.com/v4/letter/n/f0a364/32.png) [@nhghi](https://discourse.processing.org/u/nhghi)\
**Post date:** [October 18, 2018, 8:13pm UTC](https://discourse.processing.org/t/make-the-object-move-in-the-circle-asteroids-game/4606/7 "2018-10-18T20:13:56Z")

</div>

> [@TfGuy44](#):
>
> PVector

u did it, man  
but I don’t know how to use PVector so can u explain  
like I have the ship with coordinate  
quad (x,y,x1,y1,x2,y2,x3,y3)  
then I just need to add each value to some specific to make it move the same with u right?

---

<div class="post-metadata">

**Author:** ![TfGuy44](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/tfguy44/32/41_2.png) [@TfGuy44](https://discourse.processing.org/u/TfGuy44)\
**Post date:** [October 18, 2018, 8:22pm UTC](https://discourse.processing.org/t/make-the-object-move-in-the-circle-asteroids-game/4606/8 "2018-10-18T20:22:05Z")

</div>

I’m not actually making use of the PVector as a PVector; you could replace it with two `floats`, `px` and `py`.

The position `(px, py)` would then be the center of the ship’s position, instead of `(p.x, p.y)`. You could add `px` and `py` to each point for your quad, sure, or you could understand and use `translate()`, like I did.

---

<div class="post-metadata">

**Author:** ![nhghi](https://avatars.discourse-cdn.com/v4/letter/n/f0a364/32.png) [@nhghi](https://discourse.processing.org/u/nhghi)\
**Post date:** [October 18, 2018, 8:46pm UTC](https://discourse.processing.org/t/make-the-object-move-in-the-circle-asteroids-game/4606/9 "2018-10-18T20:46:11Z")

</div>

i still dont understand can u make it pls:frowning\_face:

---

<div class="post-metadata">

**Author:** ![TfGuy44](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/tfguy44/32/41_2.png) [@TfGuy44](https://discourse.processing.org/u/TfGuy44)\
**Post date:** [October 18, 2018, 8:49pm UTC](https://discourse.processing.org/t/make-the-object-move-in-the-circle-asteroids-game/4606/10 "2018-10-18T20:49:29Z")

</div>

Replace the PVector, which is just two floats, with two floats.

Instead of `PVector p;`, have `float px, py;`

Then instead of `p.x` and `p.y`, use `px` and `py`.

Then do the same thing for the PVector v. Use `float vx, vy;`.

---

<div class="post-metadata">

**Author:** ![nhghi](https://avatars.discourse-cdn.com/v4/letter/n/f0a364/32.png) [@nhghi](https://discourse.processing.org/u/nhghi)\
**Post date:** [October 19, 2018, 12:04am UTC](https://discourse.processing.org/t/make-the-object-move-in-the-circle-asteroids-game/4606/11 "2018-10-19T00:04:32Z")

</div>

thanks man i did it

```auto
float x=0,y=1;

void setup()
{
  size(500,500);
}
void draw()
{
rect(10+x,10,50,50);
x+=y;

if (x>width-50) {
}

```

but now it have more  
when it hit from any edge it should appear of the canvas to the opposite edge. For example, if it flies off the top of the canvas, it should reappear at the bot  
do u know how to do it ?

---

<div class="post-metadata">

**Author:** ![nhghi](https://avatars.discourse-cdn.com/v4/letter/n/f0a364/32.png) [@nhghi](https://discourse.processing.org/u/nhghi)\
**Post date:** [October 19, 2018, 12:05am UTC](https://discourse.processing.org/t/make-the-object-move-in-the-circle-asteroids-game/4606/12 "2018-10-19T00:05:18Z")

</div>

```auto
float ship_Pos_X=250, 
  ship_Pos_Y=250, 
  angle_of_the_Ship=0, 
  d1=55, 
  d2=30, 
  angle_of_wing=0.7;
float x=0, 
  y=0, 
  x1=0, 
  y1=0, 
  x3=0, 
  y3=0;
float ship_Pos_X1=ship_Pos_X, 
  ship_Pos_Y1=ship_Pos_Y,
  angle_both_first=0,
  angle_both_second=0;
  
  
void setup()
{
  size(1000, 1000);
}
void draw()
{  
  calcPoints();
  drawSHIP();
  
  Move_Ship();
  newDimension();
}

void calcPoints()
{

  x =cos(angle_of_the_Ship)*d1;
  y =sin(angle_of_the_Ship)*d1;
  angle_both_first=angle_of_the_Ship+angle_of_wing;
  angle_both_second=angle_of_the_Ship-angle_of_wing;
  x1=cos(angle_both_first)*d2;
  y1=sin(angle_both_first)*d2;
  x3=cos(angle_both_second)*d2;
  y3=sin(angle_both_second)*d2;
}

void drawSHIP()
{
  fill(255);
  quad(ship_Pos_X1, ship_Pos_Y1, ship_Pos_X1-x1, ship_Pos_Y1-y1, ship_Pos_X1+x, ship_Pos_Y1+y, ship_Pos_X1-x3, ship_Pos_Y1-y3);
 if (key=='d'||key=='l') {angle_of_the_Ship+=0.01;} 
  if (key=='a'||key=='j') {angle_of_the_Ship-=0.01;}
  if (key=='s' ||key=='k') {

  }

}
void Move_Ship()

{

ship_Pos_X1=ship_Pos_X1+cos(angle_of_the_Ship)*2;
ship_Pos_Y1=ship_Pos_Y1+sin(angle_of_the_Ship)*2;

if (ship_Pos_X1>width-30){ship_Pos_X1=ship_Pos_X;}
if (ship_Pos_Y1>height-30){ship_Pos_Y1=ship_Pos_Y;}
if (ship_Pos_X1<30) {ship_Pos_X1=-ship_Pos_X;}
if (ship_Pos_Y1<30) {ship_Pos_Y1=-ship_Pos_Y;}
}

void newDimension()
{
}

void keyPressed()
{ 

 
}

```

---

<div class="post-metadata">

**Author:** ![TfGuy44](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/tfguy44/32/41_2.png) [@TfGuy44](https://discourse.processing.org/u/TfGuy44)\
**Post date:** [October 19, 2018, 10:09am UTC](https://discourse.processing.org/t/make-the-object-move-in-the-circle-asteroids-game/4606/13 "2018-10-19T10:09:52Z")

</div>

Consider this sample code that demonstrates how to have an object seemlessly wrap its position around the screen. Notice that this involves drawing the object three times! And if you want it to wrap around vertically too, you may have to draw it nine times!

```auto
float x = 100;

void setup(){
  size(200,200);
}

void draw(){
  background(0);
  x += 4;
  x += width;
  x %= width;
  ellipse( x-width, 100, 20, 20 );
  ellipse( x, 100, 20, 20 );
  ellipse( x+width, 100, 20, 20 );
}

```

Understand the concepts this code presents, and then attempt to apply them to your own code. Post the code of your attempt (and format it for once - select the code and hit the FORMAT AS CODE button, which looks like this: \</\> ) for more help.

---

<div class="post-metadata">

**Author:** ![nhghi](https://avatars.discourse-cdn.com/v4/letter/n/f0a364/32.png) [@nhghi](https://discourse.processing.org/u/nhghi)\
**Post date:** [October 19, 2018, 2:47pm UTC](https://discourse.processing.org/t/make-the-object-move-in-the-circle-asteroids-game/4606/14 "2018-10-19T14:47:48Z")

</div>

I did it but now I have 2 more problems  
The first one is now I have to change the colour of the background every time i open it should be different  
The second is I have to create a gate ( with 2 rect) that spawned at top or bottom at the first time we try if we hit the gate the game stop and if we go through that gate the background change colour and the gate should spawn at left or right now  
I really appreciate if u can help me with this last one

---

<div class="post-metadata">

**Author:** ![TfGuy44](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/tfguy44/32/41_2.png) [@TfGuy44](https://discourse.processing.org/u/TfGuy44)\
**Post date:** [October 19, 2018, 5:56pm UTC](https://discourse.processing.org/t/make-the-object-move-in-the-circle-asteroids-game/4606/15 "2018-10-19T17:56:04Z")

</div>

Thread over. Continues here: [I need help for my asteroids game](https://discourse.processing.org/t/i-need-help-for-my-asteroids-game/4647)