# How do I change where the drawing is happening

**URL:** <https://discourse.processing.org/t/how-do-i-change-where-the-drawing-is-happening/28658>\
**Category:** Coding Questions\
**Created:** [March 19, 2021, 12:20pm UTC](https://discourse.processing.org/t/how-do-i-change-where-the-drawing-is-happening/28658 "2021-03-19T12:20:40Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![Saad-py](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/saad-py/32/12469_2.png) [@Saad-py](https://discourse.processing.org/u/Saad-py)\
**Post date:** [March 19, 2021, 12:20pm UTC](https://discourse.processing.org/t/how-do-i-change-where-the-drawing-is-happening/28658/1 "2021-03-19T12:20:41Z")

</div>

My code:

```auto
float x = 0.10;

float y = 0.0;
float z = 0.0;

float a = 10;
float b = 28;
float c = 8.0/3.0;

ArrayList<PVector> points = new ArrayList<PVector>();

void setup() {
  size(800, 600);
  colorMode(HSB);

}

void draw() {
  background(0);
  float dt = 0.01;
  float dx = (a * (y - x)) * dt;
  float dy = (x * (b - z) - y) * dt;
  float dz = (x * y - c * z)*dt;

  x = x + dx;
  y = y + dy;
  z = z + dz;

  points.add(new PVector(x, y, z));
  
  scale(5);
  stroke(255);
  noFill();
  beginShape(); 
  
  float hu = 0;
  for (PVector v : points) {
    stroke(hu, 255, 255);
    vertex(v.x-1, v.y-1);
    hu += 0.1;
    if (hu > 255) {
      hu = 0; 
    }
    
  }
  endShape();
  //println(x, y, z);
}

```

Hi, I am new to processing and I was making the lorenz attractor similar to the video of Daniel Shiffman on YouTube.

It was made in 3d but I want to create it into 2D because I am working on another project.  
I found that just getting rid of the peasycam and P3D option is ok but when I ran the program it was showing the program on the top left on the screen what exactly should I change.

If you want to know why I am doing this in 2D because I want to do some tests for the future because I want to get the simulation in the console using the Rust Programming language.

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [March 19, 2021, 2:23pm UTC](https://discourse.processing.org/t/how-do-i-change-where-the-drawing-is-happening/28658/2 "2021-03-19T14:23:04Z")

</div>

just use translate()

```auto

float x = 0.10;
float y = 0.0;
float z = 0.0;

float a = 10;
float b = 28;
float c = 8.0/3.0;

ArrayList<PVector> points = new ArrayList<PVector>();

void setup() {
  size(1200, 600);
  colorMode(HSB);

  //x+=width/2.0; 
  //y+=height/2.0;
}

void draw() {
  background(0);

  float dt = 0.01;
  float dx = (a * (y - x)) * dt;
  float dy = (x * (b - z) - y) * dt;
  float dz = (x * y - c * z)*dt;

  x = x + dx;
  y = y + dy;
  z = z + dz;

  points.add(new PVector(x, y));

  translate(width/2, height/2);
  scale(5);
  stroke(255);
  noFill();
  beginShape(); 

  float hu = 0;
  for (PVector v : points) {
    stroke(hu, 255, 255);
    vertex(v.x, v.y);
    hu += 0.1;
    if (hu > 255) {
      hu = 0;
    }
  }
  endShape();
  //println(x, y, z);
}

```

---

<div class="post-metadata">

**Author:** ![Saad-py](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/saad-py/32/12469_2.png) [@Saad-py](https://discourse.processing.org/u/Saad-py)\
**Post date:** [March 20, 2021, 1:21pm UTC](https://discourse.processing.org/t/how-do-i-change-where-the-drawing-is-happening/28658/3 "2021-03-20T13:21:30Z")

</div>

Thanks bro

But can You tell me what can i do without the translate function because in Rust there are no libraries that suppourt translate.

---

<div class="post-metadata">

**Author:** ![paulgoux](https://avatars.discourse-cdn.com/v4/letter/p/b9bd4f/32.png) [@paulgoux](https://discourse.processing.org/u/paulgoux)\
**Post date:** [March 20, 2021, 1:26pm UTC](https://discourse.processing.org/t/how-do-i-change-where-the-drawing-is-happening/28658/4 "2021-03-20T13:26:25Z")

</div>

All translate does is move your pvectors to an alternative point.

So by having

```auto
vertex(x+xoffset, y+yoffset) ;

```

Where the offset are variables you control, should do the trick

---

<div class="post-metadata">

**Author:** ![Saad-py](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/saad-py/32/12469_2.png) [@Saad-py](https://discourse.processing.org/u/Saad-py)\
**Post date:** [March 20, 2021, 1:58pm UTC](https://discourse.processing.org/t/how-do-i-change-where-the-drawing-is-happening/28658/5 "2021-03-20T13:58:49Z")

</div>

How would I implement that because when I try doing it, it moves the whole shape

---

<div class="post-metadata">

**Author:** ![glv](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/glv/32/18785_2.png) [@glv](https://discourse.processing.org/u/glv)\
**Post date:** [March 20, 2021, 2:16pm UTC](https://discourse.processing.org/t/how-do-i-change-where-the-drawing-is-happening/28658/6 "2021-03-20T14:16:44Z")

</div>

> [@Saad-py](#):
>
> it was showing the program on the top left on the screen what exactly should I change.

Check out the resources (tutorials, examples, examples and more…) here:  
_[https://processing.org/](https://processing.org/)_

For starters:  
_[2D Transformations / Processing.org](https://processing.org/tutorials/transform2d/)_

I often move the origin to center of canvas at the start of the sketch:

`translate(width/2, height/2);`

`:)`

---

<div class="post-metadata">

**Author:** ![paulgoux](https://avatars.discourse-cdn.com/v4/letter/p/b9bd4f/32.png) [@paulgoux](https://discourse.processing.org/u/paulgoux)\
**Post date:** [March 20, 2021, 2:18pm UTC](https://discourse.processing.org/t/how-do-i-change-where-the-drawing-is-happening/28658/7 "2021-03-20T14:18:02Z")

</div>

Declare your offsets in your sketch and add assign values you feel are appropriate thats it. And add offsetx and offsety to your vertex.

Its honestly that simple.

---

<div class="post-metadata">

**Author:** ![Saad-py](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/saad-py/32/12469_2.png) [@Saad-py](https://discourse.processing.org/u/Saad-py)\
**Post date:** [March 20, 2021, 4:11pm UTC](https://discourse.processing.org/t/how-do-i-change-where-the-drawing-is-happening/28658/8 "2021-03-20T16:11:45Z")

</div>

No bro I cant get it can you post the code

Edit:  
`Thanks I got it`

I will let you know more