Changes between Version 157 and Version 268 of Help/Styles/MapCSSImplementation


Ignore:
Timestamp:
(multiple changes)
Author:
(multiple changes)
Comment:
(multiple changes)

Legend:

Unmodified
Added
Removed
Modified

  • Help/Styles/MapCSSImplementation

    v157 v268  
    11[[TranslatedPages]]
    2 [[PageOutline(1-10,Table of Contents)]]
    3 This page documents details on JOSM's [osmwiki:MapCSS/0.2 MapCSS] implementation. This is used for the following features in JOSM:
    4 
    5 * [wiki:Styles Mappaint styles]
    6 * [wiki:Rules Validator rules]
    7 * [Help/Action/Search Search dialog]
     2[[PageOutline(2-10,Table of Contents)]]
     3= MapCSS Implementation=
     4JOSM's implementation of [osmwiki:MapCSS/0.2 MapCSS] is used for the features:
     5
     6* [wikitr:/Styles Mappaint styles]
     7* [wikitr:/Rules Validator rules], see [wikitr:/Help/Validator/MapCSSTagChecker MapCSS tag checker] for the special part for rules only.
     8* [wikitr:/Help/Action/Search Search dialog]
     9
     10Consider installing the [https://marketplace.visualstudio.com/items?itemName=whammo.mapcss-syntax MapCSS Syntax Highlighter] in VS Code to add visual highlighting for MapCSS paint and validator syntax.
    811
    912== General Structure ==
    … …  
    1821    set: class;
    1922    set: .class;
     23    /* note that validator rules do not use the colon after set */
    2024}
    2125}}}
    … …  
    3741}}}
    3842
    39 == Selectors ==
    40 ''Selectors'' denote the filter expressions of a MapCSS rule. The rule is only applied to a map object, if its selectors match
    41 with the object.
    42 
    43 Selectors in MapCSS are different from standard CSS for the web. MapCSS only supports a subset of the standard CSS selectors, but
    44 extends them with additional selectors required for OSM data.
     43
     44== Selectors == #Selectors
     45''Selectors'' denote the filter expressions of a MapCSS rule. The rule is only applied to a map object, if its selectors match with the object.
     46
     47Selectors in MapCSS are different from standard CSS for the web. MapCSS only supports a subset of the standard CSS selectors, but extends them with additional selectors required for OSM data.
    4548
    4649Some basic examples:
    … …  
    5053way[highway=residential] {  /*  the styles */}
    5154
    52 /* applied to new, closed ways on layer 1, provided they have the tag amenity=parking and access=public, and provided
     55/* applied to new, closed ways on layer 1, provided they have the tag amenity=parking and access=customers, and provided
    5356 * the zoom level is between 11 and 14
    5457 */
    55 way|z11-14[amenity=parking][access=public]:closed:new::layer_1 {...}
    56 
    57 
    58 area[amenity=parking][access=public], area[amenity=parking][!access] {...}
     58way|z11-14[amenity=parking][access=customers]:closed:new::layer_1 {...}
     59
     60
     61area[amenity=parking][access=customers], area[amenity=parking][!access] {...}
    5962relation[type=route][route=foot] > way::relation_underlay {..}
    6063}}}
    … …  
    6568
    6669=== Type selector ===
    67 
    68 {{{#!th align=left valign=top
     70{{{#!th valign=top
    6971'''Selector'''
    7072}}}
    71 {{{#!th align=left valign=top
     73{{{#!th valign=top
    7274'''Description'''
    7375}}}
    7476|-------------------------------------------------------------------------------
    75 {{{#!td align=left  valign=top
     77{{{#!td align=center  valign=top
    7678*
    7779}}}
    … …  
    8082}}}
    8183|-------------------------------------------------------------------------------
    82 {{{#!td align=left  valign=top
    83 {{{node}}}, {{{way}}}, {{{relation}}}
     84{{{#!td align=center  valign=top
     85`node`, `way`, `relation`
    8486}}}
    8587{{{#!td align=left  valign=top   
    … …  
    8789}}}
    8890|-------------------------------------------------------------------------------
    89 {{{#!td align=left  valign=top
    90 {{{area}}}
     91{{{#!td align=center  valign=top
     92`area`
    9193}}}
    9294{{{#!td align=left  valign=top   
    … …  
    98100way[natural=beach], relation[type=multipolygon][natural=beach] {...}
    99101}}}
    100 Note that {{{area}}} selects unclosed ways as well, so it may be useful to add the {{{:closed}}} pseudo class. The JOSM Validator will give a warning for unclosed ways that have an area style.
    101 }}}
    102 |-------------------------------------------------------------------------------
    103 {{{#!td align=left  valign=top
    104 {{{meta}}}
     102Note that `area` selects unclosed ways as well, so it may be useful to add the `:closed` pseudo class. The JOSM Validator will give a warning for unclosed ways that have an area style.
     103}}}
     104|-------------------------------------------------------------------------------
     105{{{#!td align=center  valign=top
     106`meta`
    105107}}}
    106108{{{#!td align=left  valign=top   
    107 The {{{meta}}} selector starts a special rule that should stand at the beginning of the file. It gives some general information on the style sheet. All software that supports MapCSS should be able to parse this sections without errors, so do not use exotic syntax extensions in this part.
     109The `meta` selector starts a special rule that should stand at the beginning of the file. It gives some general information on the style sheet. All software that supports MapCSS should be able to parse this sections without errors, so do not use exotic syntax extensions in this part.
    108110{{{
    109111#!mapcss
    … …  
    120122}}}
    121123|-------------------------------------------------------------------------------
    122 {{{#!td align=left  valign=top
    123 {{{canvas}}}
     124{{{#!td align=center  valign=top
     125`canvas`
    124126}}}
    125127{{{#!td align=left  valign=top   
    … …  
    146148}}}
    147149|-
    148 {{{#!td
    149 {{{fill-color}}}
     150{{{#!td align=center
     151`fill-color`
    150152}}}
    151153{{{#!td
    152154Specifies the overall fill/background color (`background-color` is deprecated since r7110).
    153155}}}
    154 {{{#!td
     156{{{#!td align=center
    155157''Color''
    156158}}}
    157159{{{#!td align=center
    158 {{{black}}}
     160`black`
    159161}}}
    160162|-
    161 {{{#!td
    162 {{{default-points}}}
     163{{{#!td align=center
     164`default-points`
    163165}}}
    164166{{{#!td
    165167Whether default point style should be added to nodes where no style applies.
    166168}}}
    167 {{{#!td
     169{{{#!td align=center
    168170''Boolean''
    169171}}}
    170172{{{#!td align=center
    171 {{{true}}}
     173`true`
    172174}}}
    173175|-
    174 {{{#!td
    175 {{{default-lines}}}
     176{{{#!td align=center
     177`default-lines`
    176178}}}
    177179{{{#!td
    178180Whether default line style should be added to ways where no style applies.
    179181}}}
    180 {{{#!td
     182{{{#!td align=center
    181183''Boolean''
    182184}}}
    183185{{{#!td align=center
    184 {{{true}}}
     186`true`
    185187}}}
    186188}}}
    … …  
    205207* The functions ''prop()'' and ''is_prop_set()'' are only supported on the right side of the > sign.
    206208* The functions ''parent_tag'' and ''parent_tags'' (see below) can be used to access tags from the parent(s).
    207 * For compatibility with the MapCSS 0.2 standard, `relation[type=route][route=foot] way {/*...*/}`, without the greather-than-sign `>` is supported, too. However, no [[#Linkselector]] may be specified in this case.
    208 
     209* For compatibility with the MapCSS 0.2 standard, `relation[type=route][route=foot] way {/*...*/}`, without the greater-than-sign `>` is supported, too. However, no [#LinkSelector Link selector] may be specified in this case.
    209210
    210211=== Parent selector ===
    … …  
    213214Similar to a child selector, a parent selector only matches if both the parent and the child object match. In contrast to the child selector, the character < is used.
    214215
    215 In contrast to the child selector, the parent object will be "selected". In other words, the properties in the {{{{...}}}}-Declaration Block apply to the object on the right hand side of the "<" sign.
     216In contrast to the child selector, the parent object will be "selected". In other words, the properties in the `{{{...}}}`-Declaration Block apply to the object on the right hand side of the "<" sign.
    216217
    217218Example:
    … …  
    225226
    226227=== Condition selector ===
    227 Selectors can include a set of conditions. If any of these conditions evaluates to false, the selector doesn't match and the style
    228 rule isn't applied.
    229 
    230 An '''attribute condition''' specifies a condition on a tag of an OSM object.
     228Selectors can include a set of conditions. If any of these conditions evaluates to false, the selector doesn't match and the style rule isn't applied.
     229
     230An '''attribute condition''' specifies a condition on a tag of an OSM object.
    231231
    232232[=#condition_selector_operators]
    233 {{{#!th align=left valign=top 
     233{{{#!th valign=top
    234234'''Operator'''
    235235}}}
    236 {{{#!th align=left valign=top
     236{{{#!th valign=top
    237237'''Description'''
    238238}}}
    239 {{{#!th align=left valign=top
     239{{{#!th valign=top
    240240'''Example'''
    241241}}}
    242242|-------------------------------------------------------------------------------
    243 {{{#!td align=left valign=top
     243{{{#!td align=center valign=top
    244244`=`
    245245}}}
    246 {{{#!td align=left  valign=top   
     246{{{#!td align=left valign=top
    247247Exact match of the value.
    248248}}}
    249 {{{#!td align=left  valign=top   
    250 {{{
    251 #!mapcss
    252 way[highway=residential]                    /* is case sensitive, i.e. does NOT match e.g. highway=Residential or Highway=residential */
    253 node[name="My name"]                        /* use quotes if key or value includes spaces */
    254 node["name:ru"="Калининград"]               /* use quotes if key or value includes special characters like colons or unicode characters */
    255 }}}
    256 }}}
    257 |-------------------------------------------------------------------------------
    258 {{{#!td align=left valign=top
     249{{{#!td align=left valign=top
     250{{{
     251#!mapcss
     252way[highway=residential]                    /* is case sensitive, i.e. does NOT match e.g. highway=Residential or Highway=residential   */
     253node[name="My name"]                        /* use quotes if key or value includes spaces                                               */
     254node["name:pl"="Królewiec"]                 /* use quotes if key or value includes special characters like colons or unicode characters */
     255}}}
     256}}}
     257|-------------------------------------------------------------------------------
     258{{{#!td align=center valign=top
    259259`!=`
    260260}}}
    261 {{{#!td align=left  valign=top   
    262 Value not equal 
    263 }}}
    264 {{{#!td align=left  valign=top   
     261{{{#!td align=left valign=top
     262Value not equal
     263}}}
     264{{{#!td align=left valign=top
    265265{{{
    266266#!mapcss
    267267way[highway!=residential]
    268268node[name!="My name"]
    269 node["name:ru"!="Калининград"]
    270 }}}
    271 }}}
    272 |-------------------------------------------------------------------------------
    273 {{{#!td align=left valign=top
     269node["name:pl"!="Królewiec"]
     270}}}
     271}}}
     272|-------------------------------------------------------------------------------
     273{{{#!td align=center valign=top
    274274`<`, `>`, `<=`, `>=`
    275275}}}
    276 {{{#!td align=left  valign=top   
    277 Comparision for numeric values.
    278 
    279 }}}
    280 {{{#!td align=left  valign=top   
     276{{{#!td align=left valign=top
     277Comparison for numeric values.
     278
     279}}}
     280{{{#!td align=left valign=top
    281281{{{
    282282#!mapcss
    283283node[population >= 50000]                   /* population greater than or equal to 50000 */
    284 node[ele = 3000]                            /* elevation with exactly 3000 meters */
    285 }}}
    286 }}}
    287 |-------------------------------------------------------------------------------
    288 {{{#!td align=left valign=top
    289 {{{^=}}}
    290 }}}
    291 {{{#!td align=left  valign=top   
     284node[ele = 3000]                            /* elevation with exactly 3000 meters        */
     285}}}
     286}}}
     287|-------------------------------------------------------------------------------
     288{{{#!td align=center valign=top
     289`^=`
     290}}}
     291{{{#!td align=left valign=top
    292292Prefix match
    293293}}}
    294 {{{#!td align=left  valign=top   
     294{{{#!td align=left valign=top
    295295{{{
    296296#!mapcss
    … …  
    299299}}}
    300300|-------------------------------------------------------------------------------
    301 {{{#!td align=left valign=top
     301{{{#!td align=center valign=top
    302302`$=`
    303303}}}
    304 {{{#!td align=left  valign=top   
     304{{{#!td align=left valign=top
    305305Postfix match
    306306}}}
    307 {{{#!td align=left  valign=top   
     307{{{#!td align=left valign=top
    308308{{{
    309309#!mapcss
    … …  
    312312}}}
    313313|-----------------------------------------------
    314 {{{#!td align=left valign=top
     314{{{#!td align=center valign=top
    315315`*=`
    316316}}}
    317 {{{#!td align=left  valign=top   
     317{{{#!td align=left valign=top
    318318Substring match
    319319}}}
    320 {{{#!td align=left  valign=top   
     320{{{#!td align=left valign=top
    321321{{{
    322322#!mapcss
    … …  
    325325}}}
    326326|-------------------------------------------------------------------------------
    327 {{{#!td align=left valign=top
     327{{{#!td align=center valign=top
    328328`~=`
    329329}}}
    330 {{{#!td align=left  valign=top   
     330{{{#!td align=left valign=top
    331331List membership
    332332}}}
    333 {{{#!td align=left  valign=top   
    334 {{{
    335 #!mapcss
    336 *[vending~=stamps]                          /* the tag value for the tag 'vending' consists of a list of ;-separated values    */
    337                                             /* and one of these values is 'stamps'                                             */
    338 }}}
    339 }}}
    340 |-------------------------------------------------------------------------------
    341 {{{#!td align=left valign=top
     333{{{#!td align=left valign=top
     334{{{
     335#!mapcss
     336*[vending~=stamps]                          /* the tag value for the tag 'vending' consists of a list of ;-separated values */
     337                                            /* and one of these values is 'stamps'                                          */
     338}}}
     339}}}
     340|-------------------------------------------------------------------------------
     341{{{#!td align=center valign=top
    342342`=~`
    343343}}}
    344 {{{#!td align=left  valign=top   
    345 [https://download.oracle.com/javase/8/docs/api/java/util/regex/Pattern.html#sum Regular expression] match
    346 
    347 }}}
    348 {{{#!td align=left  valign=top   
     344{{{#!td align=left valign=top
     345[https://docs.oracle.com/en/java/javase/11/docs/api/java.base/java/util/regex/Pattern.html#sum Regular expression] match
     346
     347}}}
     348{{{#!td align=left valign=top
    349349{{{
    350350#!mapcss
    351351*[name=~/^My_pattern.*/]                    /* the value of the tag 'name' matches with the regular expression '^My_pattern.*' */
    352                                             /* Note, that reqular expressions have to be enclosed in /.../                     */                 
    353 }}}
    354 Case-insensitive matching can be enabled via the embedded flag expression `(?i)` (see [https://docs.oracle.com/javase/7/docs/api/java/util/regex/Pattern.html#CASE_INSENSITIVE Pattern.CASE_INSENSITIVE]).
    355 {{{
    356 #!mapcss
    357 *[name =~ /^(?i)(parking)$/]                 /* matches parking, Parking, PARKING, PaRkInG,... */ 
    358 *[name =~ /^(?U)(\p{Lower})+$/]              /* name consists of only lower case unicode characters */                 
    359 }}}
    360 }}}
    361 |-------------------------------------------------------------------------------
    362 {{{#!td align=left valign=top
     352                                            /* Note, that reqular expressions have to be enclosed in /.../                     */
     353}}}
     354Case-insensitive matching can be enabled via the embedded flag expression `(?i)` (see [https://docs.oracle.com/en/java/javase/11/docs/api/java.base/java/util/regex/Pattern.html#CASE_INSENSITIVE Pattern.CASE_INSENSITIVE]).
     355{{{
     356#!mapcss
     357*[name =~ /^(?i)(parking)$/]                 /* matches parking, Parking, PARKING, PaRkInG,...      */
     358*[name =~ /^(?U)(\p{Lower})+$/]              /* name consists of only lower case unicode characters */
     359}}}
     360}}}
     361|-------------------------------------------------------------------------------
     362{{{#!td align=center valign=top
    363363`!~` (since r6455)
    364364}}}
    365 {{{#!td align=left  valign=top   
    366 negated [https://download.oracle.com/javase/8/docs/api/java/util/regex/Pattern.html#sum Regular expression] match
    367 
    368 }}}
    369 {{{#!td align=left  valign=top   
     365{{{#!td align=left valign=top
     366negated [https://docs.oracle.com/en/java/javase/11/docs/api/java.base/java/util/regex/Pattern.html#sum Regular expression] match
     367
     368}}}
     369{{{#!td align=left valign=top
    370370{{{
    371371#!mapcss
    … …  
    374374}}}
    375375|-------------------------------------------------------------------------------
    376 {{{#!td align=left valign=top
    377 `∈` ([http://www.fileformat.info/info/unicode/char/2208/index.htm U+2208], since r6609)
    378 }}}
    379 {{{#!td align=left  valign=top   
     376{{{#!td align=center valign=top
     377`∈` ([https://www.fileformat.info/info/unicode/char/2208/index.htm U+2208], since r6609)
     378}}}
     379{{{#!td align=left valign=top
    380380element of
    381381
    382382Matches when an object matches the right selector(s) contains at least one element which match the left selector(s).
    383 
    384 }}}
    385 {{{#!td align=left  valign=top   
     383}}}
     384{{{#!td align=left valign=top
    386385{{{
    387386#!mapcss
    … …  
    390389}
    391390}}}
    392 Finds areas with `amenity=parking` that contain at least one node or area with `amenity=parking`.
    393 Since r15064 this rule produces one warning for each element on the left when there are multiple matches.
    394 }}}
    395 |-------------------------------------------------------------------------------
    396 {{{#!td align=left  valign=top
    397 `⊆` ([http://www.fileformat.info/info/unicode/char/2286/index.htm U+2286], since r15102)
    398 }}}
    399 {{{#!td align=left  valign=top   
     391Finds areas with `amenity=parking` that contain at least one node or area with `amenity=parking`. Since r15064 this rule produces one warning for each element on the left when there are multiple matches.
     392}}}
     393|-------------------------------------------------------------------------------
     394{{{#!td align=center valign=top
     395`⊆` ([https://www.fileformat.info/info/unicode/char/2286/index.htm U+2286], since r15102)
     396}}}
     397{{{#!td align=left valign=top
    400398Subset of or Equal To
    401399
    402400Synonym for `∈`.
    403401}}}
    404 {{{#!td align=left  valign=top   
     402{{{#!td align=left valign=top
    405403{{{
    406404#!mapcss
    … …  
    412410}}}
    413411|-------------------------------------------------------------------------------
    414 {{{#!td align=left valign=top
    415 `⊇` ([http://www.fileformat.info/info/unicode/char/2287/index.htm U+2287], since r15102)
    416 }}}
    417 {{{#!td align=left  valign=top   
     412{{{#!td align=center valign=top
     413`⊇` ([https://www.fileformat.info/info/unicode/char/2287/index.htm U+2287], since r15102)
     414}}}
     415{{{#!td align=left valign=top
    418416Superset of or Equal To
    419417
    420418Matches when an object matches the right selector(s) and is contained in one or more elements which match the left selectors.
    421 
    422 }}}
    423 {{{#!td align=left  valign=top   
    424 {{{
    425 #!mapcss
    426 area[amenity=parking] ⊇ *amenity=parking]
     419}}}
     420{{{#!td align=left valign=top
     421{{{
     422#!mapcss
     423area[amenity=parking] ⊇ *[amenity=parking]
    427424}}}
    428425finds nodes or areas with `amenity=parking` inside areas with `amenity=parking`. Slower than `⊆` and thus not useful in validator rules, but can be useful in the search dialog.
    429 
    430 }}}
    431 |-------------------------------------------------------------------------------
    432 {{{#!td align=left  valign=top
    433 `⊈` ([http://www.fileformat.info/info/unicode/char/2288/index.htm U+2288], since r15102)
    434 }}}
    435 {{{#!td align=left  valign=top   
     426}}}
     427|-------------------------------------------------------------------------------
     428{{{#!td align=center valign=top
     429`⊈` ([https://www.fileformat.info/info/unicode/char/2288/index.htm U+2288], since r15102)
     430}}}
     431{{{#!td align=left valign=top
    436432Neither a Subset of nor Equal To
    437433
    438434Matches when an object matches the right selector(s) and does not contain any element which matches the left selectors.
    439 
    440 }}}
    441 {{{#!td align=left  valign=top   
     435}}}
     436{{{#!td align=left valign=top
    442437{{{
    443438#!mapcss
    444439*[highway=street_lamp] ⊈ area:closed2[amenity=parking][lit=yes]
    445440}}}
    446 finds areas amenity=parking that have lit=yes but don't contain a lamp.
    447 Always add `:closed2` to avoid false positives as unclosed areas never contain something.
    448 }}}
    449 |-------------------------------------------------------------------------------
    450 {{{#!td align=left  valign=top
    451 `⊉` ([http://www.fileformat.info/info/unicode/char/2289/index.htm U+2289], since r15102)
    452 }}}
    453 {{{#!td align=left  valign=top   
     441finds areas amenity=parking that have lit=yes but don't contain a lamp. Always add `:closed2` to avoid false positives as unclosed areas never contain something.
     442}}}
     443|-------------------------------------------------------------------------------
     444{{{#!td align=center valign=top
     445`⊉` ([https://www.fileformat.info/info/unicode/char/2289/index.htm U+2289], since r15102)
     446}}}
     447{{{#!td align=left valign=top
    454448Neither a Superset of nor Equal To
    455449
    456450Matches when an object matches the right selector(s) and is not contained in any area which matches the left selectors.
    457 
    458 }}}
    459 {{{#!td align=left  valign=top   
     451}}}
     452{{{#!td align=left valign=top
    460453{{{
    461454#!mapcss
    462455area[landuse=residential] ⊉ *[building]
    463456}}}
    464 finds buildings which are not inside any landuse=residential area. Note that this operator is likely to produce false positives
    465 when you have `landuse=residential`areas which don't match `:closed2`.
    466 }}}
    467 |-------------------------------------------------------------------------------
    468 {{{#!td align=left  valign=top
    469 `⧉` ([http://www.fileformat.info/info/unicode/char/29c9/index.htm U+29C9], since r6613)
    470 }}}
    471 {{{#!td align=left  valign=top   
     457finds buildings which are not inside any landuse=residential area. Note that this operator is likely to produce false positives when you have `landuse=residential`areas which don't match `:closed2`.
     458}}}
     459|-------------------------------------------------------------------------------
     460{{{#!td align=center valign=top
     461`⧉` ([https://www.fileformat.info/info/unicode/char/29c9/index.htm U+29C9], since r6613)
     462}}}
     463{{{#!td align=left valign=top
    472464crossing
    473 
    474 }}}
    475 {{{#!td align=left  valign=top   
     465}}}
     466{{{#!td align=left valign=top
    476467{{{
    477468#!mapcss
    … …  
    487478In addition, you can test whether a tag is present or not:
    488479
    489 {{{#!th align=left valign=top
     480{{{#!th valign=top
    490481'''Condition'''
    491482}}}
    492 {{{#!th align=left valign=top
     483{{{#!th valign=top
    493484'''Example'''
    494485}}}
    … …  
    517508|-------------------------------------------------------------------------------
    518509{{{#!td align=left  valign=top
    519 Presence of tag by [https://download.oracle.com/javase/8/docs/api/java/util/regex/Pattern.html#sum Regular expression] match (since r6547)
     510Presence of tag by [https://docs.oracle.com/en/java/javase/11/docs/api/java.base/java/util/regex/Pattern.html#sum Regular expression] match (since r6547)
    520511}}}
    521512{{{#!td align=left  valign=top   
    … …  
    539530"yes", "true", or "1". All other values are evaluated to false.
    540531
    541 {{{#!th align=left valign=top
     532{{{#!th valign=top
    542533'''Condition'''
    543534}}}
    544 {{{#!th align=left valign=top
     535{{{#!th valign=top
    545536'''Example'''
    546537}}}
    … …  
    552543{{{
    553544#!mapcss
    554 way[oneway?]                  /* matches any way with a truth value in the tag 'oneway'  */
     545way[oneway?]                   /* matches any way with a truth value in the tag 'oneway' */
    555546}}}
    556547}}}
    … …  
    562553{{{
    563554#!mapcss
    564 way[oneway?!]                  /* matches any way with a false value in the tag 'oneway'  */
    565 }}}
    566 }}}
    567 
    568 === Territory selector ===
    569 
    570 You can test whether an object is located inside or outside of a specific territory. JOSM has an internal database for this. The territories file is an osm file and can be downloaded [/export/HEAD/josm/trunk/data/boundaries.osm here] and opened in JOSM to investigate it [attachment:boundaries.png (screenshot preview)]. It contains borders of all countries of the world. Due to performance reasons the borders are simplified. They can be refined for special cases on request. The territories are "tagged" with their [https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2 ISO_3166-1_alpha-2 codes]. USA, Canada, China, India and Australia have additional boundaries for their subdivisions. See the following examples on how to use the territory selectors. Territory selectors are less useful in mappaint styles and can be very resource heavy there. However they are much more useful for [wiki:Help/Validator/MapCSSTagChecker mapcss based validator rules]. To select territories with left-hand-traffic or right-hand-traffic, there is a simpler way, see [#PseudoClasses]. See #10387 for main implementation of this feature.
    571 
    572 {{{
    573 #!mapcss
    574 node[inside("FR")]                    /* matches any node located inside of France (this includes all the overseas territories)                                     */
    575 node[inside("FX")]                    /* matches any node located inside of Metropolitan France (i.e. only the mainland part with its near islands including Corse) */
    576 node[inside("EU")]                    /* matches any node located inside of the European Union                                                                      */
    577 node[inside("FR,DE")]                 /* matches any node located inside of France __OR__ inside of Germany                                                         */
    578 node[inside("US-FL")]                 /* matches any node located inside of the US state Florida                                                                    */
    579 
    580 node[outside("FR")]                   /* matches any node located outside of France                                                                                 */
    581 node[outside("FR,DE")]                /* matches any node located outside of France __AND__ outside of Germany                                                      */
    582 node[inside("US")][outside("US-FL")]  /* matches any node located inside of the USA except the state Florida                                                        */
    583 }}}
    584 
    585 === Link selector ===
     555way[oneway?!]                  /* matches any way with a false value in the tag 'oneway' */
     556}}}
     557}}}
     558
     559=== Territory selector === #Territoryselector
     560You can test whether an object is located inside or outside of a specific territory. JOSM has an internal database for this. The [source:/trunk/resources/data/boundaries.osm territories file] can be downloaded and opened in JOSM to investigate it [attachment:boundaries.png (screenshot preview)]. It contains borders of all countries of the world. Due to performance reasons the borders are simplified. They can be refined for special cases on request. The territories are "tagged" with their [https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2 ISO_3166-1_alpha-2 codes]. USA, Canada, China, India and Australia have additional boundaries for their subdivisions. See the following examples on how to use the territory selectors. Territory selectors are less useful in mappaint styles and can be very resource heavy there. However they are much more useful for [wikitr:/Help/Validator/MapCSSTagChecker mapcss based validator rules]. To select territories with left-hand-traffic or right-hand-traffic, there is a simpler way, see [#PseudoClasses Pseudo Classes]. See #10387 for main implementation of this feature.
     561
     562{{{
     563#!mapcss
     564                                      /* matches any node located …                             */
     565node[inside("FR")]                    /* … inside of France (includes the overseas territories) */
     566node[inside("FX")]                    /* … inside of Metropolitan France (i.e. only the
     567                                         mainland part with its near islands including Corse)   */
     568node[inside("EU")]                    /* … inside of the European Union                         */
     569node[inside("FR,DE")]                 /* … inside of France __OR__ inside of Germany            */
     570node[inside("US-FL")]                 /* … inside of the US state Florida                       */
     571
     572node[outside("FR")]                   /* … outside of France                                    */
     573node[outside("FR,DE")]                /* … outside of France __AND__ outside of Germany         */
     574node[inside("US")][outside("US-FL")]  /* … inside of the USA except the state Florida           */
     575}}}
     576
     577=== Link selector ===#LinkSelector
    586578In a child selector, you can formulate conditions on the link between a parent and a child object.
    587579
    … …  
    594586}}}
    595587
    596 {{{#!th align=left valign=top
     588{{{#!th valign=top
    597589'''Operator'''
    598590}}}
    599 {{{#!th align=left valign=top
     591{{{#!th valign=top
    600592'''Description'''
    601593}}}
    602 {{{#!th align=left valign=top
     594{{{#!th valign=top
    603595'''Example'''
    604596}}}
    605597|-------------------------------------------------------------------------------
    606 {{{#!td align=left  valign=top
     598{{{#!td align=center  valign=top
    607599`=`
    608600}}}
    609601{{{#!td align=left  valign=top   
    610 Exact match of the role name. The name name {{{role}}} is compulsory in this context.
     602Exact match of the role name. The name `role` is compulsory in this context.
    611603}}}
    612604{{{#!td align=left  valign=top   
    … …  
    618610}}}
    619611
    620 The operators {{{!=, ^=, $=, *=, and ~=}}} are supported too. Please refer to [#condition_selector_operators condition selector operators].
    621 
    622 Nodes in ways and members in relations are ordered. You can formulate conditions on the position of a node in a way or a member
    623 object in a relation. Positive numbers count from first to last element, negative numbers (since r8236) count from last to first element.
     612The operators `!=`, `^=`, `$=`, `*=` and `~=` are supported too. Please refer to [#condition_selector_operators condition selector operators].
     613
     614Nodes in ways and members in relations are ordered. You can formulate conditions on the position of a node in a way or a member object in a relation. Positive numbers count from first to last element, negative numbers (since r8236) count from last to first element.
    624615
    625616{{{
    … …  
    639630}}}
    640631
    641 
    642632=== Zoom selector ===
    643 You can decorate a type selector with a '''zoom selector'''. The zoom selector restricts the range of zoom levels
    644 at which the respective MapCSS rule is applied.
    645 
    646 {{{#!th align=left valign=top
    647 '''Example'''
    648 }}}
    649 {{{#!th align=left valign=top
    650 '''Description'''
    651 }}}
    652 |-------------------------------------------------------------------------------
    653 || {{{way|z12 {...} }}} || At zoom level 12 ||
    654 || {{{way|z13-15 {...} }}} || From 13 to 15 ||
    655 || {{{way|z16- {...} }}} || 16 and above ||
    656 || {{{way|z-12 {...} }}} || 12 and below ||
    657 || {{{way {...} }}} || any zoom level ||
     633You can decorate a type selector with a '''zoom selector'''. The zoom selector restricts the range of zoom levels at which the respective MapCSS rule is applied.
     634||= '''Example 1''' =||= '''Example 2''' =||= '''Example 3''' =||= '''Description''' =||
     635|| `way|z12 {...}` || `node|z12 {...}` || `node|z12[...] {...}` || At zoom level 12 ||
     636|| `way|z13-15 {...}` || `node|z13-15 {...}` || `way|z13-15[...] {...}` ||From 13 to 15 ||
     637|| `way|z16- {...}` || `node|z16- {...}` || `node|z16-[...] {...}` || 16 and above ||
     638|| `way|z-12 {...}` || `node|z-12 {...}` || `node|z-12[...] {...}` || 12 and below ||
     639|| `way {...}` || `node{...}` || `way[...] {...}` || any zoom level ||
    658640
    659641The precise definition of scale ranges for each zoom level may change in the future. By rule of thumb you can expect to be approximately at zoom level ''n'' when imagery displays slippymap tiles of level ''n''.
    660642
    661 
    662 === Pseudo Classes ===
     643=== Pseudo Classes ===#PseudoClasses
    663644See [/doc/org/openstreetmap/josm/gui/mappaint/mapcss/ConditionFactory.PseudoClasses.html Javadoc] for the up-to-date list of pseudo classes supported by JOSM's MapCSS implementation.
    664645
    665 || {{{:closed}}} || true for ways where the first node is the same as the last and for any (completely downloaded) multipolygon relation ||
    666 || {{{:closed2}}} || same as above, but this one ignores if a multipolygon is downloaded completely (since r9099) ||
    667 || {{{:completely_downloaded}}} || true for a relation whose members are all downloaded (since r9099) ||
    668 || {{{:new}}} || all new objects ||
    669 || {{{:connection}}} || true for nodes that are used by more than one way ||
    670 || {{{:unconnected}}} || true for nodes that are not used by any way (since r6687) ||
    671 || {{{:tagged}}} || What JOSM considers tagged, i.e. an object that with a tag key other than the following: {{{source*, source_ref, note, comment, converted_by, created_by, watch*, fixme, FIXME, description, attribution}}} (version r4008; in this list, {{{*}}} is a glob)
    672 || {{{:righthandtraffic}}} || true if there is right-hand traffic at the current location (since r7193); see [[left-right-hand-traffic]] for screenshot of areas ||
    673 || {{{:clockwise}}} || Whether the way is closed and oriented clockwise, or non-closed and the 1st, 2nd and last node are in clockwise order. ||
    674 || {{{:anticlockwise}}} || Whether the way is closed and oriented anticlockwise, or non-closed and the 1st, 2nd and last node are in anticlockwise order. ||
    675 || {{{:unclosed_multipolygon}}} || true for fully loaded unclosed multipolygon relations (since r8252) ||
    676 || {{{:open_end}}} || to select end nodes of unclosed multipolygon relations with `relation:unclosed_multipolygon >:open_end node` (since r8252) ||
    677 || {{{:in-downloaded-area}}} || true if an object is within source area and false if in the hatched area (since r8495). ||
    678 || {{{:selected}}} || true if an object is selected in the editor (since r9341). ||
    679 || {{{:modified}}} || changed objects (since r7193). ||
    680 You can also negate pseudo classes. E.g. {{{!:new}}} for all old objects.
     646||= '''Class''' =||= '''Description''' =||
     647|| `:closed` || true for ways where the first node is the same as the last and for any (completely downloaded) multipolygon relation ||
     648|| `:closed2` || same as above, but this one ignores if a multipolygon is downloaded completely (since r9099) ||
     649|| `:completely_downloaded` || true for a relation whose members are all downloaded (since r9099) ||
     650|| `:new` || all new objects ||
     651|| `:connection` || true for nodes that are used by more than one way ||
     652|| `:unconnected` || true for nodes that are not used by any way (since r6687) ||
     653|| `:tagged` || What JOSM considers tagged, i.e. an object that with a tag key other than the following: `source*`, `source_ref`, `note`, `comment`, `converted_by`, `created_by`, `watch*`, `fixme`, `FIXME`, `description`, `attribution` (version r4008; in this list, `*` is a glob)
     654|| `:area-style` || true if the object has an area style ||
     655|| `:righthandtraffic` || true if there is right-hand traffic at the current location (since r7193); see [wikitr:/left-right-hand-traffic left-right-hand-traffic] for screenshot of areas ||
     656|| `:clockwise` || Whether the way is closed and oriented clockwise, or non-closed and the 1st, 2nd and last node are in clockwise order. ||
     657|| `:anticlockwise` || Whether the way is closed and oriented anticlockwise, or non-closed and the 1st, 2nd and last node are in anticlockwise order. ||
     658|| `:unclosed_multipolygon` || true for fully loaded unclosed multipolygon relations (since r8252) ||
     659|| `:open_end` || to select end nodes of unclosed multipolygon relations with `relation:unclosed_multipolygon >:open_end node` (since r8252) ||
     660|| `:in-downloaded-area` || true if an object is within source area and false if in the hatched area (since r8495). ||
     661|| `:selected` || true if an object is selected in the editor (since r9341). ||
     662|| `:highlighted` || true if the object is highlighted ||
     663|| `:modified` || changed and new objects (since r7193). ||
     664You can also negate pseudo classes. E.g. `!:new` for all old objects.
    681665
    682666=== Layer Identifier ===
    683 
    684667Layers can be used to create more than one style for a single object. Here is an example:
    685668{{{
    … …  
    695678}
    696679
    697 way[access][access!=public]::non_public_access_layer {
     680way[access][access!=yes]::non_public_access_layer {
    698681    width: +2;
    699682    color:red;
    … …  
    709692}
    710693}}}
    711 This draws all secondary and tertiary roads in yellow and orange respectively. Any road with an access tag other than public will get an extra line style below ('''{{{object-z-index:-1.0;}}}''') the main line. If that part of the street happens to be a bridge, it will also get a half transparent blue overlay. The relative width value ('''{{{width: +2;}}}''') refers to the width on the default layer (2 or 3 in this case).
     694This draws all secondary and tertiary roads in yellow and orange respectively. Any road with an access tag other than yes will get an extra line style below ('''`object-z-index:-1.0;`''') the main line. If that part of the street happens to be a bridge, it will also get a half transparent blue overlay. The relative width value ('''`width: +2;`''') refers to the width on the default layer (2 or 3 in this case).
    712695
    713696The name for the layer can be any identifier.
    714697
    715 If you omit the layer in the selector, this is the same as using {{{::default}}}.
     698If you omit the layer in the selector, this is the same as using `::default`.
    716699
    717700One more example:
    … …  
    734717The result looks this way:
    735718
    736 [[Image(multiple_icons_and_texts.png)]]
    737 
    738 In addition, you can use the * layer to override and initialize all layers.[[br]]
     719[[Image(multiple_icons_and_texts.png,link=)]]
     720
     721In addition, you can use the * layer to override and initialize all layers. \\
    739722It overrides all existing subparts, so
    740723
    … …  
    743726way::A { a; }
    744727way::B { b; }
    745 way::* { c; }
     728way::* { c; }  /* overrides all existing subparts */
    746729}}}
    747730is equivalent to
    … …  
    750733way::A { a; }
    751734way::B { b; }
    752 way::A { c; }
    753 way::B { c; }
     735way::A { c; } /* overrides a with c all existing subparts */
     736way::B { c; } /* overrides b with c all existing subparts */
    754737}}}
    755738And it initializes new subparts. In other words:
    … …  
    778761}}}
    779762
    780 
    781763=== Grouping ===
    782 
    783764Rules with common declaration block can be grouped into one:
    784765{{{
    … …  
    819800way.path { text:auto; text-color: green; text-position: line; text-offset: 5; }
    820801}}}
    821 You can also negate classes. E.g. {{{way!.path}}} for all ways, which are not part of the class ''.path''.
    822 
    823 == @supports rule for conditional processing [''since 8087''] ==
    824 
    825 @supports rules are used to skip a section of the style under certain conditions. Typically you want to use a feature which is introduced in a newer version of JOSM, but like to have a fall back style for users of older JOSM clients. Example:
     802You can also negate classes. E.g. `way!.path` for all ways, which are not part of the class ''.path''.
     803
     804=== Classes and Layer together ===
     805If you want to use layer and classes together, please note that you have to identify the class via is_prop_set.
     806
     807{{{#!mapcss
     808node[railway=signal] { set sgnl; }
     809
     810/* it doesn't work */
     811node.sgnl::layer_signal_icon  { z-index: 1000; ... icon: icon/signal-icon.svg; ... }
     812node.sgnl::layer_signal_text  { z-index: 1010; ... text: concat("Name of signal: ", tag("ref")); ..... )
     813
     814/* use instead: is_prop_set("...", "default") */
     815node[is_prop_set("sgnl", "default")]::layer_signal_icon  { z-index: 1000; ... icon: icon/signal-icon.svg; ... }
     816node[is_prop_set("sgnl", "default")]::layer_signal_text  { z-index: 1010; ... text: concat("Name of signal: ", tag("ref")); ..... )
     817}}}
     818
     819=== @supports Conditional Processing  ===
     820@supports rules are used to skip a section of the style under certain conditions. Typically you want to use a feature which is introduced in a newer version of JOSM, but like to have a fall back style for users of older JOSM clients. This feature came with r8087. Example:
    826821{{{
    827822#!mapcss
    … …  
    872867}}}
    873868{{{#!td
    874 Only include {{{@supports}}} section when the current version of JOSM is greater than or equal to the specified number.
     869Only include `@supports` section when the current version of JOSM is greater than or equal to the specified number.
    875870}}}
    876871|-
    … …  
    879874}}}
    880875{{{#!td
    881 Only include {{{@supports}}} section when the current version of JOSM is lower than or equal to the specified number.
     876Only include `@supports` section when the current version of JOSM is lower than or equal to the specified number.
    882877}}}
    883878|-
    … …  
    886881}}}
    887882{{{#!td
    888 Only include {{{@supports}}} section when the name of the editor / renderer matches the given string. In JOSM, the only accepted value is {{{josm}}}.
    889 }}}
    890 
    891 Conditions can be combined with {{{and}}}:
     883Only include `@supports` section when the name of the editor / renderer matches the given string. In JOSM, the only accepted value is `josm`.
     884}}}
     885
     886Conditions can be combined with `and`:
    892887
    893888{{{
    … …  
    898893}}}
    899894
    900 Other logical operators like {{{or}}} and {{{not}}} can also be used. Parentheses are needed if you want to combine different logical operators:
     895Other logical operators like `or` and `not` can also be used. Parentheses are needed if you want to combine different logical operators:
    901896
    902897{{{
    … …  
    907902}}}
    908903
    909 Since @supports rules are only supported in JOSM 8087 and later, you should also specify this as minimum JOSM version in the meta selector:
     904Since @supports rules are only supported in JOSM r8087 and later, you should also specify this as minimum JOSM version in the meta selector:
    910905
    911906{{{
    … …  
    917912}}}
    918913
     914
    919915== Style settings ==
    920 
    921 [[Help/Dialog/MapPaint/StyleSettings|Styles settings]] are used to provide the user settings to customize a mappaint style. The user can use them in the MapPaint dialog. Style settings are availible since r7450. The internal style provides style settings since r7454. Note that there are plans to extend the implementation of style settings (currently there are only boolean values supported), so the mapcss syntax for style settings could change in the future (see #10435).
    922 
    923 create a setting:
     916[wikitr:/Help/Dialog/MapPaint/StyleSettings Styles settings] are used to provide the user settings to customize a mappaint style. The user can use them in the [wikitr:/Help/Dialog/MapPaint MapPaint dialog]. The following `type` of settings are available:
     917* `boolean` (since r7450)
     918* `double` (since r15731, see #10435)
     919* `string` (since r15731, see #10435)
     920* `color` (since r16843, see #10435)
     921
     922=== Settings of type `boolean` ===
     923Create a setting of type `boolean`:
    924924{{{
    925925#!mapcss
    … …  
    930930}
    931931}}}
    932 use a setting:
     932
     933Use a setting of type `boolean`:
    933934{{{
    934935#!mapcss
    … …  
    939940}}}
    940941
    941 == Properties ==
    942 
     942=== Settings of type `double` ===
     943Create a setting of type `double`:
     944{{{
     945#!mapcss
     946setting::place_font_size {
     947  type: double;
     948  label: tr("Set place name font size...");
     949  default: 11;
     950}
     951}}}
     952
     953Use a setting of type `double`:
     954{{{
     955#!mapcss
     956node.place, way.place, area.place {
     957  font-size: setting("place_font_size");
     958}
     959}}}
     960
     961=== Settings of type `string` ===
     962Create a setting of type `string`:
     963{{{
     964#!mapcss
     965setting::textdisplay {
     966  type: string;
     967  label: tr("key used for displaying");
     968  default: "name"; /* examples for usage: alt_name, old_name, addr:housename, ref, operator, ... */
     969}
     970}}}
     971
     972Use a setting of type `string`:
     973{{{
     974#!mapcss
     975way {
     976  text: tag(setting("textdisplay"));
     977}
     978}}}
     979
     980=== Settings of type `color` ===
     981Create a setting of type `color`. The `default` color can be any color as understood under [wikitr:/Help/Styles/MapCSSImplementation#Propertyvaluesexplanations Property values explanations]:
     982{{{
     983#!mapcss
     984setting::colordisplay {
     985  type: color;
     986  label: tr("key used for displaying");
     987  default: colorDisplayCustomPref#FF00FF;
     988}
     989}}}
     990
     991Use a setting of type `color`:
     992{{{
     993#!mapcss
     994way {
     995  color: setting("colordisplay");
     996}
     997}}}
     998
     999=== Grouping settings ===
     1000Similar settings can be grouped together by defining ''settings groups'' (since r15289):
     1001
     1002{{{
     1003#!mapcss
     1004settings::my_group {
     1005  label: tr("my wonderful group");
     1006  icon: "my_beautiful_icon";
     1007}
     1008}}}
     1009
     1010Label is mandatory, icon is optional.
     1011
     1012Once a setting group is defined, it can be referenced from all settings belonging to it:
     1013
     1014{{{
     1015#!mapcss
     1016setting::hide_icons {
     1017  type: boolean;
     1018  label: tr("Hide icons at low zoom");
     1019  default: true;
     1020  group: "my_group";
     1021}
     1022}}}
     1023
     1024Settings groups are displayed as sub-menus from the style settings menu. If at least two settings belong to a group, a special "Toggle all settings" menu item allows to quickly switch on/off all settings from this group at once. Usage example: [wikitr:/Styles/MapWithAI MapWithAI].
     1025
     1026
     1027== Properties ==#Properties
    9431028=== General properties ===
    9441029
    9451030||=  '''Key''' =||= '''Description''' =||= '''Value Format''' =||= '''Default Value''' =||
    946 || {{{z-index}}}                                 || Specify the order the objects are drawn: The objects with higher z-index are drawn on top of objects with lower z-index || ''Number'' (can be negative) ||  0  ||
    947 || {{{major-z-index}}} || Similar to {{{z-index}}}, but it has higher priority than {{{z-index}}}. So if one object has a higher {{{major-z-index}}} than the other, it is drawn on top. If the {{{major-z-index}}} is the same, {{{z-index}}} decides. || ''Number'' (can be negative) ||  Depends on style element: area: 1, casing: 2, left-/right-casing: 2.1, line-pattern: 2.9, line: 3, point: 4, default-point: 4.1, line-text: 4.9, point-text: 5  ||
    948 || {{{object-z-index}}} || Similar to {{{z-index}}}, but has lower priority. Controls the painting order for overlapping objects. E.g. for two crossing ways with text: Use {{{z-index}}} or {{{major-z-index}}} if you first want to draw the two lines and then the two captions. Use {{{object-z-index}}} if one of the ways should be completely on top of the other. || ''Number'' (can be negative) ||  0  ||
    949 || {{{modifier}}} || Better control, whether a default line / node symbol is generated by JOSM. This happens when there is no proper style ({{{modifier=false}}}) found on any layer. || {{{false}}} or {{{true}}} || {{{false}}} for the default layer and {{{true}}} for any other layer ||
     1031|| `z-index` || Specify the order the objects are drawn: The objects with higher z-index are drawn on top of objects with lower z-index || ''Number'' (can be negative) ||  0  ||
     1032|| `major-z-index` || Similar to `z-index`, but it has higher priority than `z-index`. So if one object has a higher `major-z-index` than the other, it is drawn on top. If the `major-z-index` is the same, `z-index` decides. || ''Number'' (can be negative) || Depends on style element: area: 1, casing: 2, left-/right-casing: 2.1, line-pattern: 2.9, line: 3, point: 4, default-point: 4.1, line-text: 4.9, point-text: 5 ||
     1033|| `object-z-index` || Similar to `z-index`, but has lower priority. Controls the painting order for overlapping objects. E.g. for two crossing ways with text: Use `z-index` or `major-z-index` if you first want to draw the two lines and then the two captions. Use `object-z-index` if one of the ways should be completely on top of the other. || ''Number'' (can be negative) ||  0  ||
     1034|| `modifier` || Better control, whether a default line / node symbol is generated by JOSM. This happens when there is no proper style (`modifier=false`) found on any layer. || `false` or `true` || `false` for the default layer and `true` for any other layer ||
    9501035
    9511036Note that due to performance reasons the values for the three z-indexes are limited to 24 bit float values with max. 5 decimal digits. Currently the internal mappaint style uses values with max. 2 digits before and after the decimal separator. To avoid problems use values of z-indexes between -99.999 and +99.999. (See also #14485)
    9521037
    953 
    9541038=== Icon and symbol styles ===
    9551039
    9561040||=  '''Key''' =||= '''Description''' =||= '''Value Format''' =||= '''Default Value''' =||
    957 || {{{icon-image}}} || The icon at node position. See also [wiki:Help/Styles/Images Images]. || ''Image'' ||  -  ||
    958 || {{{icon-opacity}}} || Opacity of the icon image || ''Opacity'' ||  1.0  ||
    959 || {{{icon-width}}} || Width of the icon. If only one of the properties {{{icon-width}}} and {{{icon-height}}} is given, the image will be scaled proportionally. The icon will keep the original size, if neither {{{icon-width}}} nor {{{icon-height}}} is set. || ''Number'' ||  -  ||
    960 || {{{icon-height}}} || Height of the icon. (See {{{icon-width}}}) || ''Number'' ||  -  ||
     1041|| `icon-image` || The icon at node position. See also [wikitr:/Help/Styles/Images Images]. || ''Image'' ||  -  ||
     1042|| `icon-opacity` || Opacity of the icon image || ''Opacity'' ||  1.0  ||
     1043|| `icon-width` || Width of the icon. If only one of the properties `icon-width` and `icon-height` is given, the image will be scaled proportionally. The icon will keep the original size, if neither `icon-width` nor `icon-height` is set. || ''Number'' ||  -  ||
     1044|| `icon-height` || Height of the icon. (See `icon-width`) || ''Number'' ||  -  ||
    9611045|| `icon-offset-x` || Shift the icon in horizontal direction (positive values to the right) (since r8085) || ''Number'' ||  0  ||
    9621046|| `icon-offset-y` || Shift the icon in vertical direction (positive values downwards) (since r8085) || ''Number'' ||  0  ||
    963 || `icon-rotation` || Rotate the icon clockwise or anti clockwise (negative value)(since r8260) || `[rad]`, `[rad]rad`, `[deg]°`, `[deg]deg`, `[grad]grad`, `[turn]turn` ([https://developer.mozilla.org/en/docs/Web/CSS/angle definition]) or a cardinal direction (e.g. `northeast` or `sw`); See also the functions `degree_to_radians`, `cardinal_to_radians`. ||  -  ||
    964 || `icon-position` || Define the position of the icon for areas. Same as `text-position` (since r11730). || {{{center}}}, {{{inside}}}, {{{line}}} || {{{center}}} ||
    965 || {{{symbol-shape}}}                               || Display a symbol at the position of the node || {{{square}}}, {{{circle}}}, {{{triangle}}}, {{{pentagon}}}, {{{hexagon}}}, {{{heptagon}}}, {{{octagon}}}, {{{nonagon}}}, {{{decagon}}} ||  -  ||
    966 || {{{symbol-size}}} || Size of the symbol || ''Number'', can be relative ("+4") ||  10  ||
    967 || {{{symbol-stroke-width}}} || outline stroke width || ''Width'' ||  1.0 if {{{symbol-stroke-color}}} is set  ||
    968 || {{{symbol-stroke-color}}} || line color || ''Color'' || {{{#FFC800}}} if {{{symbol-stroke-width}}} is set ||
    969 || {{{symbol-stroke-opacity}}} || line opacity || ''Opacity'' ||  1.0  ||
    970 || {{{symbol-fill-color}}} || fill color for the shape || ''Color'' || {{{blue}}}, unless either {{{symbol-stroke-width}}} or {{{symbol-stroke-color}}} is set ||
    971 || {{{symbol-fill-opacity}}} || fill opacity || ''Opacity'' || 1.0  ||
    972 || {{{text-...}}}, {{{font-...}}} ||||||  general text & font properties  ||
    973 || {{{text-anchor-horizontal}}} || horizontal text label placement || {{{left}}}, {{{center}}}, {{{right}}} ||  {{{right}}}  ||
    974 || {{{text-anchor-vertical}}} || vertical text label placement || {{{above}}}, {{{top}}}, {{{center}}}, {{{bottom}}}, {{{below}}} ||  {{{bottom}}}  ||
    975 
    976 Do not rely on the default values for {{{symbol-...}}} properties (except for {{{opacity}}}). They are intended for "quick & dirty" style sheets and should be set to an explicit value.
    977 
    978 
    979 
    980 
    981 
    982 === Line styles ===
     1047|| `icon-rotation` || Rotate the icon clockwise or anti clockwise (negative value)(since r8260) || `[rad]`, `[rad]rad`, `[deg]°`, `[deg]deg`, `[grad]grad`, `[turn]turn` ([https://developer.mozilla.org/en/docs/Web/CSS/angle definition]) \\ or a cardinal direction (e.g. `northeast` or `sw`); \\ or `way` to rotate the icon in the direction of the parent way. \\ See also the functions `degree_to_radians`, `cardinal_to_radians`. \\Since version 18678 function parent_way_angle() is an alternativ to way: e.g. {{{ way > node[...]::layer_x { ... icon-rotation: parent_way_angle(); ... } }}}  ||  -  ||
     1048|| `icon-position` || Define the position of the icon for areas. Same as `text-position` (since r11730). || `center`, `inside`, `line` ||  `center`  ||
     1049|| `symbol-shape` || Display a symbol at the position of the node || `square`, `circle`, `triangle`, `pentagon`, `hexagon`, `heptagon`, `octagon`, `nonagon`, `decagon` ||  -  ||
     1050|| `symbol-size` || Size of the symbol || ''Number'', can be relative ("+4") ||  10  ||
     1051|| `symbol-stroke-width` || outline stroke width || ''Width'' || 1.0 if `symbol-stroke-color` is set ||
     1052|| `symbol-stroke-color` || line color || ''Color'' || `#FFC800` if `symbol-stroke-width` is set ||
     1053|| `symbol-stroke-opacity` || line opacity || ''Opacity'' ||  1.0  ||
     1054|| `symbol-fill-color` || fill color for the shape || ''Color'' || `blue`, unless either `symbol-stroke-width` or `symbol-stroke-color` is set ||
     1055|| `symbol-fill-opacity` || fill opacity || ''Opacity'' ||  1.0  ||
     1056|| `text-...`, `font-...` ||||||  see general '''Text & Font properties''' ||
     1057
     1058Do not rely on the default values for `symbol-...` properties (except for `opacity`). They are intended for "quick & dirty" style sheets and should be set to an explicit value.
     1059
     1060=== Line styles ===#LineStyles
    9831061||=  '''Key''' =||= '''Description''' =||= '''Value Format''' =||= '''Default Value''' =||
    984 || {{{width}}} || Line width || ''Width'' ||  -  ||
    985 || {{{color}}} || Line color || ''Color'' ||  value of {{{fill-color}}} or (if unset) JOSM's default untagged color ({{{#808080}}}) ||
    986 || {{{opacity}}} || How transparent the line is. || ''Opacity'' ||  1.0  ||
    987 || {{{dashes}}} || An array of alternating on/off lengths || list of numbers, e.g. [[br]]> 15, 5 [[br]][[br]]may be written as expression: [[br]] > {{{list(3, 4, 5, 6)}}} [[br]][[br]]or the keyword {{{none}}}[[br]]to turn dashes off ||  -  ||
    988 || {{{dashes-offset}}} || shift the dash pattern by a certain amount || ''Number'' (>= 0) ||  0  ||
    989 || {{{dashes-background-color}}} || The color to use in between the dashes (optional) || ''Color'' ||  -  ||
    990 || {{{dashes-background-opacity}}} || Opacity value for the dashes background || ''Opacity'' ||  value of {{{opacity}}}  ||
    991 || {{{linecap}}} || Shape at the end of the line (see [https://www.w3.org/TR/SVG/painting.html#StrokeLinecapProperty here]) || {{{none}}}, {{{round}}}, {{{square}}} ||  {{{none}}}  ||
    992 || {{{linejoin}}} || Shape at the line corners || {{{round}}}, {{{miter}}}, {{{bevel}}} ||  {{{round}}}  ||
    993 || {{{miterlimit}}}                                   || Applies for {{{linejoin: miter}}}. Sets the maximum overshoot when line segments meet at a very small angle || ''Number'' (>= 1.0) ||  10.0  ||
    994 || {{{offset}}} || Move line to the left or right (when looking in way direction). This could be used to draw multiple lanes for one way or mark left and right side of a way differently. || ''Number'' (positive value moves line to the left, negative to the right) ||  0  ||
    995 || {{{text-position}}} || set to {{{line}}}, if text should be drawn along the line || {{{line}}}, {{{center}}} ||  -  ||
    996 || {{{text-...}}}, {{{font-...}}} ||||||  general text & font properties  ||
    997 || `repeat-image` || repeated image along a line ''[since 5801]'' || ''Image'' ||  -  ||
    998 || `repeat-image-width` || Width of the image (optional, see `icon-width`) ''[since 5811]'' || ''Number'' ||  -  ||
    999 || `repeat-image-height` || Height of the image (optional) ''[since 5811]'' || ''Number'' ||  -  ||
    1000 || `repeat-image-align` || Alignment of the image. Top-, bottom edge or the (horizontal) center line of the image will be along the line ''[since 5801]'' || `top`, `center`, `bottom` ||  `center`  ||
    1001 || `repeat-image-offset` || Offset from the line ''[since 5801]'' || ''Number'' ||  0  ||
    1002 || `repeat-image-spacing` || Spacing between repeated images ''[since 5801]'' || ''Number'' ||  0  ||
    1003 || `repeat-image-phase` || Initial spacing at the beginning of the line ''[since 5812]'' || ''Number'' ||  0  ||
    1004 
    1005 All these properties (except for {{{text-...}}} and {{{font-...}}}) exist also with the {{{casing-}}} prefix. The casing is a second independent line element, that is drawn below the normal line and can be used to draw a thin frame around the line in another color.
     1062|| `width` || Line width || ''Width'' ||  -  ||
     1063|| `color` || Line color || ''Color'' ||  value of `fill-color` or\\(if unset) JOSM's default \\untagged color (`#808080`) ||
     1064|| `opacity` || How transparent the line is. || ''Opacity'' ||  1.0  ||
     1065|| `dashes` || An array of alternating on/off lengths || list of numbers, e.g. \\> 15, 5 \\ \\may be written as expression: \\ > `list(3, 4, 5, 6)` \\ \\or the keyword `none` \\to turn dashes off ||  -  ||
     1066|| `dashes-offset` || shift the dash pattern by a certain amount || ''Number'' (>= 0) ||  0  ||
     1067|| `dashes-background-color` || The color to use in between the dashes (optional) || ''Color'' ||  -  ||
     1068|| `dashes-background-opacity` || Opacity value for the dashes background || ''Opacity'' ||  value of `opacity`  ||
     1069|| `linecap` || Shape at the end of the line (see [https://www.w3.org/TR/SVG/painting.html#StrokeLinecapProperty here]) || `none`, `round`, `square` ||  `none`  ||
     1070|| `linejoin` || Shape at the line corners || `round`, `miter`, `bevel` ||  `round`  ||
     1071|| `miterlimit` || Applies for `linejoin: miter`. \\Sets the maximum overshoot when line segments meet at a very small angle || ''Number'' (>= 1.0) ||  10.0  ||
     1072|| `offset` || Move line to the left or right (when looking in way direction). \\This could be used to draw multiple lanes for one way or mark left and right side of a way differently. || ''Number'' (positive value moves line to the left,\\negative to the right) ||  0  ||
     1073|| `text-position` || set to `line`, if text should be drawn along the line || `line`, `center` ||  -  ||
     1074|| `text-...`,\\`font-...` |||||| see general '''Text & Font properties  ||
     1075|| `repeat-image` || repeated image along a line ''(since r5801)'' || ''Image'' ||  -  ||
     1076|| `repeat-image-width` || Width of the image (optional, see `icon-width`) ''(since r5811)'' || ''Number'' ||  -  ||
     1077|| `repeat-image-height` || Height of the image (optional) ''(since r5811)'' || ''Number'' ||  -  ||
     1078|| `repeat-image-align` || Alignment of the image.\\Top-, bottom edge or the (horizontal) center line of the image will be along the line ''(since r5801)'' || `top`, `center`, `bottom` ||  `center`  ||
     1079|| `repeat-image-offset` || Offset from the line ''(since r5801)'' || ''Number'' ||  0  ||
     1080|| `repeat-image-spacing` || Spacing between repeated images ''(since r5801)'' || ''Number'' ||  0  ||
     1081|| `repeat-image-phase` || Initial spacing at the beginning of the line ''(since r5812)'' || ''Number'' ||  0  ||
     1082|| `repeat-image-opacity` || Opacity of the repeated image ''(since r16700)'' || ''Number'' ||  1.0  ||
     1083
     1084All these properties (except for `text-...` and `font-...`) exist also with the `casing-` prefix. The casing is a second independent line element, that is drawn below the normal line and can be used to draw a thin frame around the line in another color.
    10061085||=  '''Key''' =||= '''Description''' =||= '''Value Format''' =||= '''Default Value''' =||
    1007 || {{{casing-width}}}              || Width of the border on both sides of the main line. In JOSM < 5214: Total width of the casing || ''Width'' (revers to {{{width}}} if relative width is specified) ||  -  ||
    1008 || {{{casing-color}}} || Casing color || ''Color'' ||  value of {{{fill-color}}} or (if unset) JOSM's default untagged color ({{{#808080}}}) ||
    1009 || {{{casing-opacity}}} || How transparent the casing is. || ''Opacity'' ||  1.0  ||
    1010 || {{{casing-}}}... || ... || ... ||  ...  ||
    1011 Similar to {{{casing-}}}, there is also the {{{left-casing-}}} and {{{right-casing-}}} prefix. It draws additional lines to the left and to the right of the main line.
    1012 
    1013 === Area styles ===
    1014 ||=  '''Key''' =||= '''Description''' =||= '''Value Format''' =||= '''Default Value''' =||
    1015 || {{{fill-color}}} || Color in which to fill the area. Until 11700, the alpha component was set to 50 to create a transparency effect. || ''Color'' ||  -  ||
    1016 || {{{fill-image}}} || Image pattern || ''Image'' ||  -  ||
    1017 || {{{fill-extent}}} || Set this property, to draw only the outline of the area. The number specifies, how far to fill from the border of the area towards the center. (If unset, the area will be filled completely) ''[since 9008]'' || ''Number'' ||  -  ||
    1018 || {{{fill-opacity}}} || How transparent the fill is; applies to both color and image || ''Opacity'' || 0.2 ''[since 11700, 1.0 before that]'' (can be changed with the {{{mappaint.fillalpha}}} and {{{mappaint.fill-image-alpha}}} preferences)  ||
    1019 || {{{text-position}}} || set to {{{center}}}, if text should be drawn in the center of the area. Set to {{{inside}}} to place the text completely inside the area (since r11722). || {{{line}}}, {{{center}}}, {{{inside}}} ||  -  ||
    1020 || {{{text-...}}}, {{{font-...}}} ||||||  general text & font properties  ||
    1021 Required properties to create an Area style: {{{fill-color}}} or {{{fill-image}}}
    1022 
     1086|| `casing-width` || Width of the border on both sides of the main line. \\In JOSM < 5214: Total width of the casing || ''Width'' (revers to `width` if relative width is specified) ||  -  ||
     1087|| `casing-color` || Casing color || ''Color'' ||  value of `fill-color` or (if unset) \\JOSM's default untagged color (`#808080`) ||
     1088|| `casing-opacity` || How transparent the casing is. || ''Opacity'' ||  1.0  ||
     1089|| `casing-`... || ... || ... ||  ...  ||
     1090Similar to `casing-`, there is also the `left-casing-` and `right-casing-` prefix. It draws additional lines to the left and to the right of the main line.
     1091
     1092=== Area styles ===#AreaStyles
     1093||= '''Key''' =||= '''Description''' =||= '''Value Format''' =||= '''Default Value''' =||
     1094|| `fill-color` || Color in which to fill the area. Until 11700, the alpha component was set to 50 to create a transparency effect. || ''Color'' ||  -  ||
     1095|| `fill-image` || Image pattern || ''Image'' ||  -  ||
     1096|| `fill-extent` || Set this property, to draw only the outline of the area. The number specifies, how far to fill from the border of the area towards the center. (If unset, the area will be filled completely) ''(since r9008)'' || ''Number'' ||  -  ||
     1097|| `fill-extent-threshold` || Set this property, to draw full area when the given percentage of coverage is reached. Can be greater than 100% as the covered area is estimated as **perimeter * extent**. || ''Number'' ||  -  ||
     1098|| `fill-opacity` || How transparent the fill is; applies to both color and image || ''Opacity'' || 0.2 ''(since r11700, 1.0 before that)'' \\(can be changed with the `mappaint.fillalpha` and \\`mappaint.fill-image-alpha` preferences)  ||
     1099|| `text-position` || set to `center`, if text should be drawn in the center of the area. Set to `inside` to place the text completely inside the area. ''(since r11722)'' || `line`, `center`, `inside` ||  -  ||
     1100|| `text-...`, `font-...` ||||||  see general text & font properties  ||
     1101Required properties to create an Area style: `fill-color` or `fill-image`
    10231102
    10241103=== Text & Font properties ===
    1025 {{{#!th align=left valign=top
     1104{{{#!th valign=top
    10261105'''Key'''
    10271106}}}
    1028 {{{#!th align=left valign=top
     1107{{{#!th valign=top
    10291108'''Description'''
    10301109}}}
    1031 {{{#!th align=left valign=top
     1110{{{#!th valign=top
    10321111'''Value Format'''
    10331112}}}
    1034 {{{#!th align=left valign=top
     1113{{{#!th valign=top
    10351114'''Default Value'''
    10361115}}}
    10371116|-------------------------------------------------------------------------------
    10381117{{{#!td align=left  valign=top
    1039 {{{text}}}  
     1118`text` 
    10401119}}}
    10411120{{{#!td align=left  valign=top
    1042 How to find the label text. No label is displayed, unless this instruction is present.
     1121How to find the label text.\\No label is displayed, unless this instruction is present.
    10431122}}}
    10441123{{{#!td align=left  valign=top
    1045 {{{auto}}}
    1046    Derive the text automatically. The default name tags are: "{{{name:}}}"+''<LANG>'', "{{{name}}}", "{{{int_name}}}", "{{{ref}}}", "{{{operator}}}", "{{{brand}}}" and "{{{addr:housenumber}}}".
    1047 
    1048    Configure a list of tag names in the preference "{{{mappaint.nameOrder}}}" in order to change this list. (After changing the list, a restart of JOSM is required.)
     1124`auto`
     1125  Derive the text automatically. The default name tags are: "`name:`"+''<LANG>'', \\"`name`", "`int_name`", "`ref`", "`operator`", "`brand`" and "`addr:housenumber`".
     1126
     1127  Configure a list of tag names in the preference "`mappaint.nameOrder`" in order \\ to change this list. (After changing the list, a restart of JOSM is required.)
    10491128
    10501129''String''
    1051    Denotes the key of the tag whose value is used as text.
     1130  Denotes the key of the tag whose value is used as text.
    10521131
    10531132''Expressions''
    10541133  You can enter an expression to compute the text to be displayed. Examples:
    1055   * {{{eval("this is a static text")}}} - renderes a static text
    1056   * {{{eval(concat(tag("first"), "-", tag("second")))}}} - displays the concatenated tags "first" and "second"
    1057 
    1058 {{{""}}}
     1134  * `eval("this is a static text")` - renderes a static text
     1135  * `eval(concat(tag("first"), "-", tag("second")))` - displays \\ the concatenated tags "first" and "second"
     1136
     1137`""`
    10591138   To delete a previous set text.
    10601139}}}
    … …  
    10631142}}}
    10641143|-------------------------------------------------------------------------------
    1065 || {{{text-color}}} || the text color || ''Color'' ||  {{{white}}} for lines and nodes, {{{#c0c0c0}}} for areas (JOSM "{{{text}}}" and "{{{areatext}}}" color preferences) ||
    1066 || {{{text-opacity}}} || how transparent the text is || ''Opacity'' ||  1.0  ||
    1067 || {{{text-offset-x}}} || shift the text horizontally, (not supported for text along line) || ''Number'' ||  0  ||
    1068 || {{{text-offset-y}}} (can also be written as {{{text-offset}}})  || shift the text vertically, positive values shift the text in upwards direction  || ''Number'' ||  0  ||
    1069 || {{{text-halo-radius}}} || size of text background border (to make text visible on background with a similar color) || ''Number'' ||  -  ||
    1070 || {{{text-halo-color}}} || color of the text halo || ''Color'' ||  complement of the text color  ||
    1071 || {{{text-halo-opacity}}} || transparency for the text halo || ''Opacity'' ||  1.0  ||
    1072 || {{{font-family}}} || font family || ''String'' ||  "Helvetica"[[br]](JOSM preference "mappaint.font")  ||
    1073 || {{{font-size}}} || font size || ''Number'' ||  8[[br]](JOSM preference "mappaint.fontsize")  ||
    1074 || {{{font-weight}}} || bold or not || {{{bold}}}, {{{normal}}} ||  {{{normal}}}  ||
    1075 || {{{font-style}}} || italic or not || {{{italic}}}, {{{normal}}} ||  {{{normal}}}  ||
     1144|| `text-color` || the text color || ''Color'' ||  `white` for lines and nodes,\\`#c0c0c0` for areas \\(JOSM "`text`" and "`areatext`"\\color preferences) ||
     1145|| `text-opacity` || how transparent the text is || ''Opacity'' ||  1.0  ||
     1146|| `text-offset-x` || shift the text horizontally, \\(not supported for text along line) || ''Number'' ||  0  ||
     1147|| `text-offset-y`\\(can also be written as\\`text-offset`)  || shift the text vertically, positive values shift the text in upwards direction  || ''Number'' ||  0  ||
     1148|| `text-halo-radius` || size of text background border \\(to make text visible on background \\with a similar color) || ''Number'' ||  -  ||
     1149|| `text-halo-color` || color of the text halo || ''Color'' ||  complement of the text color  ||
     1150|| `text-halo-opacity` || transparency for the text halo || ''Opacity'' ||  1.0  ||
     1151|| `text-anchor-horizontal` || horizontal text label placement || `left`, `center`, `right` ||  `right`  ||
     1152|| `text-anchor-vertical` || vertical text label placement || `above`, `top`, `center`, `bottom`, `below` ||  `bottom`  ||
     1153|| `text-rotation` || Rotate the text clockwise or anti clockwise (negative value)\\(since r16253) || `[rad]`, `[rad]rad`, `[deg]°`, `[deg]deg`, `[grad]grad`, `[turn]turn` \\([https://developer.mozilla.org/en/docs/Web/CSS/angle definition]) or a cardinal direction (e.g. `northeast` or `sw`); \\ or `way` to rotate the text in the direction of the parent way. \\See also the functions `degree_to_radians`, `cardinal_to_radians`. \\Since version 18678 function parent_way_angle() is an alternativ to way: e.g. {{{ way > node[...]::layer_x { ... text-rotation: parent_way_angle(); ... } }}} \\(Note that the direction means where the upper edge of the text faces.\\That means with the default direction of north the text flows to east\\(with a left to right language). \\So if you want to flow it to e.g. south you need to set east.) ||  -  ||
     1154|| `text-position` |||||| see [#AreaStyles Area styles] and [#LineStyles Line styles] ||
     1155|| `font-family` || font family || ''String'' ||  "Droid Sans" \\(JOSM preference "`mappaint.font`")  ||
     1156|| `font-size` || font size || ''Number'' ||  8 \\(JOSM preference "`mappaint.fontsize`")  ||
     1157|| `font-weight` || bold or not || `bold`, `normal` ||  `normal`  ||
     1158|| `font-style` || italic or not || `italic`, `normal` ||  `normal`  ||
    10761159
    10771160=== User defined properties ===
    1078 * In [wikitr:/Styles Mappaint styles] you can define any custom propety, e.g.: `crc: CRC32_checksum(tag(name))/429496.7296;`
     1161* In [wikitr:/Styles Mappaint styles] you can define any custom property, e.g.: `crc: CRC32_checksum(tag(name))/429496.7296;`
    10791162* In [wikitr:/Rules Validator rules] they must be prefixed by a `-`, e.g.: `-osmoseItemClassLevel: "1210/1/1";`
    10801163
    1081 === Property values explanations ===
     1164=== Property values explanations === #Propertyvaluesexplanations
    10821165'' '''Width''' ''
    10831166 - 14.0 (any positive number)
    1084  - {{{default}}} (use JOSM's default line width, which is 2, but can be configured)
    1085  - {{{thinnest}}} (draws the line as thin as possible)
    1086  - +3 (with plus sign in front) adds the amount to the width on the default layer. This applies only for styles that are not on the default layer, e.g. highlights. Another way to write this would be {{{prop("width","default")+3}}}. For {{{casing-width}}}, this refers to the {{{width}}} value on the same layer.
     1167 - `default` (use JOSM's default line width, which is 2, but can be configured)
     1168 - `thinnest` (draws the line as thin as possible)
     1169 - +3 (with plus sign in front) adds the amount to the width on the default layer. This applies only for styles that are not on the default layer, e.g. highlights. Another way to write this would be `prop("width","default")+3`. For `casing-width`, this refers to the `width` value on the same layer.
    10871170
    10881171'' '''Image''' ''
    1089  See [wiki:Help/Styles/Images].
     1172 See [wikitr:/Help/Styles/Images].
    10901173
    10911174'' '''Color''' ''
    10921175 * named color as found in [https://www.w3.org/TR/css3-color/#svg-color this] list
    1093  * html style: '''{{{#RRGGBB}}}''', '''{{{#RGB}}}''', '''{{{#RRGGBBAA}}}'''
    1094  * '''{{{rgb(/*r*/, /*g*/, /*b*/)}}}''' - rgb value with arguments from 0.0 to 1.0
    1095  * '''{{{rgba(/*r*/, /*g*/, /*b*/, /*alpha*/)}}}''' - rgb value with alpha
    1096  * '''{{{hsb_color(/*hue*/, /*saturation*/, /*brightness*/)}}}''' - color from HSB color space
     1176 * html style: '''`#RRGGBB`''', '''`#RGB`''', '''`#RRGGBBAA`'''
     1177 * '''`rgb(/*r*/, /*g*/, /*b*/)`''' - rgb value with arguments from 0.0 to 1.0
     1178 * '''`rgba(/*r*/, /*g*/, /*b*/, /*alpha*/)`''' - rgb value with alpha
     1179 * '''`hsb_color(/*hue*/, /*saturation*/, /*brightness*/)`''' - color from HSB color space
     1180 * if the color is prefixed with a name and #, e.g. `color: highway_track#6e541c;` it will appear in the [wikitr:/Help/Preferences/ColorPreference Color Preference] and end users can adjust the color there themself
    10971181
    10981182'' '''Opacity''' ''
    … …  
    11001184
    11011185'' '''String''' ''
    1102  * any character sequence, in quotes, e.g. {{{"images/fill.png"}}}. If the string is an identifier, quotes are optional. (Quote and backslash sign can be escaped.)
     1186 * any character sequence, in quotes, e.g. `"images/fill.png"`. If the string is an identifier, quotes are optional. (Quote and backslash sign can be escaped.)
    11031187
    11041188'' '''Number''' ''
    … …  
    11061190 * has a special meaning if you put a "+" sign in front (relative width)
    11071191
    1108 == Eval expressions ==
    1109 
    1110 
    1111 See [/doc/org/openstreetmap/josm/gui/mappaint/mapcss/ExpressionFactory.Functions.html#method_summary Javadoc of Functions] for the up-to-date list of functions supported by JOSM's MapCSS implementation.
     1192
     1193== Eval expressions ==#Evalexpressions
     1194See [/doc/org/openstreetmap/josm/gui/mappaint/mapcss/Functions.html#method_summary Javadoc of Functions] for the up-to-date list of functions supported by JOSM's MapCSS implementation.
    11121195
    11131196 +, -, *, /::
    … …  
    11151198 ||, &&, !::
    11161199  boolean operations
    1117  <, >, <=, >=, ==::
     1200 <, >, <=, >=, ==, !=::
    11181201  comparison operators
    1119  asin, atan, atan2, ceil, cos, cosh, exp, floor, log, max, min, random, round, signum, sin, sinh, sqrt, tan, tanh::
    1120   the usual meaning, [https://download.oracle.com/javase/8/docs/api/java/lang/Math.html details]
     1202 asin, atan, atan2, ceil, cos, cosh, exp, floor, log, max, min, mod (since r17759), random, round, signum, sin, sinh, sqrt, tan, tanh::
     1203  the usual meaning, [https://docs.oracle.com/en/java/javase/11/docs/api/java.base/java/lang/Math.html details]
    11211204 cond(b, fst, snd)::
    11221205 b ? fst : snd::
    11231206  if ('''b''') then '''fst''' else '''snd'''
    11241207 list(a, b, ...)::
    1125   create list of values, e.g. for the {{{dashes}}} property
     1208  create list of values, e.g. for the `dashes` property
    11261209 get(lst, n)::
    1127   get the ''n''th element of the list ''lst'' (counting starts at 0) [''since 5699'']
     1210  get the ''n''th element of the list ''lst'' (counting starts at 0) [''since r5699'']
    11281211 split(sep, str)::
    1129   splits string ''str'' at occurrences of the separator string ''sep'', returns a list [''since 5699'']
     1212  splits string ''str'' at occurrences of the separator string ''sep'', returns a list [''since r5699'']
    11301213 prop(''p_name'')::
    1131   value of the property ''p_name'' of the current layer, e.g. prop({{{"width"}}})
     1214  value of the property ''p_name'' of the current layer, e.g. prop(`"width"`)
    11321215 prop(''p_name'', ''layer_name'')::
    11331216  property from the layer ''layer_name''
    … …  
    11411224  get the value of the key ''key_name'' from the object's parent
    11421225 parent_tags(''key_name'')::
    1143   returns all parent's values for the key ''key_name'' as a list ordered by a natural ordering [''since 8775'']
     1226  returns all parent's values for the key ''key_name'' as a list ordered by a natural ordering [''since r8775'']
    11441227 has_tag_key(''key_name'')::
    11451228  true, if the object has a tag with the given key
    … …  
    11471230  create color value (arguments from 0.0 to 1.0)
    11481231 hsb_color(''h'', ''s'', ''b'')::
    1149   create color from hue, saturation and brightness (arguments from 0.0 to 1.0) [''since 6899'']
     1232  create color from hue, saturation and brightness (arguments from 0.0 to 1.0) [''since r6899'']
    11501233 red(''clr''), green(''clr''), blue(''clr'')::
    11511234  get value of color channels in rgb color model
    11521235 alpha(''clr'')::
    1153   get the alpha value of the given color [''since 6749'']
     1236  get the alpha value of the given color [''since r6749'']
    11541237 length(''str'')::
    11551238  length of a string
    11561239 count(''lst'')::
    1157   length of a list, i.e., counts its elements [''since 7162'']
     1240  length of a list, i.e., counts its elements [''since r7162'']
    11581241 length(''lst'')::
    1159   length of a list [''since 5699''] – deprecated ''since 7162''
     1242  length of a list ([''since r5699''] – deprecated ''since r7162''
    11601243 any(obj1, obj2, ...)::
    1161   returns the first object which is not null (formerly coalesce, [''since 7164''])
     1244  returns the first object which is not null (formerly coalesce, [''since r7164''])
    11621245 concat(''str1'', ''str2'', ...)::
    11631246  assemble the strings to one
    11641247 join(''sep'', ''str1'', ''str2'', ...)::
    1165   join strings, whith ''sep'' as separator [''since 6737'']
     1248  join strings, with ''sep'' as separator [''since r6737'']
    11661249 join_list(''sep'', ''list_name'')::
    1167    joins the elements of the list ''list_name'' to one string separated by the separator ''sep'' [''since 8775'']
     1250   joins the elements of the list ''list_name'' to one string separated by the separator ''sep'' [''since r8775'']
    11681251 upper(''str'')::
    1169    converts string to upper case [''since 11756'']
     1252   converts string to upper case [''since r11756'']
    11701253 lower(''str'')::
    1171    converts string to lower case [''since 11756'']
     1254   converts string to lower case [''since r11756'']
     1255 title(''str'')::
     1256   converts string to title case [''since r17613''] (`"i am FINE"` → `"I Am Fine"`)
    11721257 trim(''str'')::
    1173    remove leading and trailing whitespace from string [''since 11756'']
     1258   remove leading and trailing whitespace from string [''since r11756'']
     1259 trim_list(''list_name'')::
     1260   remove leading and trailing whitespace from a list of strings, will remove entries that are empty afterwards [''since r15591'']
    11741261 JOSM_search("...")::
    11751262  true, if JOSM search applies to the object
    11761263 tr(str, arg0, arg1, ...)::
    1177   translate from English to the current language (only for strings in the JOSM user interface) [''since 6506'']
     1264  translate from English to the current language (only for strings in the JOSM user interface) [''since r6506'']
    11781265 regexp_test(regexp, string)::
    1179   test if ''string'' matches pattern ''regexp'' [''since 5699'']
     1266  test if ''string'' matches pattern ''regexp'' [''since r5699'']
    11801267 regexp_test(regexp, string, flags)::
    1181   test if ''string'' matches pattern ''regexp''; flags is a string that may contain "i" (case insensitive), "m" (multiline) and "s" ("dot all") [''since 5699'']
     1268  test if ''string'' matches pattern ''regexp''; flags is a string that may contain "i" (case insensitive), "m" (multiline) and "s" ("dot all") [''since r5699'']
    11821269 regexp_match(regexp, string)::
    1183   Tries to match ''string'' against pattern ''regexp''. Returns a list of capture groups in case of success. The first element (index 0) is the complete match (i.e. ''string''). Further elements correspond to the bracketed parts of the regular expression. [''since 5701'']
     1270  Tries to match ''string'' against pattern ''regexp''. Returns a list of capture groups in case of success. The first element (index 0) is the complete match (i.e. ''string''). Further elements correspond to the bracketed parts of the regular expression. [''since r5701'']
    11841271 regexp_match(regexp, string, flags)::
    1185   Tries to match ''string'' against pattern ''regexp''. Returns a list of capture groups in case of success. The first element (index 0) is the complete match (i.e. ''string''). Further elements correspond to the bracketed parts of the regular expression. Flags is a string that may contain "i" (case insensitive), "m" (multiline) and "s" ("dot all") [''since 5701'']
     1272  Tries to match ''string'' against pattern ''regexp''. Returns a list of capture groups in case of success. The first element (index 0) is the complete match (i.e. ''string''). Further elements correspond to the bracketed parts of the regular expression. Flags is a string that may contain "i" (case insensitive), "m" (multiline) and "s" ("dot all") [''since r5701'']
    11861273 substring(str, idx)::
    1187   return the substring of ''str'', starting at index ''idx'' (0-indexed) [''since 6534'']
     1274  return the substring of ''str'', starting at index ''idx'' (0-indexed) [''since r6534'']
    11881275 substring(str, start, end)::
    1189   return the substring of ''str'', starting at index ''start'' (inclusive) up to ''end'' (exclusive) (0-indexed) [''since 6534'']
     1276  return the substring of ''str'', starting at index ''start'' (inclusive) up to ''end'' (exclusive) (0-indexed) [''since r6534''], a negative end index counts from the string end [''since r19259'']
    11901277 replace(string, old, new)::
    11911278   Replaces any occurrence of the substring ''old'' within the string ''string'' with the text ''new''
    11921279 osm_id()::
    1193   returns the OSM id of the current object [''since 5699'']
     1280  returns the OSM id of the current object [''since r5699'']
     1281 osm_user_name()::
     1282  returns the OSM user name who last touched the current object [''since r15246'']
     1283 osm_user_id()::
     1284  returns the OSM user id who last touched the current object [''since r15246'']
     1285 osm_version()::
     1286  returns the OSM version number of the current object [''since r15246'']
     1287 osm_changeset_id()::
     1288  returns the id of the changeset the current object was last uploaded to [''since r15246'']
     1289 osm_timestamp()::
     1290  returns the time of last modification to the current object, as timestamp [''since r15246'']
    11941291 parent_osm_id()::
    1195   returns the OSM id of the object's parent (matched by child selector) [''since 13094'']
     1292  returns the OSM id of the object's parent (matched by child selector) [''since r13094'']
    11961293 URL_encode(str)::
    1197   [https://en.wikipedia.org/wiki/Percent-encoding percent-encode] a string. May be useful for data URLs [''since 6805'']
     1294  [https://en.wikipedia.org/wiki/Percent-encoding percent-encode] a string. May be useful for data URLs [''since r6805'']
    11981295 URL_decode(str)::
    1199   [https://en.wikipedia.org/wiki/Percent-encoding percent-decode] a string. [''since 11756'']
     1296  [https://en.wikipedia.org/wiki/Percent-encoding percent-decode] a string. [''since r11756'']
    12001297 XML_encode(str)::
    1201   escape special characters in xml. E.g. {{{<}}} becomes {{{&lt;}}}, other special characters: {{{>}}}, {{{"}}}, {{{'}}}, {{{&}}}, {{{\n}}}, {{{\t}}} and {{{\r}}} [''since 6809'']
     1298  escape special characters in xml. E.g. `<` becomes `&lt;`, other special characters: `>`, `"`, `'`, `&`, `\n`, `\t` and `\r` [''since r6809'']
    12021299 CRC32_checksum(''str'')::
    1203   calculate the CRC32 checksum of a string (result is an integer from 0 to 2^32^-1) [''since 6908'']
     1300  calculate the CRC32 checksum of a string (result is an integer from 0 to 2^32^-1) [''since r6908'']
     1301 siunit_length(''str'')::
     1302   convert length units to meter (fault tolerant, ignoring white space) [''since r19089'']
    12041303 is_right_hand_traffic()::
    1205   Check if there is left-hand or right-hand traffic at the current location. [''since 7193'']
     1304  Check if there is left-hand or right-hand traffic at the current location. [''since r7193'']
    12061305 number_of_tags()::
    1207   returns the number of tags for the current OSM object [''since 7237'']
     1306  returns the number of tags for the current OSM object [''since r7237'']
    12081307 print(o)::
    1209   prints a string representation of `o` to the command line (for debugging) [''since 7237'']
     1308  prints a string representation of `o` to the command line (for debugging) [''since r7237'']
    12101309 println(o)::
    1211   prints a string representation of `o` to the command line, followed by a new line (for debugging) [''since 7237'']
     1310  prints a string representation of `o` to the command line, followed by a new line (for debugging) [''since r7237'']
    12121311 JOSM_pref(''key'', ''default'')::
    1213   Get value from the JOSM advanced preferences. This way you can offer certain options to the user and make the style customizable. It works with strings, numbers, colors and boolean values. [[br]][This function exists since version 3856, but with some restrictions. `JOSM_pref` always returns a string, but in version 7237 and earlier, the automatic conversion of string to boolean and color was not working. You can use the following workarounds for boolean values and color in version 7237 and earlier: `cond(JOSM_pref("myprefkey", "true")="true", "X", "O")` and `html2color(JOSM_pref("mycolor", "#FF345611"))`. These explicit conversions should be no longer necessary in version 7238 and later. Automatic conversion to a number works in any version.]
     1312  Get value from the JOSM advanced preferences. This way you can offer certain options to the user and make the style customizable. It works with strings, numbers, colors and boolean values. \\[This function exists since version r3856, but with some restrictions. `JOSM_pref` always returns a string, but in version r7237 and earlier, the automatic conversion of string to boolean and color was not working. You can use the following workarounds for boolean values and color in version r7237 and earlier: `cond(JOSM_pref("myprefkey", "true")="true", "X", "O")` and `html2color(JOSM_pref("mycolor", "#FF345611"))`. These explicit conversions should be no longer necessary in version r7238 and later. Automatic conversion to a number works in any version. Furthermore, in version r16590, can be used to set color properties. So `* { set_color: JOSM_pref("pref", #000000); }` will create a color property now.]
    12141313 setting()::
    1215   to use a [[Help/Styles/MapCSSImplementation#Stylesettings|style setting]] [''since 7450'']
     1314  to use a [wikitr:/Help/Styles/MapCSSImplementation#Stylesettings style setting] [''since r7450'']
    12161315 degree_to_radians()::
    1217   returns a in degree given direction in radians [''since 8260'']
     1316  returns a in degree given direction in radians [''since r8260'']
    12181317 cardinal_to_radians()::
    1219   returns a cardinal direction in radians [''since 8260'']
     1318  returns a cardinal direction in radians [''since r8260'']
    12201319 waylength()::
    1221   returns the length of the way in metres [''since 8253'']
     1320  returns the length of the way in metres [''since r8253'']
    12221321 areasize()::
    1223   returns the area of a closed way in square meters [''since 8253'']
     1322  returns the area of a closed way in square meters [''since r8253'']
    12241323 at(lat,lon)::
    1225   returns true if the object centroid lies at given ''lat''/''lon'' coordinates, e.g. to check for nodes at "null island" `node[at(0.0,0.0)]` [''since 12514'']
     1324  returns true if the object centroid lies at given ''lat''/''lon'' coordinates, e.g. to check for nodes at "null island" `node[at(0.0,0.0)]` [''since r12514'']
    12261325 is_similar(''str1'', ''str2'')::
    1227   returns true if the two strings are similar, but not identical, i.e., have a Levenshtein distance of 1 or 2. Example: {{{way[highway][name][is_similar(tag(name), "Main Street")]}}} checks for streets with a possible typo in the name (e.g. Main Streeg). [''since 14371'']
     1326  returns true if the two strings are similar, but not identical, i.e., have a Levenshtein distance of 1 or 2. Example: `way[highway][name][is_similar(tag(name), "Main Street")]` checks for streets with a possible typo in the name (e.g. Main Streeg). [''since r14371'']
    12281327 gpx_distance()::
    1229   returns the lowest distance between the OSM object and a GPX point [''since 14802'']
     1328  returns the lowest distance between the OSM object and a GPX point [''since r14802'']
     1329 count_roles()::
     1330  returns the number of primitives in a relation with the specified roles [''since r15275'']
     1331 sort(''str1'', ''str2'', ''str3'', ''...'')::
     1332  sorts an array of strings [''since r15279'']
     1333 sort_list(''list_name'')::
     1334  sorts a list of strings [''since r15279'']
     1335 tag_regex(''regex'')::
     1336  returns a list containing the values of keys that match the regex [''since r15317'']
     1337 to_boolean(''str'')::
     1338  returns the string argument as a boolean [''since r16110'']
     1339 to_byte(''str'')::
     1340  returns the string argument as a byte [''since r16110'']
     1341 to_short(''str'')::
     1342  returns the string argument as a short [''since r16110'']
     1343 to_int(''str'')::
     1344  returns the string argument as a int [''since r16110'']
     1345 to_long(''str'')::
     1346  returns the string argument as a long [''since r16110'']
     1347 to_float(''str'')::
     1348  returns the string argument as a float [''since r16110'']
     1349 to_double(''str'')::
     1350  returns the string argument as a double [''since r16110'']
     1351 uniq(''str1'', ''str2'', ''str3'', ''...'')::
     1352  returns a list of strings that only have unique values from an array of strings [''since r15323'']
     1353 uniq_list(''list_name'')::
     1354  returns a list of strings that only have unique values from a list of strings [''since r15323'']
     1355 parent_way_angle()::
     1356  returns the angle of the parent way as a double in rad [''since r18664''] (see: text-rotation or icon-rotation)
     1357 convert_primitive_to_string(''PrimitiveId'')::
     1358  returns the primitive id as a string [''since r18829'']
     1359 convert_primitives_to_string(''PrimitiveId'', ''PrimitiveId'', ''...'')::
     1360  returns a list of primitive ids converted to strings [''since r18829'']
     1361 parent_osm_primitives(''optional key'', ''optional value'')::
     1362  returns a list of primitive ids which match the key and value (if present) [''since r18829'']
    12301363
    12311364=== Examples ===
    1232 
    12331365* circle symbol for house number with size depending of the number of digits
    12341366{{{
    … …  
    12881420}}}
    12891421
     1422* casing on inside of area
     1423{{{
     1424#!mapcss
     1425area[building]:clockwise {
     1426    right-casing-width: 10;
     1427}
     1428area[building]:anticlockwise {
     1429    left-casing-width: 10;
     1430}
     1431/* or */
     1432area[building][is_clockwise()] {
     1433    right-casing-width: 10;
     1434}
     1435area[building][is_anticlockwise()] {
     1436    left-casing-width: 10;
     1437}
     1438}}}
     1439
     1440* case insensitive selector. This matches: `Name=Main Street`, but also `naMe=MAIN STREET`
     1441{{{
     1442#!mapcss
     1443way[/(?i)^name$/ =~ /(?i)^Main Street$/] {
     1444}
     1445}}}
     1446
    12901447
    12911448== Compatibility notes ==
    12921449=== MapCSS 0.2 ===
    1293 
    12941450==== Grammar ====
    1295 
    1296  * {{{way[oneway=yes]}}} does not have any magic, you can use {{{way[oneway?]}}} instead
    1297  * no {{{@import}}}
    1298  * JOSM does not require {{{eval(...)}}} to be wrapped around expressions, but for compatibility with other MapCSS implementations you should write it out.
     1451 * `way[oneway=yes]` does not have any magic, you can use `way[oneway?]` instead
     1452 * no `@import`
     1453 * JOSM does not require `eval(...)` to be wrapped around expressions, but for compatibility with other MapCSS implementations you should write it out.
    12991454
    13001455==== Properties ====
    13011456At the moment, JOSM does ''not'' support the following properties:
    13021457 line: ::
    1303   {{{image}}}
     1458  `image`
    13041459 label: ::
    1305   {{{font-variant, text-decoration, text-transform, max-width}}}
     1460  `font-variant, text-decoration, text-transform, max-width`
    13061461 shield: ::
    13071462  not supported
    13081463
    13091464=== Halcyon (Potlatch 2) ===
    1310 
    13111465 * Text label is placed in the center of the icon. For compatibility with Halcyon put
    13121466{{{
    … …  
    13161470 at the beginning of your style sheet.
    13171471 * standard z-index in Halcyon is 5, but it is 0 in JOSM
    1318  * '''{{{image: circle;}}}''' corresponds to '''{{{symbol-shape: circle;}}}'''
     1472 * '''`image: circle;`''' corresponds to '''`symbol-shape: circle;`'''
    13191473
    13201474=== Kothic ===
    1321 
    13221475 * Kothic has support for eval, which probably differs from JOSM's eval.
    13231476 * Kothic understands units, whereas JOSM always calculates in pixel.
    1324  * The extrusion features are not available in JOSM
     1477 * The extrusion features are not available in JOSM.
    13251478
    13261479=== Ceyx ===
    1327 
    1328  * seems to have {{{[tunnel=1]}}} instead of {{{[tunnel=yes]}}} (Halcyon) or {{{[tunnel?]}}} (JOSM)
    1329 
    1330 == Media queries [''since 6970'']  (deprecated) ==
     1480 * seems to have `[tunnel=1]` instead of `[tunnel=yes]` (Halcyon) or `[tunnel?]` (JOSM)
     1481
     1482
     1483== Media queries (deprecated) ==
    13311484
    13321485{{{#!td style="background-color: #faa"
    13331486Note: media queries are deprecated. You should use @supports rules instead (see above).
    13341487}}}
    1335 Media queries are used to skip a section of the style under certain conditions. Typically you want to use a feature which is introduced in a newer version of JOSM, but like to have a fall back style for users of older JOSM clients. Example:
     1488Media queries are used to skip a section of the style under certain conditions. Typically you want to use a feature which is introduced in a newer version of JOSM, but like to have a fall back style for users of older JOSM clients. This feature came with r6970. Example:
    13361489{{{
    13371490#!mapcss
    … …  
    13681521}}}
    13691522{{{#!td
    1370 Only include {{{@media}}} section when the current version of JOSM is greater than or equal to the specified number.
     1523Only include `@media` section when the current version of JOSM is greater than or equal to the specified number.
    13711524}}}
    13721525|-
    … …  
    13751528}}}
    13761529{{{#!td
    1377 Only include {{{@media}}} section when the current version of JOSM is lower than or equal to the specified number.
     1530Only include `@media` section when the current version of JOSM is lower than or equal to the specified number.
    13781531}}}
    13791532|-
    … …  
    13821535}}}
    13831536{{{#!td
    1384 Only include {{{@media}}} section when the name of the editor / renderer matches the given string. In JOSM, the only accepted value is {{{josm}}}.
    1385 }}}
    1386 
    1387 Conditions can be combined with {{{and}}}:
     1537Only include `@media` section when the name of the editor / renderer matches the given string. In JOSM, the only accepted value is `josm`.
     1538}}}
     1539
     1540Conditions can be combined with `and`:
    13881541
    13891542{{{
    … …  
    14151568
    14161569{{{#!comment
    1417 There is also the {{{not}}} keyword (see the linked css doc for details).
     1570There is also the `not` keyword (see the linked css doc for details).
    14181571This is implemented, but probably not very useful. Feel free to add documentation.
    14191572}}}