Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Distinguish highway bridges from non-bridges #169

Open
adamfranco opened this issue Feb 17, 2022 · 13 comments · May be fixed by #934
Open

Distinguish highway bridges from non-bridges #169

adamfranco opened this issue Feb 17, 2022 · 13 comments · May be fixed by #934
Labels
enhancement New feature or request highway-lines

Comments

@adamfranco
Copy link
Collaborator

While extra casings for bridges add visual clutter, it was noted by Minh in Slack that without them it can be difficult or impossible to disambiguate between an intersection and a flyover.

If we'd like to keep bridges subtle, then maybe just a slight extra width to the casing could be added. We could potentially layer two levels of casing (widest dark bottom, then a lighter slightly narrower, both under the normal road casing) to visually offset an outer bridge line from the normal casing. This technique could be especially useful for the dark-stroke style at lower zooms.

Maybe something along these lines:
Screen Shot 2022-02-17 at 4 28 21 PM

This sort of treatment could work with both case+fill style as well as stroked style and shouldn't conflict with expressway rendering.

At some point features will become too small to make differentiating bridges useful, maybe somewhere around z12

@1ec5
Copy link
Member

1ec5 commented Feb 17, 2022

Many state-scale road maps show “guardrails” similar to your mockup above, though the casing is thinner and the gap larger:

Clermont County Engineer (Engels) 2004
American Map NYC Eastern Long Island
Alabama DOT 1987–88 strip map

Most only show this detail when there’s a grade separation with no connecting ramps; otherwise, the interchange is generalized as a square or diamond, which is understood to be a cloverleaf, trumpet, etc.:

OklaDOT

Iowa DOT 2010

West Virignia DOT

MoDOT 2009

Some maps take a simpler approach, with just a knock-out (halo) effect but no guardrails:

Ohio DOT

Or just the guardrails but no gap:

Montana DOT 2007–08

Some maps not only show the guardrail but also depict each guardrail bending away from the roadway at either end, like in the real world:

Compass San Mateo County 2004

@adamfranco
Copy link
Collaborator Author

Thanks, @1ec5 ! I guess one challenge is that our style may not have a consistent background color as roads could be layered over landcover/landuse and similar backgrounds. This probably isn't an issue if the offset between the casing and guardrail is small, but if it is large it could stand out from these background colors quite a bit. 🤔

@1ec5
Copy link
Member

1ec5 commented Feb 18, 2022

Here are some city-scale maps that surround all roads with a hairline casing, making it unnecessary to give bridges special treatment:

Huff Realty (Engels) Hamilton County 1997 Universal Cincinnati Area

@adamfranco
Copy link
Collaborator Author

Ah. Good point. Hairline casings could eliminate the need for bridge distinctions, but they will be needed for the stroked style and maybe for the expressway style.

@1ec5
Copy link
Member

1ec5 commented Feb 18, 2022

I guess one challenge is that our style may not have a consistent background color as roads could be layered over landcover/landuse and similar backgrounds. This probably isn't an issue if the offset between the casing and guardrail is small, but if it is large it could stand out from these background colors quite a bit. 🤔

I wonder if that might actually be preferable to having the gap blend in with the background anyways, since that would make the guardrails harder to see. In any case, I think I’ve only seen guardrails and knockouts for road-road and road-rail separations, but not over water. In theory, we could distinguish bridges over water using seamark:type=bridge, but that isn’t tagged reliably enough.

Another possibility would be to use man_made=bridge areas as knockouts, but they would need some additional processing to determine where the guardrails would go. (Or we could render the guardrails themselves…) Unfortunately, this micromapping-based approach would be too sensitive to physical distances to be discernible when zoomed out.

@adamfranco
Copy link
Collaborator Author

Just noting that #84 is related to this bridge issue. If the change from stroke to casing is near the limit of where bridge distinctions need to be shown, then maybe we don't need to render guardrails.

Another alternative if we want to provide some distinction between bridges and intersections would be to add a light hairline casing to contrast with the dark strokes:
Screen Shot 2022-02-17 at 7 32 27 PM
or slightly thicker:
Screen Shot 2022-02-17 at 7 32 27 PM

@zekefarwell
Copy link
Collaborator

zekefarwell commented Feb 18, 2022

We did originally have darker casing to differentiate bridges but it was only ever implemented for motorways. It must have gotten lost in a refactor at some point along with the previously dashed tunnel casing. I like the look of the guardrails better than what we had before.

The zoom level where bridges and tunnels start being differentiated is supposed to be controlled by this variable but it looks like it's currently not working properly because I'm still seeing tunnels at zoom 10 and below. Introduced in #55

