Show EV reachable range

VERSION 1.20.0

Range visualization can be used to visualize a reachable range for electric vehicles (EVs) as well as combustion vehicles.

Before you start check Calculating a reachable range guide.

Project setup

Add the dependency to your project’s build.gradle file:

implementation "com.tomtom.sdk.maps.visualization:range:1.20.0"

Initializing the Range Visualization module

Use the RangeVisualizationFactory method to create the rangevisualization object. It takes two arguments:

tomTomMap: a TomTomMap object.
defaultRangeStyle: A default RangeStyle that will be used for stylization of the range circles primitives

rangeVisualization =
    RangeVisualizationFactory.create(tomTomMap, defaultRangeStyle)

Displaying a reachable range

There are two ways to visualize a range on the map: . Circle - used to display a range as a reachable radius . Polygon - used to display a more detailed range

To display a reachable range, a Range object must be created and passed to the display method of RangeVisualization. Choose between two types of Range objects: NamedPolygons and NamedCircles

1val circle1 = NamedCircle(name1, origin1, radius1)
2val circle2 = NamedCircle(name2, origin2, radius2)
3val circleRange = Range.NamedCircles(listOf(circle1, circle2))
4rangeVisualization.display(circleRange)

1val polygon1 = calculateRangeResponse.boundaries[Budget.Energy(Energy.kilowattHours(5))]
2val polygon2 = calculateRangeResponse.boundaries[Budget.Energy(Energy.kilowattHours(10))]
3when {
4    polygon1 is RangeBoundary.Polygon && polygon2 is RangeBoundary.Polygon -> {
5        val namedPolygon1 = NamedPolygon(name1, boundary = polygon1.points)
6        val namedPolygon2 = NamedPolygon(name2, boundary = polygon2.points)
7        val polygonRange = Range.NamedPolygons(listOf(namedPolygon1, namedPolygon2))
8        rangeVisualization.display(polygonRange)
9    }
10}

Clearing the range

The range currently being visualized on the map can be cleared using the clear method of RangeVisualization:

rangeVisualization.clear()

Learn more

Since you have learned how to display Reachable range, here are recommendations for the next steps: