0

I wanted to show Total Trip duration on tip message on android here maps sdk when requested to draw route on map fragment as show in image. Total trip duration

2 Answers2

0

You can use the info bubble to display the Total trip duration. Read the documentation for moreinfo: https://developer.here.com/documentation/maps/topics/map-controls.html

Info Bubbles

In addition to map controls, the UI module supports info bubbles. An info bubble allows you literally to show a 'bubble' containing HTML content on the map, for example text or images.

The code below extends the first example in this article by adding an info bubble to the map display. It creates an instance of InfoBubble, specifying the geographic coordinates of the location at which it should appear, and the HTML content, which in this case is the text string "Hello World!" in bold. The last line adds the info bubble object to the UI instance.

// Create an info bubble object at a specific geographic location:
var bubble = new H.ui.InfoBubble({ lng: 13.4, lat: 52.51 }, {
        content: '<b>Hello World!</b>'
       });

// Add info bubble to the UI:
ui.addBubble(bubble);

To get the total trip cost make a call to the routing api and get the summary information.https://developer.here.com/documentation/android-premium/dev_guide/topics/routing.html

0

Here is a sample code that you can use to render 2 locations, source and destination, their route, and a marker in the middle of their route. You have to replace the images for your source and destination locations and for your bubble you can follow the link in the comment to generate a bitmap (or any other guide online) with the text that displays the calculated distance (including the ongoing traffic).

private fun renderLocations() {
    val locations = arrayOf(
        GeoCoordinate(37.4219999, -122.0862462),
        GeoCoordinate(33.9880667, -118.4854341)
    )

    val sourceMarker = MapMarker(locations[0], Image().apply {
        try {
            // set source marker image
            setImageResource(android.R.drawable.ic_menu_compass)
        } catch (throwable: Throwable) { }
    })

    val destinationMarker = MapMarker(locations[1], Image().apply {
        try {
            // set destination marker image
            setImageResource(android.R.drawable.ic_menu_camera)
        } catch (throwable: Throwable) { }
    })

    map.addMapObjects(listOf(sourceMarker, destinationMarker))

    calculateRoute(locations[0], locations[1])
}

private fun calculateRoute(source: GeoCoordinate, destination: GeoCoordinate) {
    CoreRouter().apply {

        dynamicPenalty = DynamicPenalty().apply {
            trafficPenaltyMode = Route.TrafficPenaltyMode.OPTIMAL
        }

        calculateRoute(

            RoutePlan().apply {

                routeOptions = RouteOptions().apply {
                    transportMode = RouteOptions.TransportMode.CAR
                    setHighwaysAllowed(true)
                    routeType = RouteOptions.Type.SHORTEST // other alternatives: FASTEST, BALANCED
                    routeCount = 1
                }

                addWaypoint(RouteWaypoint(source))

                addWaypoint(RouteWaypoint(destination))

            }, object : Router.Listener<List<RouteResult>, RoutingError> {
                override fun onCalculateRouteFinished(p0: List<RouteResult>?, p1: RoutingError?) {
                    p1?.let {
                        if (it == RoutingError.NONE) {
                            p0?.let { result ->
                                if (result.isNotEmpty()) {
                                    // I only show the first result, maybe you want to show all routes
                                    val routeResult = result[0].route

                                    val durationWithDelayInSeconds = routeResult.getTtaIncludingTraffic(Route.WHOLE_ROUTE).duration

                                    val totalWayPoints = routeResult.routeGeometry?.size
                                    val middlePoint: GeoCoordinate? = routeResult.routeGeometry?.get(totalWayPoints!! / 2)

                                    middlePoint?.let {
                                        map.addMapObject(MapMarker(it/*, Image().apply {
                                            // Draw yourbitmap. A good resource can be found here: https://medium.com/@travells2323/android-draw-text-to-bitmap-8251f6d79150
                                        }*/
                                        ))
                                    }

                                    mapRoute?.let {
                                        map.removeMapObject(it)
                                    }

                                    mapRoute = null
                                    mapRoute = MapRoute(routeResult)

                                    mapRoute?.let {
                                        map.addMapObject(it)
                                        it.renderType = MapRoute.RenderType.USER_DEFINED
                                        it.color = Color.BLUE
                                        it.isTrafficEnabled = true
                                    }
                                }
                            }
                        }
                    }
                }

                override fun onProgress(p0: Int) {
                    /* The calculation progress can be retrieved in this callback. */
                }
            })
    }
}

The end result of the above code is

enter image description here

Once you replace the images with the ones you want, you will have the end result you want to achieve.

no_name
  • 174
  • 1
  • 5