How to create a simple ego perspective camera?

Hello there, total beginner trying to get my feet wet. I think I have some “old-school” or “different” expectations on how to create a player with a first person perspective camera and attach input to it.

I want to create a simple car game where every player sits inside a car and steers it with some input buttons. The cars will have custom behavior / physics eventually. I thought of creating each player in an object hierarchy like this:

  • Collision body
    • Visible mesh (hidden for current player or replaced with cockpit / HUD mesh)
    • Inside Camera (active only for local player)

That way, moving and coding the behavior of the collision body would move the visible mesh and camera in sync.

I tried the existing cameras in Babylon.js which did not really work out:

  • Camera: Thought this simple base class would suffice, but the view does not change when I move the mesh I set as its parent, nor when I directly set the camera’s position.
  • FreeCamera/FlyCamera: These ones were the only ones with collision properties like ellipsoid, applyGravity or checkCollisions. Those surprised me in being specific to a camera. I’m not sure how I would allow opponent players participate in physics then, as they would not have a camera at all.
  • FollowCamera: Followed my mesh at least, but had too many “extra features” like interpolation / smoothing, and even trying to disable all those by changing its properties like heightOffset or radius to 0 still caused it behave weird eventually. This is the only attempt I kept: Babylon.js Playground

Am I on the wrong path here? Do I have to write my own Camera class from scratch to attach it to an object like that? Do I need to use a physics library for physics on other players?

Hi RayKoopa,

First of all, welcome to Babylon!

Cool idea! The relationship between Babylon’s default cameras and collision systems can be a bit confusing, partly because vanilla Babylon doesn’t have a fully-featured physics engine built in (Ammo, Cannon, and others are available as plugins). The hierarchy you described makes a lot of sense, and I think it’s actually pretty close to what we did in…

This repo contains a kart racer the Babylon team made for fun last year. In order to have complete control so that we could get the feel of the karts right, we used a FreeCamera but ignored all its default capabilities and implemented custom collision and physics ourselves. It might work a little differently if you’re going for a less arcade-y feel (and of course you’ll want the camera to be inside the kart, not above and behind it), but this implementation might serve as a good reference to get you started. I don’t think anybody’s tried it in a few months; but last time we checked, it still worked. :smiley: Good luck!


Thanks for that. That’s a nice sample project to study first which should answer a lot of my questions :slight_smile:
I’m not sure if I can get FreeCamera to work for an ego perspective as it still tries to “follow” something and turns around suddenly or wobbles (as seen my playground above); I think I’ll try “copying” the FreeCamera class from the engine source and steam it down to what I need (basically just statically following the parent orientation).

Since I decided to not use Babylon’s built in physics (they’d not suffice my specific needs eventually), the ego perspective aspect actually became really easy to solve.

I use the TargetCamera without actually setting a target and instead only parenting it to the player mesh.

// Create player mesh the camera will be inside in.
var player = BABYLON.Mesh.CreateSphere("playerMesh", 3, 1, scene);
player.position.y = 0.5;

// Create camera as a child of the player.
var camera = new BABYLON.TargetCamera("playerCamera", new BABYLON.Vector3(0, 0, 0), scene);
camera.parent = player;

Feel free to check it out: Babylon.js Playground. It’s a split screen playground with two players movable with WASD and arrow keys, so you can actually see their mesh.

Again, Babylon’s default physics would be hard to add here, as they could be applied to the camera only and not the player mesh. It would mean that the camera slowly falls out of the player hull. If I make the mesh a parent of the camera instead to solve this, I’d have to translate or rotate the camera with the keyboard keys, but that simply shows no effect, weirdly.