All alternative routes have same color

[rishav-karanjit]

According to the documentation, L.Routing.Control class have a option altLineOptions. For some reason, altLineOptions is a list of styles. I expected each alternative route to having a separate color from the list in altLineOptions. But, all alternative route have the style that is in the last item of the list.

Example:

I have given the following in altLineOptions:

altLineOptions: {
          styles: [
              {color: 'red', opacity: 0.15, weight: 2},
              {color: 'green', opacity: 0.8, weight: 6},
              {color: 'white', opacity: 0.8, weight: 6},
              {color: 'white', opacity: 0.8, weight: 6},
              {color: 'blue', opacity: 0.5, weight: 2}
          ]
      },

But all alt line option has the same style as the last item in the list. I have used graphhopper routing backend.

[rishav-karanjit]

I have done a lot of projects using leaflets. If it's fine, I want to solve this issue by myself. Can I be assigned to this issue?

[curtisy1]

Thank you for the detailed issue description with example and being willing to help! It's greatly appreciated.

First off, I agree with everything you said. The option is a little confusing at the moment and should probably be changed to an implementation that is a little more intuitive.

That being said, I think this needs some further discussion on how to approach this. Off the top of my head, these questions would need to be sorted out first:

• [ ] What if we supply more styling options than we have routes? This isn't as bad since we can simply ignore the other styles as long as they're processed in order
• [ ] What if we supply more routes than we have styling options? Do we assume a default (preferably) or just apply the last style the user passed into the options?
• [ ] How far can we get to the current style without breaking anything too badly? This is a subtle breaking change (not that bad as we have a pending 4.0 release we can use already) but to avoid routes with default options looking entirely different, the default styles probably need to be tweaked a bit.

I think the reason behind the current way of doing things is the third point. The polylines are added above each other, so you have the option to create some kind of shadow together with your polyline. However, I think the defaults can be done with just a single option and polyline, so it should be fine to change this.

I assigned the issue to you. As mentioned, please use the typescript branch as your working base, so I can get this merged into the next release.

Thank you!

[curtisy1]

For reference, here's a comparison of using combined styles for one route, compared to just one style (left is the current default, right is possible new styles). I think this is not too big of a change though, so it should be fine. Plus the behavior can be overridden as well

[rishav-karanjit]

I think the current approach is fine. If number of styles and number alternative routes does not match, the option would be more less intuitive.