Adjust the camera

The camera allows you to change the user’s viewpoint of the map. You can use camera modes to control the behavior of the map view during navigation. To set the camera mode, call one of the following methods associated with the camera:

  • Follow my location (GoogleMap.followMyLocation) — The default camera mode for navigation. This mode sets the camera to the device or vehicle. During navigation, the camera automatically faces the direction of travel. When the high detail setting is enabled (NavigationMapStyle.HIGH_DETAIL), 2-D building outlines are displayed when the zoom level is 19 or higher.

  • Pinned to location (GoogleMap.animateCamera and GoogleMap.moveCamera) — Fixes the camera at a specific location. When using this mode, you can set the camera location along with other camera properties like bearing, tilt, zoom, etc. When this view is selected and the Navigator has been initialized, the Re-center button is visible.

  • Show route overview (NavigationView.showRouteOverview or SupportNavigationFragment.showRouteOverview) — Displays an overview of the remaining route, panning and zooming as needed to fit the route into the map view. When this view is selected, the Re-center button is visible.

Clicking the Re-center button sets the camera to followMyLocation mode.

Follow my location mode

The most common camera setting is to have the camera set to the device or vehicle, showing its current position within the journey. In this camera mode, you can view the route with the car always headed up the screen with an angled perspective (CameraPerspective.TILTED), or you can see the car traveling with north (CameraPerspective.TOP_DOWN_NORTH_UP) or with heading (CameraPerspective.TOP_DOWN_HEADING_UP) always at the top of the screen.

The following code fragment uses the TILTED perspective:

// Set the camera to follow the device (vehicle):
mNavFragment.getMapAsync(googleMap -> googleMap.followMyLocation(CameraPerspective.TILTED))

Pinned to location mode

The Pinned mode provides you with the most control of the camera. In this mode, you place the camera in a specific location, assign a bearing to orient the camera view, change the tilt to set the viewing angle, and set the camera's zoom level.

The following code snippet demonstrates some of the common ways to move the camera.

private static final LatLng SYDNEY = new LatLng(-33.88, 151.21);
private static final LatLng MOUNTAIN_VIEW = new LatLng(37.4, -122.1);

private GoogleMap map;
... // Obtain the map from a SupportNavigationFragment or NavigationView.

// Move the camera instantly to Sydney with a zoom of 15.
map.moveCamera(CameraUpdateFactory.newLatLngZoom(SYDNEY, 15));

// Zoom in, animating the camera.
map.animateCamera(CameraUpdateFactory.zoomIn());

// Zoom out to zoom level 10, animating with a duration of 2 seconds.
map.animateCamera(CameraUpdateFactory.zoomTo(10), 2000, null);

// Construct a CameraPosition focusing on Mountain View and animate the camera to that position.
CameraPosition cameraPosition = new CameraPosition.Builder()
    .target(MOUNTAIN_VIEW)      // Sets the center of the map to Mountain View
    .zoom(17)                   // Sets the zoom
    .bearing(90)                // Sets the orientation of the camera to east
    .tilt(30)                   // Sets the tilt of the camera to 30 degrees
    .build();                   // Creates a CameraPosition from the builder
map.animateCamera(CameraUpdateFactory.newCameraPosition(cameraPosition));

Show route overview mode

The showRouteOverview camera setting displays the entire journey. For multiple-destination journeys, this mode displays the untraveled portion of the route.

// Place the camera to see the remaining route:
mNavFragment.showRouteOverview();

High detail setting

When the high detail setting is enabled, 2-D building outlines are displayed when the zoom level of the camera is set to 19 or higher. You can override the zoom level during navigation by using a FollowMyLocationOptions object. This allows you to increase the zoom level enough to display 2-D building outlines as the user approaches their destination.

This example enables the high detail setting:

  navigationView.setNavigationMapStyle(NavigationMapStyle.HIGH_DETAIL);

The following example overrides the zoom level of the camera during navigation. The zoom level is set to 15, which is high enough to display 2-D building outlines.

  googleMap.followMyLocation(
              FollowMyLocationOptions.builder(CameraPerspective.TILTED)
                      .setZoomLevel(15.0f)
                      .build());

Next step

See Customize the Navigation UI to learn how to customize the way in which users interact with your map by determining which of the built-in UI components appear on the map.