Skip to main content


The FirstPersonView class is a subclass of View that describes a camera placed at a provided location, looking towards the direction and orientation specified by viewState. The behavior is similar to that of a first-person game.

It's recommended that you read the Views and Projections guide before using this class.


import {FirstPersonView} from '';
new FirstPersonView({id, ...});

FirstPersonView takes the same parameters as the View superclass constructor, plus the following:

projectionMatrix (number[16], optional)

Projection matrix.

If projectionMatrix is not supplied, the View class will build a projection matrix from the following parameters:

fovy (number, optional)

Field of view covered by camera, in the perspective case. In degrees. Default 75.

near (number, optional)

Distance of near clipping plane. Default 0.1.

far (number, optional)

Distance of far clipping plane. Default 1000.

focalDistance (number, optional)

Modifier of viewport scale. Corresponds to the number of pixels per meter. Default 1.

View State

To render, a FirstPersonView needs to be combined with a viewState object with the following parameters:

  • longitude (number, optional) - longitude of the camera
  • latitude (number, optional) - latitude of the camera
  • position (number[3], optional) - meter offsets of the camera from the lng-lat anchor point. Default [0, 0, 0].
  • bearing (number, optional) - bearing angle in degrees. Default 0 (north).
  • pitch (number, optional) - pitch angle in degrees. Default 0 (horizontal).
  • maxPitch (number, optional) - max pitch angle. Default 90 (down).
  • minPitch (number, optional) - min pitch angle. Default -90 (up).


By default, FirstPersonView uses the FirstPersonController to handle interactivity. To enable the controller, use:

const view = new FirstPersonView({id: 'pov', controller: true});

Visit the FirstPersonController documentation for a full list of supported options.