> For the complete documentation index, see [llms.txt](https://docs.mapbox.com/android/ja/navigation/ux/llms.txt)

# EV Range Map

EV Range Map is a component of the Navigation SDK UX Framework which calculates and visualizes range on a map based on [EV's battery characteristics and energy consumption model](https://docs.mapbox.com/android/ja/navigation/ux/guides/coordination/electric-vehicle/). This feature is only available when [ELECTRIC engine type is specified](https://docs.mapbox.com/android/ja/navigation/ux/guides/configuration/engine-type/).

![EV Range Map](https://docs.mapbox.com/android/ja/assets/ideal-img/dash-sdk-range-map-default.8d0a80d.480.png)

### Installation

**Groovy**

Title: `build.gradle`

```groovy
dependencies {
  ...
    implementation "com.mapbox.navigationux:ev-rangemap:1.28.0"
  ...
}
```

**Kotlin**

Title: `build.gradle.kts`

```kotlin
dependencies {
  ...
    implementation("com.mapbox.navigationux:ev-rangemap:1.28.0")
  ...
}
```

Add the library dependency to your `build.gradle.kts` or `build.gradle` file. The library version always matches UX Framework version as they have the same release cadence.

### Show/Hide EV Range Map

Use [`DashCoordination#showEvRangeMap`](https://docs.mapbox.com/android/navigation/api/uxframework/1.28.0/android/com.mapbox.dash.sdk/-dash-coordination/show-ev-range-map.html) to trigger the calculation of an EV Range Map. Once the EV Range Map is created, the SDK will draw it on the map:

```kotlin
Dash.controller.showEvRangeMap()
```

Note that this call doesn't affect the camera viewport and if you want to include the range map into the viewport you should also observe [`DashEvents#observeEvRangeMapState`](https://docs.mapbox.com/android/navigation/api/uxframework/1.28.0/android/com.mapbox.dash.sdk/-dash-events/observe-ev-range-map-state.html) and provide the [`RangeMapState.rangeMapFramePoints`](https://docs.mapbox.com/android/navigation/api/uxframework/1.28.0/android/com.mapbox.dash.sdk.rangemap/-range-map-state/range-map-frame-points.html) for the camera via `Dash.applyUpdate` (see [example](https://docs.mapbox.com/android/ja/navigation/ux/guides/coordination/camera/#adding-additional-points-to-the-camera-viewport))

To hide the EV Range map use [`DashCoordination#hideEvRangeMap`](https://docs.mapbox.com/android/navigation/api/uxframework/1.28.0/android/com.mapbox.dash.sdk/-dash-coordination/hide-ev-range-map.html):

```kotlin
Dash.controller.hideEvRangeMap()
```

The UX Framework also provides a pre-configured sidebar button that allows users to show and hide an EV Range Map. To display the button, users have to enable `Show Range Map button` option in Vehicle Type settings screen. In this case the feature is only available in free drive mode.

> **Related content (guide): [EV Range Map configuration](https://docs.mapbox.com/android/ja/navigation/ux/guides/configuration/component-styles/#ev-range-map)**
> 
> Learn how to configure appearance of the EV Range Map.