# Camera move on z

**URL:** <https://discourse.processing.org/t/camera-move-on-z/28724>\
**Category:** Coding Questions\
**Created:** [March 22, 2021, 12:56pm UTC](https://discourse.processing.org/t/camera-move-on-z/28724 "2021-03-22T12:56:15Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![xyzaw](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/xyzaw/32/12492_2.png) [@xyzaw](https://discourse.processing.org/u/xyzaw)\
**Post date:** [March 22, 2021, 12:56pm UTC](https://discourse.processing.org/t/camera-move-on-z/28724/1 "2021-03-22T12:56:15Z")

</div>

Hi!  
Im trying to make camera moving on z axis (zooming in and out) so the text will be visible or not

So for example i have this text: 123 and when I zoom in i wont see it, I will just have some random letters, but when I zoom out i will have my text again

 ![Zrzut ekranu 2021-03-22 o 12.54.49](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/c/ce62efd020f20f1e081264e1d0fa41a4d5124504.jpeg)

```auto
String [] abc = {"A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z"};

int n = 0; 

void setup () {

  size (1280, 720, P3D);
  background(0);
  camera(width/2.0, height/2.0, ((height/2.0) / tan(PI*30.0 / 180.0)) , width/2.0, height/2.0, 0, 0, 1, 0);
}

void draw () {
  
}

void mouseDragged () {

  float r = random (0, 100);

  textSize(32);
  text (abc[int(random(0, 25))], mouseX, mouseY, r);
}

void keyPressed(){

  if (key == '=') {
    n ++;
  } else if (key == '-') {
  
    n --;
  }

}

```

---

<div class="post-metadata">

**Author:** ![micuat](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/micuat/32/19407_2.png) [@micuat](https://discourse.processing.org/u/micuat)\
**Post date:** [March 22, 2021, 1:31pm UTC](https://discourse.processing.org/t/camera-move-on-z/28724/2 "2021-03-22T13:31:09Z")

</div>

hi! welcome to the forum!

I guess you are using `n` to control the zooming but it’s not used in the code you posted - can you check if that’s the right version?

My initial guess was because of the clipping plane - objects closer than the “near” plane and farther than the “far” plane will not show up  
[https://processing.org/reference/frustum\_.html](https://processing.org/reference/frustum_.html)

But in your case you are drawing it in `mouseDragged` so perhaps it’s unrelated. What is previously drawn in `mouseDragged` won’t be affected by `camera` - it’s like afterimage and the object is not there anymore. If you want the previous texts to be affected by the camera position, you need to store them (the random value and position) in an arraylist and draw all of them every frame with the updated camera parameters.

---

<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 22, 2021, 1:45pm UTC](https://discourse.processing.org/t/camera-move-on-z/28724/3 "2021-03-22T13:45:50Z")

</div>

to avoid clipping just call this:

```auto
void avoidClipping() {
  // avoid clipping (at camera): 
  // https : // 
  // forum.processing.org/two/discussion/4128/quick-q-how-close-is-too-close-why-when-do-3d-objects-disappear
  perspective(PI/3.0, (float) width/height, 1, 1000000);
}//func 

```

**Remark**

in theory, you need to use background at the start of draw(), then set camera with n as your eye-Z and the avoidClipping

Of course, with background at the start of draw(), you need to redraw **all** your letters in a loop in draw(), so you need to store them in a class and an ArrayList

---

<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 22, 2021, 2:33pm UTC](https://discourse.processing.org/t/camera-move-on-z/28724/4 "2021-03-22T14:33:12Z")

</div>

here is an example

place mouse in lower part of the Sketch, drag up and down

```auto

float camZ ; 

void setup() {
  size(1640, 860, P3D);

  // camZ = ((height/2.0) / tan(PI*30.0 / 180.0));
}

void draw() {
  avoidClipping(); 
  background(152);
  lights();

  camZ = map(mouseY, 0, height, -300, 300);

  camera(width/2.0, height/2.0, camZ, 
    width/2.0, height/2.0, camZ-200, 
    0, 1, 0);

  drawFloor(); 

  textMode(SHAPE);
  textAlign(CENTER, CENTER);
  fill(255); 
  text("Hello", width/2, height/2);
}

// ---------------------------------------------------------------------------
// Tools

void avoidClipping() {
  // avoid clipping (at camera): 
  // https : // 
  // forum.processing.org/two/discussion/4128/quick-q-how-close-is-too-close-why-when-do-3d-objects-disappear
  perspective(PI/3.0, (float) width/height, 1, 1000000);
}//func 

void drawFloor() {

  pushMatrix();

  //stroke(111); // gray 
  noStroke(); 
  fill(0, 2, 255); // blue
  float factor1=80.0; // dist between boxes

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

  for (int x=-55; x<55; x++) {
    for (int z=-55; z<55; z++) {

      pushMatrix(); 
      translate(x*factor1 - (4*factor1/2), 
        height-111, 
        z*factor1 - (4*factor1/2) );
      fill(map(z, -55, 55, 100, 255), 0, 0);
      box(40); // size of 40 (width, height and depth) 
      popMatrix();
    }
  }
  popMatrix();
}
//

```

---

<div class="post-metadata">

**Author:** ![xyzaw](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/xyzaw/32/12492_2.png) [@xyzaw](https://discourse.processing.org/u/xyzaw)\
**Post date:** [March 22, 2021, 2:55pm UTC](https://discourse.processing.org/t/camera-move-on-z/28724/5 "2021-03-22T14:55:30Z")

</div>

oh yea i see. I had n there:  
camera(width/2.0, height/2.0, **((height/2.0) / tan(PI\*30.0 / 180.0) + n)** , width/2.0, height/2.0, 0, 0, 1, 0);

I didnt know that it wont affect the mouseDraged things. Thx a lot!

---

<div class="post-metadata">

**Author:** ![xyzaw](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/xyzaw/32/12492_2.png) [@xyzaw](https://discourse.processing.org/u/xyzaw)\
**Post date:** [March 22, 2021, 3:00pm UTC](https://discourse.processing.org/t/camera-move-on-z/28724/6 "2021-03-22T15:00:10Z")

</div>

Thanks a lot! Will try to rewrite it. It turns out to be more tricky than I thought 😛

---

<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 22, 2021, 3:16pm UTC](https://discourse.processing.org/t/camera-move-on-z/28724/7 "2021-03-22T15:16:04Z")

</div>

> [@xyzaw](#):
>
> it wont affect the mouseDraged things

camera command needs to be at the start of draw()