> ## Documentation Index
> Fetch the complete documentation index at: https://docs.elementlabs.net/llms.txt
> Use this file to discover all available pages before exploring further.

# Routes

> Control the line drawn from the player to a destination.

## Purpose

`configs/route.jsonc` controls the line the map draws from the player to their destination: its
width, its colour, how often it is recalculated, and whether it is drawn in as an animation.

The route follows the same path the game's own navigation would. This file changes how it looks on
the map, not where it goes.

## Options

### Appearance

| Key         | Default               | Meaning                                                                                                                      |
| ----------- | --------------------- | ---------------------------------------------------------------------------------------------------------------------------- |
| `thickness` | `12.0`                | How thick the line is on screen. Because it is measured on screen, the line stays the same visual width at every zoom level. |
| `maxWidth`  | `13.0`                | A ceiling on the line's width in the world, in metres. It stops the line from swallowing streets when the camera is high.    |
| `color`     | `[164, 76, 242, 255]` | The colour, as red, green, blue and opacity, each from `0` to `255`.                                                         |

Both width values apply together: the line is drawn at the on-screen thickness until that would
exceed `maxWidth` in the world, and is capped there.

A route to a marker that carries its own route colour uses that colour instead. See
[Exports](/products/map/reference/exports).

### Refreshing

| Key              | Default | Meaning                                                                        |
| ---------------- | ------- | ------------------------------------------------------------------------------ |
| `updateInterval` | `1000`  | How often, in milliseconds, the map checks whether the route needs rebuilding. |
| `updateDistance` | `50.0`  | How far, in metres, the player must move before the route is rebuilt.          |

Both conditions must be met: the map checks on the interval, and rebuilds only if the player has
moved at least that far. That keeps a route accurate on the move without recalculating it for a
player standing still.

### Draw-in animation

| Key         | Default       | Meaning                                                                                                                                   |
| ----------- | ------------- | ----------------------------------------------------------------------------------------------------------------------------------------- |
| `animate`   | `true`        | Whether the line is drawn in from the player towards the destination, rather than appearing at once. Set to `false` for an instant route. |
| `drawSpeed` | `1800`        | How fast it is drawn in, in metres per second. Higher finishes sooner.                                                                    |
| `drawEase`  | `"inOutQuad"` | How the drawing accelerates. The accepted names are listed under [Camera](/products/map/configuration/camera).                            |

When a route is rebuilt while the player is moving, only the part that changed is animated. The
section already drawn stays where it is.

## Example

A thinner, faster, orange route:

```jsonc theme={null}
{
  "namespace": "route",
  "configVersion": 1,
  "scope": "client",
  "values": {
    "thickness": 8.0,
    "color": [246, 158, 0, 255],
    "drawSpeed": 3000
  }
}
```

Turning the animation off entirely:

```jsonc theme={null}
{
  "namespace": "route",
  "configVersion": 1,
  "scope": "client",
  "values": {
    "animate": false
  }
}
```

## Applying changes

```text theme={null}
restart element_map
```

## Safety

| Key              | Stay within                    | Why                                                                                                                                           |
| ---------------- | ------------------------------ | --------------------------------------------------------------------------------------------------------------------------------------------- |
| `color`          | Four values, each `0` to `255` | A shorter list or a value outside the range produces a colour you did not intend. The fourth value is opacity: `0` makes the route invisible. |
| `thickness`      | Roughly `4` to `24`            | Below that the route is hard to follow; above it, it covers the streets around it.                                                            |
| `maxWidth`       | Roughly `5` to `40`            | This is metres in the world. A large value makes the route very wide when the camera is high.                                                 |
| `updateInterval` | At or above `500`              | Lower rebuilds the route more often than the player can benefit from, for no gain.                                                            |
| `updateDistance` | Roughly `20` to `200`          | Below that, the route is rebuilt almost continuously while driving. Above it, the route stays stale for a long stretch of road.               |
| `drawSpeed`      | Roughly `500` to `5000`        | Below that, a long route takes many seconds to appear. Above it, the animation is not visible.                                                |

Setting `animate` to `false` makes `drawSpeed` and `drawEase` inactive; they are read but have
nothing to apply to.

## Related

* [Configuration](/products/map/configuration/index)
* [Camera](/products/map/configuration/camera): the easing names
* [How players use the map](/products/map/using-the-map)