Need to show route with different color for Distance Covered and Remaining

[bkolliboina]

Hi,

Need to show the route with two different colors for distance covered and distance remaining on map, but facing some challenges to show multi colors on route.

Below sample code I am using  with RouteLayer,

defaultSymbols: {
    directionLines: {
       type: "simple-line",
       color: [256, 256, 256, 256],
       width: 3,
      cap: "round",
       join: "round"
    },
    directionPoints: null,
    routeInfo: null,

}

If we have any sample CODE/URL/Approach, please suggest.

Thanks in advance.

[Noah-Sager]

Hi @bkolliboina, are you trying to update the route symbology and the user travels across the route? Or are you just having issues changing the symbology for the route line?

In this blog, there is an example of how to change the symbology for the route line: https://www.esri.com/arcgis-blog/products/js-api-arcgis/developers/changing-directions/

[bkolliboina]

Hi @Noah-Sager , 

Thanks for the quick response. 

I am trying to update the route symbology and the user travels across the route. And need to show the route with two different colors.

1. Completed distance (White Color)

2. Remaining distance (Orange Color)

In the give below, I am bale to show only one color but needs to show two different colors

[EdwardSheehan]

Could you use 2 route layers. 1 from the original point to where you are currently and 1 from where you are currently to the destination point?

[Noah-Sager]

Hmm, I'm not sure how possible this is currently. You have a way to track the user and get their location along the route? Or is this app to be used on a mobile device, and you want the route symbology to update in real time?

[bkolliboina]

This is for web application not mobile app and I can get the current location along with route from API.