148 lines
9.2 KiB
HTML
148 lines
9.2 KiB
HTML
<!DOCTYPE html>
|
|
<html><head>
|
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
|
|
<title>highlight.mapcss</title>
|
|
<meta name="generator" content="KF5::SyntaxHighlighting - Definition (MapCSS) - Theme (Breeze Dark)"/>
|
|
</head><body style="background-color:#232629;color:#cfcfc2"><pre>
|
|
<span style="color:#7a7c7d">/*</span>
|
|
<span style="color:#7a7c7d"> * </span><span style="color:#3f8058;font-style:italic">SPDX-FileCopyrightText:</span><span style="color:#7a7c7d"> 2022 Volker Krause <vkrause@kde.org></span>
|
|
<span style="color:#7a7c7d"> * </span><span style="color:#3f8058;font-style:italic">SPDX-License-Identifier:</span><span style="color:#3f8058;font-style:italic"> </span><span style="color:#3f8058;font-style:italic">MIT</span>
|
|
<span style="color:#7a7c7d"> */</span>
|
|
|
|
<span style="color:#7a7c7d">// samples taken from kosmindoormap MapCSS parser unit tests</span>
|
|
|
|
<span style="font-weight:bold">@import</span> <span style="color:#8e44ad">url</span>(<span style="color:#f44f4f">"included.mapcss"</span>);
|
|
|
|
<span style="color:#7a7c7d">// union selector</span>
|
|
<span style="color:#2980b9">area</span>[railway=platform],
|
|
<span style="color:#2980b9">relation</span>[type=multipolygon][railway=platform]
|
|
{
|
|
<span style="color:#7f8c8d">color</span>: <span style="color:#f67400">#ff550022</span>;
|
|
<span style="color:#7f8c8d">fill-color</span>: <span style="color:#f67400">#80f0e0d0</span>;
|
|
}
|
|
|
|
<span style="color:#7a7c7d">// chained selector</span>
|
|
<span style="color:#2980b9">area</span>[railway=platform] <span style="color:#2980b9">node</span>[sign]
|
|
{
|
|
<span style="color:#7f8c8d">fill-color</span>: <span style="color:#f67400">#ff0000</span>;
|
|
<span style="color:#7f8c8d">opacity</span>: <span style="color:#f67400">0.5</span>;
|
|
}
|
|
|
|
<span style="color:#7a7c7d">// condition with colon-separated keys</span>
|
|
<span style="color:#2980b9">node</span>[building:part][building:part=elevator]
|
|
{
|
|
<span style="color:#7f8c8d">opacity</span>: <span style="color:#f67400">1</span>;
|
|
<span style="color:#7f8c8d">color</span>: building:color;
|
|
}
|
|
|
|
<span style="color:#7a7c7d">// text properties</span>
|
|
<span style="color:#2980b9">*</span> {
|
|
<span style="color:#7f8c8d">text</span>: ref;
|
|
<span style="color:#7f8c8d">text-color</span>: <span style="color:#f67400">#ff00ff</span>;
|
|
}
|
|
|
|
<span style="color:#7a7c7d">// line properties</span>
|
|
<span style="color:#2980b9">line</span> {
|
|
<span style="color:#7f8c8d">dashes</span>: <span style="color:#f67400">3</span>,<span style="color:#f67400">5</span>;
|
|
<span style="color:#7f8c8d">linecap</span>: <span style="color:#27aeae;font-weight:bold">round</span>;
|
|
<span style="color:#7f8c8d">linejoin</span>: <span style="color:#27aeae;font-weight:bold">bevel</span>;
|
|
<span style="color:#7f8c8d">casing-width</span>: <span style="color:#f67400">1</span>;
|
|
<span style="color:#7f8c8d">casing-color</span>: <span style="color:#f67400">#444444</span>;
|
|
<span style="color:#7f8c8d">casing-dashes</span>: <span style="color:#f67400">1</span>,<span style="color:#f67400">1</span>;
|
|
}
|
|
|
|
<span style="color:#7a7c7d">// zoom ranges</span>
|
|
<span style="color:#2980b9">node</span>|<span style="color:#3f8058">z12-13</span> {}
|
|
<span style="color:#2980b9">node</span>|<span style="color:#3f8058">z10</span> {}
|
|
<span style="color:#2980b9">node</span>|<span style="color:#3f8058">z-10</span> {}
|
|
<span style="color:#2980b9">node</span>|<span style="color:#3f8058">z10-</span> {}
|
|
<span style="color:#2980b9">node</span>|<span style="color:#3f8058">z12-13</span>[name] {}
|
|
<span style="color:#2980b9">node</span>|<span style="color:#3f8058">z14-</span>[name] {}
|
|
|
|
<span style="color:#7a7c7d">// numeric comparison conditions</span>
|
|
<span style="color:#2980b9">*</span> [layer><span style="color:#f67400">1</span>],
|
|
<span style="color:#2980b9">*</span> [layer<<span style="color:#f67400">2</span>],
|
|
<span style="color:#2980b9">*</span> [layer>=<span style="color:#f67400">3</span>],
|
|
<span style="color:#2980b9">*</span> [layer<=<span style="color:#f67400">4</span>] {}
|
|
|
|
<span style="color:#7a7c7d">// object types as tag or property values</span>
|
|
<span style="color:#2980b9">area</span>[indoor=area] {
|
|
<span style="color:#7f8c8d">text-position</span>: <span style="color:#27aeae;font-weight:bold">line</span>;
|
|
<span style="color:#7f8c8d">width</span>: width;
|
|
}
|
|
|
|
<span style="color:#7a7c7d">// units</span>
|
|
<span style="color:#2980b9">*</span> {
|
|
<span style="color:#7f8c8d">font-size</span>: <span style="color:#f67400">16</span><span style="font-weight:bold">pt</span>;
|
|
<span style="color:#7f8c8d">width</span>: <span style="color:#f67400">42</span><span style="font-weight:bold">px</span>;
|
|
<span style="color:#7f8c8d">casing-width</span>: <span style="color:#f67400">2</span><span style="font-weight:bold">m</span>;
|
|
}
|
|
|
|
<span style="color:#7a7c7d">// negative numbers</span>
|
|
<span style="color:#2980b9">*</span> {
|
|
<span style="color:#7f8c8d">width</span>: -<span style="color:#f67400">10.42</span>;
|
|
}
|
|
|
|
|
|
<span style="color:#7a7c7d">// colors</span>
|
|
<span style="color:#2980b9">*</span> {
|
|
<span style="color:#7f8c8d">text-color</span>: <span style="color:#f67400">#aabbcc</span>;
|
|
<span style="color:#7f8c8d">fill-color</span>: <span style="color:#f67400">#80ccbbaa</span>;
|
|
<span style="color:#7f8c8d">casing-color</span>: <span style="color:#f67400">#123</span>;
|
|
<span style="color:#7f8c8d">shield-color</span>: <span style="color:#8e44ad">rgb</span>(<span style="color:#f67400">1.0</span>, <span style="color:#f67400">0.5</span>, <span style="color:#f67400">0.25</span>);
|
|
<span style="color:#7f8c8d">shield-casing-color</span>: <span style="color:#8e44ad">rgba</span>(<span style="color:#f67400">0.75</span>, <span style="color:#f67400">1.0</span>, <span style="color:#f67400">0.25</span>, <span style="color:#f67400">0.5</span>);
|
|
<span style="color:#7f8c8d">color</span>: <span style="color:#f44f4f">"red"</span>;
|
|
}
|
|
|
|
<span style="color:#7a7c7d">// set tag</span>
|
|
<span style="color:#2980b9">node</span>[shop=bakery] {
|
|
<span style="font-weight:bold">set</span> mx:important;
|
|
}
|
|
|
|
<span style="color:#7a7c7d">// set tag to a specific value</span>
|
|
<span style="color:#2980b9">area</span>[shop=bakery] {
|
|
<span style="font-weight:bold">set</span> mx:importance = <span style="color:#f44f4f">"high"</span>;
|
|
<span style="font-weight:bold">set</span> mx:importance = 20;
|
|
}
|
|
|
|
<span style="color:#7a7c7d">// set class</span>
|
|
<span style="color:#2980b9">node</span>[shop=bakery],
|
|
<span style="color:#2980b9">node</span>[shop=pastry]
|
|
{
|
|
<span style="font-weight:bold">set</span> <span style="color:#27aeae">.importantShops</span>;
|
|
}
|
|
|
|
<span style="color:#7a7c7d">// class selectors</span>
|
|
<span style="color:#2980b9">node</span><span style="color:#27aeae">.importantShops</span> { <span style="color:#7f8c8d">color</span>: <span style="color:#f44f4f">"red"</span>; }
|
|
<span style="color:#2980b9">way</span><span style="color:#27aeae">.importantShops</span>|<span style="color:#3f8058">z20-</span> { <span style="color:#7f8c8d">color</span>: <span style="color:#f44f4f">"green"</span>; }
|
|
<span style="color:#2980b9">*</span><span style="color:#27aeae">.importantShops</span>[access=no] { <span style="color:#7f8c8d">color</span>: <span style="color:#f44f4f">"blue"</span>; }
|
|
|
|
<span style="color:#7a7c7d">// layer selectors (see https://wiki.openstreetmap.org/wiki/MapCSS/0.2/Proposal_layer_selector)</span>
|
|
<span style="color:#2980b9">way</span>[highway]<span style="color:#fdbc4b;font-weight:bold">::road</span> {
|
|
<span style="color:#7f8c8d">width</span>: <span style="color:#f67400">8</span>;
|
|
<span style="color:#7f8c8d">color</span>: <span style="color:#f67400">#ffffff</span>;
|
|
<span style="color:#7f8c8d">casing-width</span>: <span style="color:#f67400">2</span>;
|
|
<span style="color:#7f8c8d">casing-color</span>: <span style="color:#f67400">#a0a0a0</span>;
|
|
}
|
|
<span style="color:#2980b9">way</span>[railway=tram]<span style="color:#fdbc4b;font-weight:bold">::tram</span> {
|
|
<span style="color:#7f8c8d">width</span>: <span style="color:#f67400">2</span>;
|
|
<span style="color:#7f8c8d">color</span>: <span style="color:#f67400">#303030</span>;
|
|
<span style="color:#7f8c8d">z-index</span>: <span style="color:#f67400">1</span>;
|
|
}
|
|
<span style="color:#7a7c7d">// default layer selector</span>
|
|
<span style="color:#2980b9">node</span><span style="color:#fdbc4b;font-weight:bold">::default</span> {
|
|
<span style="color:#7f8c8d">icon-image</span>: <span style="color:#f44f4f">"bla"</span>;
|
|
}
|
|
|
|
<span style="color:#7a7c7d">//quoted values in conditions</span>
|
|
<span style="color:#2980b9">line</span>|<span style="color:#3f8058">z16-</span>[highway=service][service=<span style="color:#f44f4f">"drive-through"</span>] {
|
|
<span style="font-weight:bold">set</span> <span style="color:#27aeae">.service</span>;
|
|
<span style="color:#7f8c8d">width</span>: <span style="color:#f67400">1.5</span><span style="font-weight:bold">m</span>;
|
|
}
|
|
|
|
<span style="color:#7a7c7d">// single quote strings</span>
|
|
<span style="color:#2980b9">*</span>[service=<span style="color:#f44f4f">'drive-through'</span>] {
|
|
<span style="color:#7f8c8d">text</span>: <span style="color:#f44f4f">'abc</span><span style="color:#3daee9">\'</span><span style="color:#f44f4f">def"ghi</span><span style="color:#3daee9">\n</span><span style="color:#f44f4f">jkl'</span>;
|
|
}
|
|
</pre></body></html>
|