<iframe src="https://developers.devsite.google/frame/maps/documentation/javascript/reference/3.64/routes-elements_77681c4fa40642026a8b730309d0c4e080c7ee696a9dad66514866c18764a4ce.frame" class="framebox inherit-locale redirect-iframe" allow="clipboard-write https://developers.devsite.google" allowfullscreen is-upgraded></iframe>

## [Route3DElement](https://developers.google.com/maps/documentation/javascript/reference/3.64/routes-elements.md.txt#Route3DElement)
class


`google.maps.routes.Route3DElement`
class

extends `HTMLElement`

implements `Route3DElementOptions`

library `"routes"`
**Notice:** Available only in the [v=alpha channel](https://developers.google.com/maps/documentation/javascript/versions.md.txt#choosing-the-alpha-channel).

A web component for 3D route rendering. Currently support origin and destination parameters to render a polyline in 3D space in a 3D map.

```html
    
<gmp-route-3d
  autofits-camera
  departure-time="####-##-##T##:##Z"
  destination="lat,lng"
  origin="lat,lng"
  routing-preference="value-name"
  travel-mode="value-name">
</gmp-route-3d>
```

```javascript
const {Route3DElement} = await google.maps.importLibrary("routes");
```

| ### Constructor ||
|---|---|
| `Route3DElement` | `Route3DElement([options])` **Parameters:** - `options`: `Route3DElementOptions optional` Creates a `Route3DElement` with the options specified. |

| ### Properties ||
|---|---|
| `autofitsCamera` attr: autofits-camera | **Type:** `boolean optional` **Default:** `false` If provided, the specified route will be made visible within the map viewport, alongside any other elements that have opted in. **HTML attribute:** `autofits-camera` |
| `departureTime` attr: departure-time | **Type:** `Date optional` If provided, the route will be computed with the specified departure time. When specifying via HTML attribute, use the ISO 8601 format for reliable results across browsers. For information on usage requirements, see `ComputeRoutesRequest.departureTime`. **HTML attribute:** `departure-time="####-##-##T##:##Z"` |
| `destination` attr: destination | **Type:** `string|LatLng|LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral|Place optional` The destination of the route. **HTML attribute:** - `destination="lat,lng"` - `destination="places/###"` - `destination="address"` |
| `origin` attr: origin | **Type:** `string|LatLng|LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral|Place optional` The origin of the route. **HTML attribute:** - `origin="lat,lng"` - `origin="places/###"` - `origin="address"` |
| `routingPreference` attr: routing-preference | **Type:** `RoutingPreference optional` If provided, the route will be computed with traffic information along the route that's based on the `RoutingPreference` specified, and use traffic-specific coloring. **HTML attribute:** `routing-preference="value-name"` |
| `travelMode` attr: travel-mode | **Type:** `TravelMode optional` If provided, the polyline is based on the specified travel mode. **HTML attribute:** `travel-mode="value-name"` |

| ### Methods ||
|---|---|

## [Route3DElementOptions](https://developers.google.com/maps/documentation/javascript/reference/3.64/routes-elements.md.txt#Route3DElementOptions)
interface


`google.maps.routes.Route3DElementOptions`
interface

Route3DElementOptions object used to define the properties that can be set on a Route3DElement.

| ### Properties ||
|---|---|
| `autofitsCamera` optional | **Type:** `boolean optional` Whether or not to opt into automatically fitting the camera to the route. |
| `departureTime` optional | **Type:** `Date optional` See `Route3DElement.departureTime`. |
| `destination` optional | **Type:** `string|LatLng|LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral|Place optional` See `Route3DElement.destination`. |
| `origin` optional | **Type:** `string|LatLng|LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral|Place optional` See `Route3DElement.origin`. |
| `routingPreference` optional | **Type:** `RoutingPreference optional` See `Route3DElement.routingPreference`. |
| `travelMode` optional | **Type:** `TravelMode optional` See `Route3DElement.travelMode`. |