-
Notifications
You must be signed in to change notification settings - Fork 2.3k
Description
Motivation
I'm trying to draw a subway map: lines are getting together in bunches and branch off.
For example, here C-line (blue) and G-line (ligh-green) branch off:

While they are in bunch, I use line-pattern:

But then, I need to make a smooth transition from a pattern to 2 separate lines, which then would be centered normally.
More complicated example where one bunch branches of into 2 other bunches:
Design Alternatives
Split line into smaller chunks, assign an offset property to each segment separately.
"line-offset": [
"case",
["has", "offset"],
["to-number", ["get", "offset"]],
0
]There is a visible staircase effect when number of segments is low, especially on a small zoom:
Design
Ideally, I will need to set something like this:
"line_offset": [
"interpolate",
["linear"],
["line-progress"],
0, 2.5, // where 2.5 is some magic number for when line is in a bunch
1, 0
]Unfortunately, line-progress can only be used in the line-gradient property.
https://docs.mapbox.com/mapbox-gl-js/style-spec/expressions/#line-progress
I wonder how feasible it is to implement it for line-offset as well.
Or, perhaps, there are better ways to solve my problem.