[[TranslatedPages]]
= Cycleways =
Highlights cycleways


== Code ==
{{{
#!style type="mapcss"


meta 
{
    title: "Cycleways";
    description: "Standalone style to visualize cycleway=* and bicycle=* of objects, fade everything else. Please turn off JOSM internal style to use it.";
    version: "1.[[revision]]_[[date]]";
    author: "cmuelle8";
    link: "https://josm.openstreetmap.de/wiki/Styles/Cycleways";
    min-josm-version: "5198";
}

meta[lang=de]
{
    title: "Radwege und -spuren";
    description: "Eigenständiger Stil, der Radwege und -spuren, sowie bicycle=official|designated|yes|no hervorhebt - bitte JOSM-Stil deaktivieren.";
}



/* basic geometry */
canvas
{
    fill-color: #606060;
}
node
{
    symbol-shape: square;
    symbol-size: 2;
    symbol-stroke-color: lightgrey;
    symbol-stroke-opacity: 0.1;
}
node:connection
{
    symbol-shape: square;
    symbol-size: 2;
    symbol-stroke-color: white;
    symbol-stroke-opacity: 0.2;
}
way
{
    color: white;
    width: 0.5;
    opacity: 0.1;
}



/* faded area styles for orientation */
relation[landuse],
way[landuse]:closed
{
    fill-color: yellow;
    fill-opacity: 0.02;
    z-index: -0.9;
}
relation[natural],
relation[landuse=forest],
way[natural]:closed,
way[landuse=forest]:closed
{
    fill-color: green;
    fill-opacity: 0.02;
    z-index: -0.9;
}
relation[waterway],
relation[landuse=basin],
relation[natural=~/water/],
way[waterway]:closed,
way[landuse=basin]:closed,
way[natural=~/water/]:closed
{
    fill-color: blue;
    fill-opacity: 0.08;
    z-index: -0.9;
}
relation[building],
way[building]:closed
{
    width: 2;
    color: magenta;
    opacity: 0.1;
    fill-color: magenta;
    fill-opacity: 0.02;
    z-index: 0.2;
}
relation[highway][area?],
way[highway][area?]:closed
{
    width: 2;
    color: orange;
    opacity: 0.5;
    fill-color: orange;
    fill-opacity: 0.2;
    z-index: -0.5;
}



/* highway=* tag styles */
way[highway]
{
	color: darkgrey;
	opacity: 1.0;

	cycleway-weakinfo-color: #4141ff;
	cycleway-weakinfo-width: 1.5;
	cycleway-color: #4100ff;
	cycleway-width: 2.0;
	cyclelane-width: 1.5;
}
way[highway=~/motorway|trunk|primary|secondary|tertiary/]
{
	width: 4;
}
way[highway=~/living_street|residential|service|track|unclassified/]
{
	width: 2;
}
way[highway=~/bridleway|cycleway|footway|path/]
{
	width: 1;
}



/* cycleway=* tag styles */
way[cycleway:both=lane],
way[cycleway:left=lane],
way[cycleway=both],
way[cycleway=left]
{
	left-casing-color: eval(prop("cycleway-color"));
	left-casing-width: eval(prop("cyclelane-width"));
}
way[cycleway:both=lane],
way[cycleway:right=lane],
way[cycleway=both],
way[cycleway=right]
{
	right-casing-color: eval(prop("cycleway-color"));
	right-casing-width: eval(prop("cyclelane-width"));
}
way[cycleway=lane]
{
	casing-color: eval(prop("cycleway-weakinfo-color"));
	casing-width: eval(prop("width")+(2*prop("cycleway-weakinfo-width")));
	casing-dashes: list(16,3);
}




way[cycleway:both=track],
way[cycleway:left=track]
{
	left-casing-color: eval(prop("cycleway-color"));
	left-casing-width: eval(prop("cycleway-width"));
	left-casing-offset: +4;
}
way[cycleway:both=track],
way[cycleway:right=track]
{
	right-casing-color: eval(prop("cycleway-color"));
	right-casing-width: eval(prop("cycleway-width"));
	right-casing-offset: +4;
}
way[cycleway=track]
{
	left-casing-color: eval(prop("cycleway-weakinfo-color"));
	left-casing-width: eval(prop("cycleway-weakinfo-width"));
	left-casing-dashes: list(16,3);
	left-casing-offset: +4;
	right-casing-color: eval(prop("cycleway-weakinfo-color"));
	right-casing-width: eval(prop("cycleway-weakinfo-width"));
	right-casing-dashes: list(16,3);
	right-casing-offset: +4;
}



/* highway=cycleway or stand-alone, dedicated cycleways */
way[bicycle_road=yes],
way[highway=cycleway],
way[highway=path][bicycle=~/official|designated/]
{
	color: eval(prop("cycleway-color"));
	casing-color: eval(prop("cycleway-color"));
	casing-width: eval(prop("width")+(2*prop("cyclelane-width")));
}



/* visualize access=* tag on an extra layer with a thin line in the way's center*/
/* .. continuous line if the way is officially marked by e.g. road signs */
way[bicycle=official]::access_layer,
way[cycleway=sharrow]::access_layer,
way[highway=cycleway]::access_layer
{
	color: #b100ff;
	width: 1;
}
/* .. long dashes if the way is designated to be used by cyclists */
way[bicycle=designated]::access_layer
{
	color: #b100ff;
	width: 1;
	dashes: list(12,3);
}
/* .. short dashes if cycling merely is allowed */
way[bicycle=yes]::access_layer
{
	color: #b100ff;
	width: 1;
	dashes: list(3,3);
}
/* .. short black/red dashes if cycling is not allowed */
way[bicycle=no]::access_layer
{
	color: red;
	width: 1;
	dashes: list(3,3);
	dashes-background-color: black;
}
way::access_layer
{
	z-index: 10.0;
}



/* add a background glow for ways taking part in a bicycle route relation - similar to what is done in potlatch2.mapcss */
relation[type=route][route=bicycle][network=ncn] > way::relation_underlay { z-index: -200; width: 15; color: red; opacity: 0.08; linecap: none; }
relation[type=route][route=bicycle][network=rcn] > way::relation_underlay { z-index: -200; width: 15; color: cyan; opacity: 0.08; linecap: none; }
relation[type=route][route=bicycle][network=lcn] > way::relation_underlay { z-index: -200; width: 15; color: blue; opacity: 0.08; linecap: none; }

}}}