# Make the camera follow an object

**URL:** https://discourse.processing.org/t/make-the-camera-follow-an-object/10386
**Category:** Beginners
**Created:** [April 17, 2019, 10:57am UTC](https://discourse.processing.org/t/make-the-camera-follow-an-object/10386 "2019-04-17T10:57:10Z")
**Posts on this page:** 1
**Showing post:** 6

<div class="post-metadata">

### Author: ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)
#### Post date: [April 21, 2019, 3:52pm UTC](https://discourse.processing.org/t/make-the-camera-follow-an-object/10386/6 "2019-04-21T15:52:10Z")

</div>

Camera is designed for 3D (P3D). [camera() / Reference / Processing.org](https://processing.org/reference/camera_.html)

In 2D, “translate()” (and rotate) is the essence of the camera.

Here is a very simple example. The sketch is drawing a fixed platform and avatar around 0,0, but a moving “camera” can be toggled with the spacebar.

```auto
/**
 * 2D camera for platformer -- left/right moves, space toggles camera
 * 2019-04 Processing 3.4
 * https://discourse.processing.org/t/help-with-camera-function/10386
 */
int x;
boolean cameraOn = true;

void draw() {
  background(0);
  translate(width/2, height/2); // center the shot
  if(cameraOn) myCamera();
  platform();
  avatar();
}

void platform(){
  rectMode(CENTER);
  rect(0, 0, 70, 20);
}

void avatar(){
  if(keyPressed){
    if(keyCode==RIGHT) x++; // move
    if(keyCode==LEFT) x--;
    if(x>35) x=-35; // wrap around
    if(x<-35) x=35;
  }
  ellipse(x, -10, 10, 10); // draw
}

// move the camera in a circle based on time
void myCamera(){
  translate(width/3 * sin(millis()*.001), height/3 * cos(millis()*.001));
}

void keyReleased(){
  if(key==' ') cameraOn = !cameraOn;
}

```

![08%20AM](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/e/eab47fa4d288d618692ac81ddc329626b1a9fb94.png)

Notice that the platform is always drawn centered on 0,0. The “camera” is just an optional translate command that changes the frame of reference – the view – before the platform is drawn.

For a different example with vertical scrolling, see:

> [@\[Processing 3\] Moving through a map bigger than the screen](https://discourse.processing.org/t/processing-3-moving-through-a-map-bigger-than-the-screen/10393/4):
>
> Do you actually have a 1024x15669 image file, like a jpg, that you are loading and want to scroll? Or is it many tiles, or are you generating the background image dynamically inside your sketch…? Here is a very very simple example of a vertical scroller written in PDE (not Eclipse). It demonstrates using translate and the coordinate system to keep track of where you are, then check collision with the viewframe to decide what to render (e.g. only part of a very large graphic, or only certain ti…

Again, it is just a translate command before drawing.

---

_[View the full topic](https://discourse.processing.org/t/make-the-camera-follow-an-object/10386)._