ShooterCamera

A top-down follow camera companion that tunes a sibling ArcCamera.

What it does

A companion to ArcCamera (it does not create its own camera). Attached next to ArcCamera on the same entity, it lazily resolves the live ArcCameraComponent and each frame: enforces a top-down preset (writes distance/alpha/beta so ArcCameraSystem pins the framing) and hands it the follow target (writes target + follow:true) so ArcCameraSystem is the single system that writes the camera target — ShooterCamera never calls setCameraTarget itself, so the two systems can't race and flicker. Once the handle is live it also locks the orbit controls (lockControls), overrides the FOV, and (if heightOffset is nonzero) pushes it onto the ArcCamera's targetOffset. It does nothing until an ArcCamera handle is live.

Use it in a scene

A scene is just data — a list of entities, each with its components. At startup the SceneLoader turns this JSON into a live world; edit the file and reload to rebuild it.

Fastest path

bjs download scene ShooterCamera

Pulls this exact scene into your project and runs it — no copy-paste. Add --all to grab the components and assets it needs too.

Or build it from scratch with the bjs CLI:

1Scaffold a project
```
npm create @babylonjsmarket/arcade@latest my-game
```
World, renderer, and dev server — ready to run.
2Install dependencies
```
cd my-game && npm install
```
3Add ShooterCamera
```
bjs download ShooterCamera
```
Copies its source into src/ so the scene resolves.
First time? Run bjs login once.
4Paste the scene into src/scenes/arcade-room.ts and run
```
npm run dev
```
SceneLoader builds the world from the JSON; reload to rebuild.

JSON

{
  "Camera": {
    "components": {
      "ArcCamera": {
        "target": "Player", "follow": true, "distance": 42,
        "alpha": -1.5708, "beta": 0.55, "controlsEnabled": false
      },
      "ShooterCamera": { "target": "Player", "beta": 0.55, "distance": 42, "lockControls": true }
    }
  },
  "Player": {
    "tags": ["player"],
    "components": {
      "MeshPrimitive": { "primitive": "capsule", "radius": 0.5, "height": 1.6, "position": [0, 0.8, 0] }
    }
  }
}

Props

target (string) — entity id to follow (the player); handed to the sibling ArcCamera, which owns the follow.
beta (number, default 0.55) — orbit pitch in radians; small = near-overhead.
alpha (number, default -PI/2) — orbit yaw in radians.
distance (number, default 42) — fixed follow distance.
heightOffset (number, default 0) — vertical offset, applied once as the ArcCamera's targetOffset.
fov (number, default 0.8) — vertical FOV in radians applied to the camera.
lockControls (boolean, default true) — detach the ArcRotateCamera's pointer controls.

Dependencies

ArcCamera — the camera this companion configures; it owns the actual CameraHandle (and, with follow:true, the target write) and must sit on the same entity.

Notes

This component is inert on its own: there must be an ArcCameraComponent with a live handle to configure, so always attach it beside an ArcCamera. The controls-lock + FOV override + targetOffset are applied once (the first frame the handle is live); distance/alpha/beta and target/follow are re-pushed every frame, so a tuning panel can still own the zoom by changing distance. Because the actual setCameraTarget write belongs solely to ArcCameraSystem, the two systems never race. Runtime state (just the one-shot preset flag) lives in a WeakMap keyed by the component, never on the serializable component.

ShooterCamera

A top-down follow camera companion that tunes a sibling ArcCamera.

What it does

Use it in a scene

A scene is just data — a list of entities, each with its components. At startup the SceneLoader turns this JSON into a live world; edit the file and reload to rebuild it.

Fastest path

bjs download scene ShooterCamera

Pulls this exact scene into your project and runs it — no copy-paste. Add --all to grab the components and assets it needs too.

Or build it from scratch with the bjs CLI:

1Scaffold a project
```
npm create @babylonjsmarket/arcade@latest my-game
```
World, renderer, and dev server — ready to run.
2Install dependencies
```
cd my-game && npm install
```
3Add ShooterCamera
```
bjs download ShooterCamera
```
Copies its source into src/ so the scene resolves.
First time? Run bjs login once.
4Paste the scene into src/scenes/arcade-room.ts and run
```
npm run dev
```
SceneLoader builds the world from the JSON; reload to rebuild.

JSON

{
  "Camera": {
    "components": {
      "ArcCamera": {
        "target": "Player", "follow": true, "distance": 42,
        "alpha": -1.5708, "beta": 0.55, "controlsEnabled": false
      },
      "ShooterCamera": { "target": "Player", "beta": 0.55, "distance": 42, "lockControls": true }
    }
  },
  "Player": {
    "tags": ["player"],
    "components": {
      "MeshPrimitive": { "primitive": "capsule", "radius": 0.5, "height": 1.6, "position": [0, 0.8, 0] }
    }
  }
}

ShooterCamera

ShooterCamera

What it does

Use it in a scene

Props

Dependencies

Notes

ShooterCamera

What it does

Use it in a scene

Unlock the source

What you get

More like this

Was this page helpful?