Nicer ferry styling #775
Nicer ferry styling #775
Conversation
|
I think this is a nice improvement. I'd like to get other maintainers to weigh in on the cartography and in particular, which zoom to do the solid-to-dashed transition. The one thing I'm not crazy about is that long straight lines have a tendency to have a patterned appearance due to antialiasing. I'm not sure that there's anything that can be done to fix this, but I do notice it. I like how the multitude of ferry lines gives a pseudo-thick line at this middle zooms:
For anyone wondering how to test this at low zooms, use this low-zoom Alaska tile server: |
|
Hate to say it, but I'm not a fan of the zoom-based transition between solid and dashed. They look like symbology for different features—if we choose to have ferries represented by both solid and dashed lines, I'd rather we use that to distinguish, for example, vehicle ferries from pedestrian ferries. Maybe we can adjust the dash pattern to densify the dashes, or get rid of them altogether. Here's
|
|
The solid line treatment in this PR produces a sort of feathered or timelapse effect in busy areas. It’s certainly less jarring than when the current style’s dashes happen to align to produce a Moiré effect. It might be necessary to lighten the ferry line color a bit to compensate for the solid line “using more ink” on screen. But is the problem fundamentally about spacing, or is it that there’s a lack of visual hierarchy? Any treatment that we apply uniformly to ferry lines will overemphasize busy urban route segments and underemphasize far-flung route segments, even of important ferry lines. We see this phenomenon too with railroad tracks in railyards, which can get overwhelming if we aren’t careful about line weight and line patterns. Some maps try to bring order to the chaos by highlighting a mainline and deemphasizing the rest.
I’m curious how maps normally deal with this problem for ferries. Among the maps in my collection, the main map normally shows only a select few routes, while inset maps show more. But the inset maps can still get away with generalizing the routes. Someone looking at an inset map of Lower Manhatten only needs to see a single dashed line leading south; they don’t need to see how many routes lead south and which one goes to the Rockaways. We don’t have that luxury in a scrollable map.
Some public transportation maps of ferries combine the lines along overlapping segments – a no-no according to OpenStreetMap’s guidelines for mapping ferry routes. |
|
To me the dashed lines represent ferries much more intuitively than the solid lines do. The solid lines make me think of submarine cables or some kind of under water railway. I'm sure there are map styles that use solid lines for ferries, but among the general purpose highway maps we've been taking inspiration from, dashed lines seem to be the convention. One thing I think would be good to do is adjust the ferry line color to be lighter. Looking back at #266 where @Pengor introduced the ferry lines you can see that the water fill was a darker shade of blue at that time. #610 lightened the water fill, but I believe the ferry lines are still the same dark blue which makes them higher contrast and more prominent than they originally were. |
The ferry lines were lightened at the same time: #610 (comment). However, there is still room to lighten them further without affecting legibility. |
|
I agree it's more pleasing to the eye to eliminate overlapping dashed lines, but I'm not sure that's a typical treatment for ferry routes. I will say if we want to go this route (no pun intended) then we may want to switch to dashes at a lower zoom, I personally think your example at zoom 14 looks better in the before than the after. I also agree there may be room to lighten them, but we should still stick with a baseline level of contrast for accessibility reasons |
|
After reviewing the feedback, here's where I see the situation with ferries:
My proposed short-term solution is to use solid lines at low zooms since we expect routes to overlap, and switch to dashed lines at higher zooms when routes are spaced-out. To this end, I changed the transition from z15 to z13 (see screenshots). Overlaps at zooms greater than 13 can generally be fixed by mapping ferries with greater spacing. It is a downside to have two different styles for the same feature based on zoom, but Americana already does this with things like residential roads. This is the nature of a web map that spans from the local to the global. Long-term, we can improve styling and do more to avoid identical, overlapping, parallel lines with things like ferry hierarchy and combined trunk segments. But that's beyond the scope of this PR. Screenshots at zoom 13, 1x resolution Mid-latitude: High-latitude: |
|
I wonder if it’s obvious enough that the blue line represents a ferry when it crosses a river, as opposed to representing a dam or lock or even a seam in the waterbody. This is the Mississippi in New Orleans, where it’s about half a mile wide:
Then again, on main, it’s barely long enough to show a gap, let alone appear dashed. |
|
It looks like osm-carto has the same issues with ferry lines bunching up: So I suppose we can equally live with this artifact. I did think that the solid lines were an elegant solution to bypass it. |
Yes, and they've always looked terrible in my opinion 😅
This would be alleviated by showing a ferry icon at low zooms, as suggested elsewhere. I noticed a related issue today… thin strips of land become solid lines at low zooms. Since shorelines are the same color as ferry routes at the moment, this causes a collision with solid ferry lines. Non-blue ferries are common in US roadmaps, so we might consider other options.
|
|
I tried violet ferries and I think the color actually works pretty well. This categorizes them as public transport features, leaving blue to purely water features. It pairs nicely with airports and #755, and anticipates violet POI icons for all transit stations (including ferry terminals).
|
|
I agree that we should ideally distinguish ferries from causeways, but this collision is the consequence of making ferry lines solid, not the consequence of making them blue. Unlike runways and aerialways, ferries have a strong thematic connection to water. Many print maps plot the ferry’s course in black, but that’s a relatively neutral labeling color that doesn’t stand apart from the water when dotted or dashed. Purple is rather intense by comparison. I’d be concerned about whether readers could intuit that a solid purple line represents a ferry route, since that particular combination is so rare. In some cases, the reader could deduce the line’s purpose based on where it leads. But for instance, if the first ferry route I encounter on the map is the Jamestown–Scotland ferry across the James River, I would think it represents a tunnel, or a road under construction. Taking a step back: outside of OSM, either in print or digitally, how do non-inset maps avoid ferry line clutter? Could we explore changes to OpenMapTiles or Planetiler that filter or coalesce ferry routes? Maybe the tiles could indicate whether a ferry route crosses a river or a more substantial body of water, giving us the option to iconify only the former at some zoom levels. |
It's the combination of both factors. I was experimenting to see if a different color might be an acceptable design solution, but I agree blue is most intuitive. I've gone back to blue and dashed lines at all zooms. That leaves line thickness as the only change in this PR, which I think is worthwhile since it minimizes overlap and makes ferries somewhat less distracting in dense areas.
I'm very interested in this, as mentioned before. This PR is just a first step.
This is a neat idea. Sounds like a tough data processing problem though. There is the Zoom 11:
|
There are some PostGIS functions that can align points to a grid. Would it solve the problem if we made the ferry lines physically overlap but not necessarily coalesce common segments? |
This might have the effect of making the dashed lines solid unless we choose the dash pattern very carefully. But maybe the function you’re referring to could spread apart any lines that are too close together, depending on the zoom level. |
Can't we just render a casing the same color as the ocean underneath it, with the same width? |
|
Ooh, that’s an interesting idea, definitely worth a try. |
|
How would we feel about implementing this PR in a dashed style all the way up and log a bug about coalescing the ferry lines and putting that on the tile side? |
This is how the PR is now 👍 |
|
It sounds like we're satisfied with using the dashed style all the way up and making it a tileserver problem to coalesce the geometry (something I'm working on). Are we happy with the line style at low zooms? In contrast, osm-carto zoom 8, which is the lowest zoom with ferry lines, has a de-emphasized styling at the lower zooms that they appear: |
|
Looks great, thanks! |
Dashed ferry routes look weird when two are really close to each other, which happens a lot, even at high zooms.
My solution is to use a very thin undashed line until zoom 15, at which point I think the dashes are a nice flair since the style becomes more like a city map (e.g. streets become filled out in white). This results in strokes that are much less distracting, and I think produces a nice "brushed" effect when there are a lot of parallel routes at lower zooms.
There is still more we could do in terms of filtering or styling ferry routes, for example #719.
Screenshots
Screenshots are taken at 1x to prove clarity. The style looks even better at 2x of course.
Zoom 4 (with openmaptiles/openmaptiles#1486)
Zoom 5 (with openmaptiles/openmaptiles#1486)
Zoom 11
Zoom 14
Zoom 15
Aside
An aside: "nice looking" is also one area where mapping makes a big difference. Ferries tend to look the best on any map if they have reasonable route spacing, minimal route-route crossings, and lots of curvature nodes. For example, ferries of the Pearl River look great even though there are dozens.