"automatic" camera fovMode or setting a minimum field of view?

Hey team!

What approach do people suggest for having/keeping a fixed minimum area in FOV?

Regardless of screen resolution, browser/window resizing, etc,
I know that camera.fovMode exists, but it only scales one of the axis.

The scene should scale to always keep the transparent gray square within view on both axis.

In the following PG, drag the PG split bar to increase canvas width, the top and bottom of the gray square will start to leave the FOV, at this point i would like it to stop and scale on the other axis (FOVMODE_VERTICAL_FIXED).

Maybe camera.fovMode is not the best method here?
Any thoughts/ideas/solutions?


1 Like

I don’t have the answer but I needed something like this so thank you for bringing that up. I’m just curious what is your use case and why do you need it, what kind of app are you working on?

I love to keep an expected ratio by css on the canvas depending on the case. There is no “one fit all” solution in this case I believe as some case would require a “larger vision” like games and in other smtgh more narrow might be acceptable like a viewer for instance. As it relates to UX I wonder if @PatrickRyan has some recommandations ?

1 Like

@aWeirdo, I agree with @sebavan that there is no one size fits all for something like this. You can make use of the fixed FOV modes to always keep the square fully in the viewport. You just need to know one additional piece of information which is the current ratio of the render from the engine. Then you can change the FOVMODE to match the render ratio. if you have a wide aspect ratio (1.0 and up), you want the FOV constrained vertically so that we never lose top or bottom of the square. Conversely, if we have a narrow ratio (less than 1.0), we want the FOV constrained horizontally so we never lose the sides of the square.

Since we are setting this when the scene first loads and then only on engine resize observables, you aren’t paying much of a cost. You will pay a per-frame cost to do this when the window is resizing, but this is likely not going to happen very often so likely will be an acceptable cost. Hope this helps.


@sebavan @PatrickRyan
Thanks guys!

I thought maybe it was something like that, but i wasn’t sure how exactly to go about it at the time. :smile:

@ertugrulcetin Been out for a few days.
Small game with a fixed side-view camera and certain models/areas that should always be visible to the player :smiley:


@sebavan @PatrickRyan
Any tricks/ideas for making this work widescreen?

A ratio of 1.0 only works seemlessly for a center square obviously, if i change the ratio to e.g. 16/9, there’s an ugly jumping on the transition between the FOV modes

Sorted it by changing the FOV value.
Sometimes all you need is a break and come back later :joy:

1 Like