Overlay map color schemes

[Jim]

Of course that gets back to my long-term wish of being able to run our own tile server and design custom tile sets that work well for us...

Also, I like the look of the gold for state routes as vdeane demonstrated.  I know some have expressed that it would seem disruptive to switch colors when people are so used to what we have, however.

[Duke87]

I don't like the "gold" (originally referred to as orange) so much for state routes since it's a bright color.

One good feature of the current US scheme that I do think we want to keep (and replicate elsewhere as practical) is to visually reinforce a sense of hierarchy by reserving bright colors for Tier 1/2/3 systems and keeping Tier 4/5 systems in more muted tones.


To this end, I do kind of like the #4B4B4B gray as shown michih's example for tier 4 state route systems. Might even like it better than brown.

[vdeane]

Keep in mind that the gold (officially called "yellow" even though yellow implies a much brighter color to me) I used in my link isn't the orange proposed earlier - it's the same gold currently used for the B Roads in Australia and Tier 5 systems everywhere else (yes, even the US and Canada).  So even if you go with gray (which I still don't like... it looks good when zoomed in close, but not when zoomed further out), it would still be in use in the US for a system that isn't a top tier unless a new color for the state/provincial secondary systems was also proposed.

Personally, I think using either the gold or light salmon would be a much less jarring switch than the gray.  So if we don't want the gold, then I guess my third choice would be to switch to light salmon to match Europe.  I don't like how the gray crowds out the other colors when zoomed out to view a whole region or how it looks drab when looking at an area that doesn't have many other route colors (such as zooming in close on Long Island or around Rochester).

One interesting thing I noticed: when using custom colors in Mapview, one can put in the color names instead of RGB values, but some of them (notably brown, "magenta", and "yellow") look different than they do when not setting manual colors.

perhaps also a revisit of how things are handled elsewhere in the world (especially as Europe and Australia are basically opposites for gold/light salmon usage).

I think Europe is fine. No need to change anything.

Everything is so inconsistent, though.  It's understandable with the E roads, but especially if the regions ended up with the same Tier 4 and 5 colors, just swapped, that would be weird.

IMO the gold stands out more than the light salmon, which makes it weird that it's for the lower tier system, though Europe Tier 5 systems are so dense (to the point where I wonder if they're the equivalent of county routes) that they'll overwhelm just about any color used.

IMO just about any color scheme we can come up with doesn't work well against the OSM background; it's just the nature of the beast. When I look at mapview I'll usually change to ESRI WorldTopo; I find it easier on the eyes.

That does match up with TM quite well.  Even the unclinched light salmon stands out!

[Jim]

One interesting thing I noticed: when using custom colors in Mapview, one can put in the color names instead of RGB values, but some of them (notably brown, "magenta", and "yellow") look different than they do when not setting manual colors.

I believe anything CSS understands as a color style should work as custom color specifications.  rgb(r,g,b), #rgb, #rrggbb, and any defined names of colors.

[michih]

Keep in mind that the gold (officially called "yellow" even though yellow implies a much brighter color to me) I used in my link isn't the orange proposed earlier - it's the same gold currently used for the B Roads in Australia and Tier 5 systems everywhere else (yes, even the US and Canada).

The name is just an enumation for a code: https://github.com/TravelMapping/Web/blob/master/lib/tmjsfuncs.js#L116

Code: [Select]

var colorCodes = new Array();
colorCodes[0] = { name: "blue", unclinched: "rgb(100,100,255)", clinched: "rgb(0,0,220)" };
colorCodes[1] = { name: "brown", unclinched: "rgb(153,152,102)", clinched: "rgb(153,102,0)" };
colorCodes[2] = { name: "red", unclinched: "rgb(255,100,100)", clinched: "rgb(224,0,0)" };
colorCodes[3] = { name: "yellow", unclinched: "rgb(255,216,100)", clinched: "rgb(232,176,0)" };
colorCodes[4] = { name: "teal", unclinched: "rgb(100,200,200)", clinched: "rgb(0,140,160)" };
colorCodes[5] = { name: "green", unclinched: "rgb(100,200,100)", clinched: "rgb(0,224,0)" };
colorCodes[6] = { name: "magenta", unclinched: "rgb(255,100,255)", clinched: "rgb(208,0,208)" };
colorCodes[7] = { name: "lightsalmon", unclinched: "rgb(224,162,162)", clinched: "rgb(240,150,115)" };
We modified the codes to look "good" on OSM tiles back in 2016.

So even if you go with gray (which I still don't like... it looks good when zoomed in close, but not when zoomed further out), it would still be in use in the US for a system that isn't a top tier unless a new color for the state/provincial secondary systems was also proposed.

I think that it still looks good when zoomed out. We could try to find a slightly brighter grey for "clinched".

perhaps also a revisit of how things are handled elsewhere in the world (especially as Europe and Australia are basically opposites for gold/light salmon usage).

I think Europe is fine. No need to change anything.

Everything is so inconsistent, though.  It's understandable with the E roads, but especially if the regions ended up with the same Tier 4 and 5 colors, just swapped, that would be weird.

What is inconsistent?
Where are tier 4 + 5 colors swapped?

IMO the gold stands out more than the light salmon, which makes it weird that it's for the lower tier system, though Europe Tier 5 systems are so dense (to the point where I wonder if they're the equivalent of county routes) that they'll overwhelm just about any color used.