https://github.com/ZeLonewolf/openstreetmap-americana/blob/9f9c76704e75ff41ffd8d8dc07a13317a566f218/style/layer/road.js#L5-L6

@1ec5
Copy link
Member

1ec5 commented Feb 18, 2022

Another alternative if we want to provide some distinction between bridges and intersections would be to add a light hairline casing to contrast with the dark strokes

I like this knockout effect a lot. It’s very intuitive against the land background. If a bridge crosses over water, would this lighter knockout still look like a bridge casing, or could it be mistaken for a causeway?

@adamfranco
Copy link
Collaborator Author

Here's the "knock-out" type of casing in background color over water:
Screen Shot 2022-02-17 at 7 32 27 PM

And here's with two different gray mid-tones:
Screen Shot 2022-02-17 at 7 32 27 PM
Screen Shot 2022-02-17 at 7 32 27 PM

The first is certainly "cleaner" on roads, but might not work with landuse/landcover anyway.

adamfranco added a commit that referenced this issue Feb 21, 2022
Low-zoom "stroke" rendering is now handled as a dark fill with thin 
light casing. At high zooms the color pallet flips to light fill.

This addresses the bridge layering challenge noted in #169 by always 
using casing for all highways. Even without extra bridge rails, the 
light casing allows viewers to distinguish overlaps versus junctions in 
"stroke" style.
adamfranco added a commit that referenced this issue Feb 22, 2022
This PR disambiguates highway levels (fixes #84) by always showing primary and lower highways with either dark or light treatments rather than a mix of both. The current dark/light switch happens at z15, but it could be changed earlier or later.

Additionally, the dark treatment from highways changes from from using the fill layer to draw "strokes" (without a casing layer) to always drawing both the casing and fill layers, but using a light casing with dark fill and a dark casing with light fill at the different zooms of primary and down. This partially or fully addresses #169 by allowing the the dark treatment's lighter casing to disambiguate between junctions and bridges/overpasses.
@michaelblyons
Copy link
Contributor

If there's concern about the casing for guardrails clashing with the background, can the casing have an intermediate opacity? Possibly even a gradient that is strongest against the guardrail? I don't have evidence for this in use on real maps, but it could let you use the guardrail style on non-white backgrounds.

Apologies if the technology dictates 100% opacity for casings.

@1ec5 1ec5 mentioned this issue Jul 16, 2022
8 tasks
@claysmalley claysmalley added the enhancement New feature or request label Jun 16, 2023
@claysmalley claysmalley linked a pull request Sep 24, 2023 that will close this issue
@1ec5
Copy link
Member

1ec5 commented Sep 25, 2023

For the AARoads Wiki fork, I implemented a knockout effect with hairline guardrails in aaroads-wiki#2 (comment). I mostly got away with it because none of the roads in that fork have a casing that would look redundant to the knockout. In fact, that lack of a casing all but necessitated a knockout, as we discovered above. The knockout and guardrail look OK at high zoom levels but not that great at mid zoom levels. On the one hand, I would’ve preferred the knockout to be wider on land, but on the other hand, I really needed it to be less prominent over water, since there’s already plenty of contrast between the road and water.

@1ec5
Copy link
Member

1ec5 commented Sep 25, 2023

If there's concern about the casing for guardrails clashing with the background, can the casing have an intermediate opacity? Possibly even a gradient that is strongest against the guardrail? I don't have evidence for this in use on real maps, but it could let you use the guardrail style on non-white backgrounds.

#934 takes this approach by way of a fill extrusion layer. While it avoids looking like a causeway over water or a gap in a park, it’s also a distinct bridge color that varies significantly depending on context. I think this variation adds to the map’s visual complexity rather than clearing it up.

Another possibility would be to use man_made=bridge areas as knockouts, but they would need some additional processing to determine where the guardrails would go. (Or we could render the guardrails themselves…) Unfortunately, this micromapping-based approach would be too sensitive to physical distances to be discernible when zoomed out.

A solution to this would be to compose two different knockouts per bridge: one based on the bridge area and another based on the roadway that’s always wider than the roadway. In turn, there can be two guardrail layers based on the same features. To keep the bridge area–based guardrail layer from looking like an outline, the roadway-based knockout layer can cover up the bridge area–based guardrail layer at the abutments. To avoid redundant guardrails, both guardrail layers would appear beneath both knockout layers.

@claysmalley
Copy link
Member

I like the guardrail idea. I'll try putting that together.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request highway-lines
Projects
None yet
Development

Successfully merging a pull request may close this issue.

5 participants