Please use "yellow" instead of "gold" or "orange" so that everyone knows what we are talking about.
Note that the main issue back in 2016 was to find good color codes for clinched and unclinched.
With "gold" you just refer to the "yellow color code for clinched" but don't forget the "yellow color code for unclinched".

To be honest, the "unclinched" colors where the bigger issue back in 2016. Just select "Highlight Untraveled" on mapview and look at Europe. "Lightsalmon" sticks out quite good compared to "yellow" * and it sticks out to the OSM tile! I agree that "yellow" stands out more when you select "Highlight Traveled" but most non-local users travel the "lightsalmon" routes first.

*The density of the "yellow" (Tier 5) systems in some European regions makes it more difficult though. Most of it was developed after 2016

IMO just about any color scheme we can come up with doesn't work well against the OSM background; it's just the nature of the beast. When I look at mapview I'll usually change to ESRI WorldTopo; I find it easier on the eyes.

That does match up with TM quite well.  Even the unclinched light salmon stands out!

As mentioned above, light salmon is designed to stand out compared to yellow for untraveled routes.

[michih]

IMO just about any color scheme we can come up with doesn't work well against the OSM background; it's just the nature of the beast.

I disagree. I think the current color scheme for Europe works good. The "Highlight traveled"/"Highlight untraveled" toggle is very important to identify untraveled segments in a region where I do already have a lot of travels.

To this end, I do kind of like the #4B4B4B gray as shown michih's example for tier 4 state route systems. Might even like it better than brown.

It was mapcat's example though

https://travelmapping.net/user/mapview.php?units=miles&u=mapcat&v&colors=usaky:rgb(75,75,75):rgb(75,75,75)

[si404]

What is inconsistent?
Where are tier 4 + 5 colors swapped?

Australia, where I went with the national colours of green and gold (well 'yellow'), using the latter for B/State systems - in part because all the  alphanumeric route designations are yellow text on green (taken from UK primary routes, AFAICS).

I'm only using lightsalmon for C roads/Metropolitan Routes in lieu of another colour that isn't brown (which I'm using for tourist routes) - that grey would do very nicely.

I don't think there's anything wrong with different land masses doing different colour schemes.

[michih]

Got it. While light salmon is used for tier 4 systems in Europe, it is used for tier 5 in Australia. Yellow is used for tier 5 in Europe and tier 4 in Australia. That means, yellow is "higher" than light salmon in Australia which is contrary to Europe.

[vdeane]

I think that it still looks good when zoomed out. We could try to find a slightly brighter grey for "clinched".

That's a good idea.  I tried it out - it takes some getting used to, but I think I can get behind it.  The tier 5 systems looked pretty bright in comparison, so I changed them to light salmon.  Here's the test rendering.

EDIT: I also took a look at the area around Paris in that color scheme, to see how Europe looked in it.  Looks like the Tier 4 systems stand out well relative to Tier 5 in both clinched and unclinched.

One interesting thing I noticed: when using custom colors in Mapview, one can put in the color names instead of RGB values, but some of them (notably brown, "magenta", and "yellow") look different than they do when not setting manual colors.

I believe anything CSS understands as a color style should work as custom color specifications.  rgb(r,g,b), #rgb, #rrggbb, and any defined names of colors.

Ah, that explains it!  I didn't realize it was just taking CSS color codes and thought they related to the ones in the system...

[michih]

I think that it still looks good when zoomed out. We could try to find a slightly brighter grey for "clinched".

That's a good idea.  I tried it out - it takes some getting used to, but I think I can get behind it.  The tier 5 systems looked pretty bright in comparison, so I changed them to light salmon.  Here's the test rendering.

EDIT: I also took a look at the area around Paris in that color scheme, to see how Europe looked in it.  Looks like the Tier 4 systems stand out well relative to Tier 5 in both clinched and unclinched.

I also like that for Europe! You use the "new" grey for tier 4 and light salmon for tier 5. Both, traveled and untraveled look good!

[mapcat]

+1 for Valerie's tier 4/tier 5 scheme.

[yakra]

The Legend box does not get updated with user-specified colors.

[Jim]

The Legend box does not get updated with user-specified colors.

Yes, already an Issue: https://github.com/TravelMapping/Web/issues/579

[Jim]

I've created a few Issues related to overlay colors.  My plan is to rename the colors in the array at https://github.com/TravelMapping/Web/blob/d0c6a809d452d3c8fccd77616be3471338689f0f/lib/tmjsfuncs.js#L115 with a TM prefix, update the color names in systems.csv to match, add a few more predefined color options, then allow any of the predefined colors to be used in the colors= QS params (in addition to the CSS color specifications we can use now).

https://github.com/TravelMapping/Web/issues/580
https://github.com/TravelMapping/Web/issues/581
https://github.com/TravelMapping/Web/issues/582
https://github.com/TravelMapping/HighwayData/issues/4464

[Jim]

So related to this, I'm looking for names and RGB codes for clinched and unclinched colors that we might want to use as default colors for some systems and make available as easy options for users to specify in colors= QS params.  So far, I've seen some support for a gray option.