Changes between Initial Version and Version 1 of Nl:Help/Styles/MapCSSImplementation

Timestamp:

2016-02-16T17:50:22+01:00 (10 years ago)

Author:

DiGro

Comment:

translated into Dutch

Nl:Help/Styles/MapCSSImplementation

@@ +1 @@
+[[TranslatedPages(revision=106)]]
+[[PageOutline(1-10,Inhoud)]]
+Deze pagina documenteert details over implementatie van [osmwiki:MapCSS/0.2 MapCSS] in JOSM.
+
+== Algemene structuur ==
+Een MapCSS-stijl heeft regels in de vorm van
+{{{
+#!css
+selector {
+    prop: value;
+    /* ... */
+    prop: value;
+    /* and/or */
+    set: class;
+    set: .class;
+}
+}}}
+Het algoritme om de stijlen voor een bepaald object te zoeken ziet er uit als dit:
+{{{
+ - voor elke regel:
+     als de selector van toepassing is, stel de eigenschappen in vanuit het blok { }
+ - analyseer de uiteindelijk lijst met eigenschappen en genereer daar stijlen uit
+}}}
+
+MapCSS gebruikt de indeling '''comment''' van CSS (`/* ... */`). Onthoud dat bij het niet uitvoerbaar maken van grote delen van een MapCSS-bestand, sommige constructies een onverwacht einde van het niet uitvoerbaar maken kunnen veroorzaken, bijvoorbeeld:
+{{{
+#!css
+/*
+*[highway][name =~ /^R(\.|:)? .*/] { /* het einde van de reguliere expressie definieert het onverwachte einde van het niet uitvoerbaar maken */
+        throwWarning: tr("foo");
+}
+*/
+}}} 
+
+== Selectoren ==
+''Selectoren'' omvatten de filterexpressies van een MapCSS-regel. De regel wordt alleen toegepast op een object op de kaart, als de selector ervan overeenkomt
+met het object.
+
+Selectoren in MapCSS zijn anders dan voor standaard CSS voor het web. MapCSS ondersteunt alleen een subset van de standaard CSS-selectoren, maar
+breidt ze uit met aanvullende selectoren die zijn vereist voor gegevens van OSM.
+
+Enkele basisvoorbeelden:
+{{{
+#!css
+/* toegepast op wegen met een tag highway=residential */
+way[highway=residential] {  /*  de stijlen */}
+
+/* toegepast op nieuwe, gesloten wegen op laag 1, indien die de tags amenity=parking en access=public hebben, en indien 
+ * dat het zoomniveau tussen 11 en 14 ligt 
+ */
+way|z11-14[amenity=parking][access=public]:closed:new::layer_1 {...}
+
+
+area[amenity=parking][access=public], area[amenity=parking][!access] {...}
+relation[type=route][route=foot] > way::relation_underlay {..}
+}}}
+
+
+De verschillende elementen ('''type'''-, '''zoom'''- , '''condition''' selector, '''pseudo classes''', '''layer identifier''', '''grouping''' en '''child combinator''') worden hieronder uitgelegd.
+
+
+=== Type selector ===
+
+{{{#!th align=left valign=top 
+'''Selector'''
+}}}
+{{{#!th align=left valign=top
+'''Beschrijving'''
+}}}
+|-------------------------------------------------------------------------------
+{{{#!td align=left  valign=top
+*
+}}}
+{{{#!td align=left  valign=top    
+Komt overeen met elk object
+}}}
+|-------------------------------------------------------------------------------
+{{{#!td align=left  valign=top
+{{{node}}}, {{{way}}}, {{{relation}}}
+}}}
+{{{#!td align=left  valign=top    
+Komt overeen met objecten van OSM van het opgegeven type.
+}}}
+|-------------------------------------------------------------------------------
+{{{#!td align=left  valign=top
+{{{area}}}
+}}}
+{{{#!td align=left  valign=top    
+Komt overeen met elk gebied, ongeacht of de grens van het gebied slechts is gemodelleerd met één enkele weg of met een set wegen die zijn samengevoegd in een relatie.
+{{{
+#!css
+area[natural=beach] {...} 
+/* ... is gelijk aan ... */
+way[natural=beach], relation[type=multipolygon][natural=beach] {...} 
+}}}
+Onthoud dat {{{area}}} oook niet gesloten wegen selecteert, dus kan het nuttig zijn de pseudoklasse {{{:closed}}} toe te voegen. De Validatie van JOSM zal een waarschuwing geven voor niet gesloten wegen die een stijl voor een gebied hebben.
+}}}
+|-------------------------------------------------------------------------------
+{{{#!td align=left  valign=top
+{{{meta}}}
+}}}
+{{{#!td align=left  valign=top    
+De selector {{{meta}}} start een speciale regel die aan het begin van het bestand zou moeten staan. Het geeft soms algemene informatie over het stijlblad. Alle software die MapCSS ondersteunt zou in staat moeten zijn om deze gedeelten zonder fouten te parsen, gebruik dus geen exotische syntaxis extensies in dit gedeelte.
+{{{
+#!css
+meta {
+    title: "Parking lanes";   /* titel weergegeven in het menu */
+    icon: "images/logo.png";  /* klein pictogram, weergegeven in het menu naast de titel */
+    version: "1.2";           /* de versie van de stijl */
+    description: "...";       /* een of twee zinnen die de stijl beschrijven */
+    author: "...";            /* de auteur(s) van de stijl */
+    link: "http://...";       /* URL naar de webpagina van de stijl */
+    min-josm-version: 6789;   /* de minimale versie van JOSM waarin deze stijl werkt */
+}
+}}}
+}}}
+|-------------------------------------------------------------------------------
+{{{#!td align=left  valign=top
+{{{canvas}}}
+}}}
+{{{#!td align=left  valign=top    
+Enige stijlinformatie niet specifiek voor knopen, wegen of relaties.
+{{{
+#!css
+canvas {
+    fill-color: #ffffea; /* de eerdere achtergrondkleur is vervallen sinds r7110 */
+    default-points: false;
+    default-lines: false;
+}
+}}}
+{{{#!th
+'''Sleutel'''
+}}}
+{{{#!th
+'''Beschrijving'''
+}}}
+{{{#!th
+'''Indeling waarde'''
+}}}
+{{{#!th
+'''Standaard waarde'''
+}}}
+|-
+{{{#!td
+{{{fill-color}}}
+}}}
+{{{#!td
+Specificeert de overal gebruikte vul-/achtergrondkleur (`background-color` is vervallen sinds r7110).
+}}}
+{{{#!td
+''Kleur''
+}}}
+{{{#!td align=center
+{{{black}}}
+}}}
+|-
+{{{#!td
+{{{default-points}}}
+}}}
+{{{#!td
+Of de standaard puntstijl zou moeten worden toegepast op knopen waar geen stijl op van toepassing is.
+}}}
+{{{#!td
+''Boolean''
+}}}
+{{{#!td align=center
+{{{true}}}
+}}}
+|-
+{{{#!td
+{{{default-lines}}}
+}}}
+{{{#!td
+Of de standaard lijnstijl zou moeten worden toegepast op wegen waar geen stijl voor van toepassing is.
+}}}
+{{{#!td
+''Boolean''
+}}}
+{{{#!td align=center
+{{{true}}}
+}}}
+}}}
+
+=== Kind-selector ===
+Indien een knoop deel is van een weg, zeggen we dat het een ''kind'' is van die weg. Soortgelijk: als een knoop, een weg, of een relatie kid is
+van een relatie, zeggen we dat het een ''kind'' is van die relatie.
+
+In MapCSS kunt u een '''kind selector''' gebruiken die alleen overeenkomt als zowel het ouder- als het kind-object overeenkomen.
+
+Voorbeeld:
+{{{
+#!css
+/*
+ * komt alleen overeen voor een weg die een kind is van een relatie met de tags 
+ * type=route en route=foot
+ */
+relation[type=route][route=foot] > way {...}
+}}}
+
+Opmerkingen:
+* Zoomselector en Laagidentificatie zijn alleen relevant voor het gedeelte aan de rechterzijde van het teken >.
+* De functies ''prop()'' en ''is_prop_set()'' worden alleen ondersteund aan de rechterkant van het teken >.
+* De functie ''parent_tag'' en ''parent_tags'' (zie hieronder) kunnen worden gebruikt om toegang te krijgen tot de tags vanuit de ouder(s).
+* Voor compatibiliteit met de standaard MapCSS 0.2 wordt `relation[type=route][route=foot] way {/*...*/}`, zonder het teken groter dan `>` ook ondersteund. However, no [[#Linkselector]] may be specified in this case.
+
+
+=== Ouder-selector ===
+In aanvulling op kind-selector ondersteunt JOSM ook de notie van een '''ouder-selector'''. Onthoud dat ouder-selectoren een
+JOSM-specifieke uitbreiding zijn van MapCSS en niet aanwezig zijn in andere implementaties van MapCSS.
+
+gelijk aan een kind-selector, komt een ouder-selector alleen overeen als zowel de ouder- als het kindobject overeenkomen. In tegenstelling tot
+de kind-selector, wordt het teken < gebruikt. 
+
+In tegenstelling tot de kind-selector, zal het ouder-object worden "geselecteerd". Met andere woorden, de eigenschappen in het declaratieblok {{{{...}}}} zijn van toepassing op het object aan de rechterkant van het teken "<".
+
+Voorbeeld:
+{{{
+#!css
+/*
+ * komt overeen met een highway waarvan tenminste één knoop is getagd als traffic_calming=*
+ */
+node[traffic_calming] < way[highway] {...}
+}}}
+
+=== Voorwaarde-selector ===
+Selectoren kunnen een set voorwaarden bevatten. Als één van deze voorwaarden evalueert naar 'false', komt de selector niet overeen en wordt de
+stijlregel niet toegepast.
+
+Een '''attribuut voorwaarde''' specificeert een voorwaarde op een tag van een object van OSM. 
+
+[=#condition_selector_operators]
+{{{#!th align=left valign=top 
+'''Operator'''
+}}}
+{{{#!th align=left valign=top
+'''Beschrijving'''
+}}}
+{{{#!th align=left valign=top
+'''Voorbeeld'''
+}}}
+|-------------------------------------------------------------------------------
+{{{#!td align=left  valign=top
+`=`
+}}}
+{{{#!td align=left  valign=top    
+Exacte overeenkomst van de waarde.
+}}}
+{{{#!td align=left  valign=top    
+{{{
+#!css
+way[highway=residential]                   /* zonder aanhalingstekens altijd niet hoofdlettergevoelig */
+node[name="Mijn naam"]                     /* aanhalingstekens gebruiken voor als de waarde spaties bevat of als overeenkomen van hoofdletters belangrijk is */
+node["MY_Special_TAG"="een andere waarde"] /* aanhalingstekens gebruiken voor namen van tags als overeenkomen van hoofdletters vereist is */
+node["ÖPVN"=tram]                          /* aanhalingstekens gebruiken voor sleutels van tags met speciale tekens */
+                                           /*   onthoud dat deze niet algemeen voorkomend zijn in OSM op dit moment */
+}}}
+}}}
+|-------------------------------------------------------------------------------
+{{{#!td align=left  valign=top
+`!=`
+}}}
+{{{#!td align=left  valign=top    
+Waarde is niet gelijk aan 
+}}}
+{{{#!td align=left  valign=top    
+{{{
+#!css
+way[highway!=residential]                   /* zonder aanhalingstekens altijd niet hoofdlettergevoelig */
+node[name!="Mijn naam"]                     /* aanhalingstekens gebruiken voor als de waarde spaties bevat of als overeenkomen van hoofdletters belangrijk is */
+node["MY_Special_TAG"!="en andere waarde"]  /* aanhalingstekens gebruiken voor namen van tags als overeenkomen van hoofdletters vereist is */
+node["name:fr"!="mon nome"]                 /* aanhalingstekens gebruiken voor sleutels van tags met speciale tekens, zoals dubbele punten */
+}}}
+}}}
+|-------------------------------------------------------------------------------
+{{{#!td align=left  valign=top
+`<`, `>`, `<=`, `>=`
+}}}
+{{{#!td align=left  valign=top    
+Vergelijking op numerieke waarden.
+
+}}}
+{{{#!td align=left  valign=top    
+{{{
+#!css
+node[population > 50000]                    /* zonder aanhalingstekens altijd niet hoofdlettergevoelig */
+node[ele <= 3000]                           /* aanhalingstekens gebruiken voor als de waarde spaties bevat of als overeenkomen van hoofdletters belangrijk is */
+}}}
+}}}
+|-------------------------------------------------------------------------------
+{{{#!td align=left  valign=top
+{{{^=}}}
+}}}
+{{{#!td align=left  valign=top    
+Overeenkomst voorvoegsel
+}}}
+{{{#!td align=left  valign=top    
+{{{
+#!css
+node[name ^= "mijnvoorvoegsel"]             /* waarde begint met 'mijnvoorvoegsel' */
+}}}
+}}}
+|-------------------------------------------------------------------------------
+{{{#!td align=left  valign=top
+`$=`
+}}}
+{{{#!td align=left  valign=top    
+Overeenkomst achtervoegsel
+}}}
+{{{#!td align=left  valign=top    
+{{{
+#!css
+node[name $= "mijnachtervoegsel"]           /* waarde eindigt op 'mijnachtervoegsel' */
+}}}
+}}}
+|-----------------------------------------------
+{{{#!td align=left  valign=top
+`*=`
+}}}
+{{{#!td align=left  valign=top    
+Overeenkomst subtekenreeks
+}}}
+{{{#!td align=left  valign=top    
+{{{
+#!css
+node[name *= "mijn subtekenreeks"]          /* waarde bevat de subtekenreeks 'mijn subtekenreeks' */
+}}}
+}}}
+|-------------------------------------------------------------------------------
+{{{#!td align=left  valign=top
+`~=`
+}}}
+{{{#!td align=left  valign=top    
+Lijst leden
+}}}
+{{{#!td align=left  valign=top    
+{{{
+#!css
+*[vending~=stamps]                          /* de waarde van de tag voor de tag 'vending' bestaat uite een lijst met ;-gescheiden waarden    */
+                                            /* en één van deze waarden is 'stamps'                                             */
+}}}
+}}}
+|-------------------------------------------------------------------------------
+{{{#!td align=left  valign=top
+`=~`
+}}}
+{{{#!td align=left  valign=top    
+Overeenkomst [http://download.oracle.com/javase/7/docs/api/java/util/regex/Pattern.html#sum Reguliere expressie] 
+
+}}}
+{{{#!td align=left  valign=top    
+{{{
+#!css
+name[name=~/^Mijn_patroon.*/]               /* de waarde van de tag 'name' komt overeen met de reguliere expressie '^Mijn_patroon.*' */
+                                            /* Onthoud dat requliere expressies moeten zijn omsloten door /.../                     */                  
+}}}
+Hoofdlettergevoelige overeenkomsten kunnen worden bereikt via de ingebedde vlag expressie `(?i)` (zie [http://docs.oracle.com/javase/7/docs/api/java/util/regex/Pattern.html#CASE_INSENSITIVE Pattern.CASE_INSENSITIVE]).
+}}}
+|-------------------------------------------------------------------------------
+{{{#!td align=left  valign=top
+`!~` (sinds r6455)
+}}}
+{{{#!td align=left  valign=top    
+Ontkennende [http://download.oracle.com/javase/7/docs/api/java/util/regex/Pattern.html#sum Reguliere expressie] overeenkomst
+
+}}}
+{{{#!td align=left  valign=top    
+{{{
+#!css
+*[surface!~/paved|unpaved/]
+}}}
+}}}
+|-------------------------------------------------------------------------------
+{{{#!td align=left  valign=top
+`∈` ([http://www.fileformat.info/info/unicode/char/2208/index.htm U+2208], sinds r6609)
+}}}
+{{{#!td align=left  valign=top    
+element van
+
+}}}
+{{{#!td align=left  valign=top    
+{{{
+#!css
+node[amenity=parking] ∈ *[amenity=parking] {
+  throwWarning: tr("{0} inside {1}", "amenity=parking", "amenity=parking");
+}
+}}}
+}}}
+|-------------------------------------------------------------------------------
+{{{#!td align=left  valign=top
+`⧉` ([http://www.fileformat.info/info/unicode/char/29c9/index.htm U+29C9], sinds r6613)
+}}}
+{{{#!td align=left  valign=top    
+crossing
+
+}}}
+{{{#!td align=left  valign=top    
+{{{
+#!css
+area:closed:areaStyle ⧉ area:closed:areaStyle {
+  throwOther: tr("Overlapping Areas");
+}
+}}}
+}}}
+
+Sinds r6554 is het mogelijk de waarde "value" te laten voorafgaan door iets (d.i. expressie na de operator) met een `*` om die daar niet naar te "verwijzen" (d.i. te zorgen dat het wordt beschouwd als een andere sleutel en daar de waarde van te verkrijgen). Dus, `[key1 = *key2]` vergelijkt de waarde van `key1` met de waarde van `key2`, en `[key =~ */pattern/]` beschouwt de waarde van het `pattern` van de sleutel als een reguliere expressie en vergelijkt die met de waarde van `key`.
+
+In aanvulling daarop kunt u testen of een tag aanwezig is of niet:
+
+{{{#!th align=left valign=top 
+'''Voorwaarde'''
+}}}
+{{{#!th align=left valign=top
+'''Voorbeeld'''
+}}}
+|-------------------------------------------------------------------------------
+{{{#!td align=left  valign=top
+Aanwezigheid van de tag
+}}}
+{{{#!td align=left  valign=top    
+{{{
+#!css
+way[highway]                     /* komt overeen met elke weg met een tag 'highway'                                   */
+way["VALSOU"]                    /* aanhalingstekens gebruiken als overeenkomen van hoofdletters vereist is           */
+way["name:fr"]                   /* aanhalingstekens gebruiken als naam van de tag speciale tekens bevat (witruimte, dubbele punten, etc.) */
+}}}
+}}}
+|-------------------------------------------------------------------------------
+{{{#!td align=left  valign=top
+Afwezigheid van de tag
+}}}
+{{{#!td align=left  valign=top    
+{{{
+#!css
+way[!highway]                     /* komt overeen met elke weg die geen tag 'highway' heeft                            */
+way[!"VALSOU"]                    /* aanhalingstekens gebruiken als overeenkomen van hoofdletters vereist is           */
+way[!"name:fr"]                   /* aanhalingstekens gebruiken als naam van de tag speciale tekens bevat (witruimte, dubbele punten, etc.) */
+}}}
+}}}
+|-------------------------------------------------------------------------------
+{{{#!td align=left  valign=top
+Aanwezigheid van tag door overeenkomst [http://download.oracle.com/javase/7/docs/api/java/util/regex/Pattern.html#sum Reguliere expressie] (sinds r6547)
+}}}
+{{{#!td align=left  valign=top    
+{{{
+#!css
+way[/^addr:/]                     /* komt overeen met elke sleutel `addr:*` */
+}}}
+}}}
+|-------------------------------------------------------------------------------
+{{{#!td align=left  valign=top
+Afwezigheid van tag door overeenkomst Reguliere expressie
+}}}
+{{{#!td align=left  valign=top    
+{{{
+#!css
+way[!/^addr:/]                    /* komt overeen met elke weg die geen tag 'addr:*' heeft */
+}}}
+}}}
+
+U kunt testen of de waarde van een tag een logische waarde 'waar'is. De waarde evalueert naar 'waar', als het of 
+"yes", "true", of "1" is. Alle andere waarden evalueren naar 'onwaar'.
+
+{{{#!th align=left valign=top 
+'''Voorwaarde'''
+}}}
+{{{#!th align=left valign=top
+'''Voorbeeld'''
+}}}
+|-------------------------------------------------------------------------------
+{{{#!td align=left  valign=top
+Testen op waarde 'waar'
+}}}
+{{{#!td align=left  valign=top    
+{{{
+#!css
+way[oneway?]                  /* komt overeen met elke weg die een waarde 'waar' heeft voor de tag 'oneway'  */
+}}}
+}}}
+|-------------------------------------------------------------------------------
+{{{#!td align=left  valign=top
+Testen op waarde 'onwaar' (sinds r6513)
+}}}
+{{{#!td align=left  valign=top    
+{{{
+#!css
+way[oneway?!]                  /* komt overeen met elke weg die een waarde 'onwaar' heeft voor de tag 'oneway'  */
+}}}
+}}}
+
+=== Link-selector ===
+In een kind-selector kunt u voorwaarden formuleren in de koppeling tussen een ouder- en kind-object. 
+
+Als de ouder een relatie is, kunt u voorwaarden formuleren voor de ''role'' dat een lid-object in deze relatie heeft.
+{{{
+#!css
+relation[type=route] >[role="link"] way {  /* komt overeen met elke weg die lid is van een relatie voor een route met de rol 'link' */ 
+   color: blue;
+}
+}}}
+
+{{{#!th align=left valign=top 
+'''Operator'''
+}}}
+{{{#!th align=left valign=top
+'''Beschrijving'''
+}}}
+{{{#!th align=left valign=top
+'''Voorbeeld'''
+}}}
+|-------------------------------------------------------------------------------
+{{{#!td align=left  valign=top
+`=`
+}}}
+{{{#!td align=left  valign=top    
+Exacte overeenkomst van de naam van de rol. De naam van de {{{role}}} is verplicht in deze context. 
+}}}
+{{{#!td align=left  valign=top    
+{{{
+#!css
+relation >[role=residential] way           /* zonder aanhalingstekens altijd niet gevoelig voor hoofdletters */
+relation >[role="Mijn naam"]   way           /* aanhalingstekens gebruiken als de waarde van de rol spaties bevat of als overeenkomen van hoofdletters belangrijk is */
+}}}
+}}}
+
+De operatoren {{{!=, ^=, $=, *=, en ~=}}} worden ook ondersteund. Bekijk [#condition_selector_operators voorwaarden operatoren selector].
+
+Knopen in wegen en leden in relaties zijn gesorteerd. U kunt voorwaarden formuleren voor de position van een knoop in een weg of een lid-
+object in een relatie. Positieve getallen tellen vanaf het eerste tot en met het laatste element, negatieve getallen (sinds r8206) tellen van het laatste tot en met het eerste element.
+
+{{{
+#!css
+relation[type=route] >[index=1] way {  /* komt overeen met de eerste weg die een lid is van de relatie van de route  */ 
+   color: blue;
+}
+
+way >[index=-1] node {  /* komt overeen met de laatste knoop van een weg  */ 
+   symbol-stroke-color: green;
+}
+
+way!:closed >[index=1] node!:connection,
+way!:closed >[index=-1] node!:connection {  /* komt overeen met alle eindknopen van enkele wegen */ 
+   symbol-stroke-color: green;
+}
+}}}
+
+
+=== Zoom-selector ===
+U kunt een type selector decoreren met een '''zoom-selector'''. De zoom-selector beperkt het bereik aan zoomniveaus 
+waarop de respectievelijke regel voor MapCSS wordt toegepast.
+
+{{{#!th align=left valign=top 
+'''Voorbeeld'''
+}}}
+{{{#!th align=left valign=top
+'''Beschrijving'''
+}}}
+|-------------------------------------------------------------------------------
+|| {{{way|z12 {...} }}} || Op zoomniveau 12 ||
+|| {{{way|z13-15 {...} }}} || Van 13 tot en met 15 ||
+|| {{{way|z16- {...} }}} || 16 en hoger ||
+|| {{{way|z-12 {...} }}} || 12 en lager ||
+|| {{{way {...} }}} || elk zoomniveau ||
+
+De precieze definitie van schaalbereiken voor elk zoomniveau kan in de toekomst wijzigen. Als vuistregel kunt u verwachten dat u ongeveer op zoomniveau ''n'' bent als afbeeldingen tegels van slippymap weergeven van het niveau ''n''.
+
+
+=== Pseudoklassen ===
+Zie [https://josm.openstreetmap.de/doc/org/openstreetmap/josm/gui/mappaint/mapcss/Condition.PseudoClasses.html Javadoc] voor de up-to-date lijst van pseudoklassen die worden ondersteund door JOSM's MapCSS-implementatie.
+
+|| {{{:closed}}} || waar voor wegen waar de erste knoop hetzelfde is als de laatste en voor elke relatie van een multipolygoon ||
+|| {{{:new}}} || alle nieuw objecten ||
+|| {{{:connection}}} || waar voor knopen die worden gebruikt voor meer dan één weg ||
+|| {{{:unconnected}}} || waar voor knopen die niet worden gebruikt door een weg (sinds r6687) ||
+|| {{{:tagged}}} || Wat JOSM beschouwd als zijnde getagd, d.i. een object met een tag sleutel, anders dan de volgende: {{{source*, source_ref, note, comment, converted_by, created_by, watch*, fixme, FIXME, description, attribution}}} (versie r4008; in deze lijst is {{{*}}} een glob)
+|| {{{:righthandtraffic}}} || waar als er verkeer aan de rechterkant is op de huidige locatie (sinds r7193); zie [[left-right-hand-traffic]] voor schermafdruk  van gebieden ||
+|| {{{:unclosed_multipolygon}}} || waar voor volledig geladen niet gesloten ralties van multipolygonen (sinds r8252) ||
+|| {{{:open_end}}} || selecteren van eindknopen van niet gesloten relaties van multipolygonen met `relation:unclosed_multipolygon >:open_end node` (sinds r8252) ||
+|| {{{:in-downloaded-area}}} || waar als een object binnen het brongebied ligt en onwaar als het in het gearceerde gebied ligt (sinds 8495). ||
+{{{#!comment
+|| {{{:modified}}} || gewijzigde objecten (Onthoud dat de stijlen niet zijn bijgewerkt als u een knoop verplaatst, u moet dus het stijlblad aan en uit schakelen om een bijgewerkte weergave te verkrijgen.) (sinds r7193) ||
+}}}
+U kunt pseudoklassen ook ontkennend gebruiken. Bijv. {{{!:new}}} voor alle oude objecten.
+
+=== Laag-identificatie ===
+
+Lagen kunnen worden gebruikt om meer dan één stijl voor een enkel object te maken. Hier is een voorbeeld:
+{{{
+#!css
+way[highway=secondary] {
+    width: 3;
+    color: yellow;
+}
+
+way[highway=tertiary] {
+    width: 2;
+    color: orange;
+}
+
+way[access][access!=public]::non_public_access_layer {
+    width: +2; 
+    color:red; 
+    dashes: 2; 
+    object-z-index:-1.0;
+}
+
+way[bridge]::bridge_layer {
+    width: +3; 
+    color:#000080;
+    opacity:0.5;
+    object-z-index:1.0; 
+}
+}}}
+Dit tekent alle secondary en tertiary wegen respectievelijk in geel en oranje. Elke weg met een tag access, anders dan public, zal een extra lijnstijl krijgen onder ('''{{{object-z-index:-1.0;}}}''') de hoofdlijn. Als dat gedeelte van de straat ook een brug blijkt te zijn, krijgt het ook een half transparante blauwe overlay. De relatieve bwaarde voor de dikte ('''{{{width: +2;}}}''') verwijst naar de dikte op de standaard laag (in dit geval 2 of 3).
+
+De naam voor de laag mag elke identifcatie zijn.
+
+ default::
+ Als u de laag in de selector weglaat, is dat hetzelfde als {{{::default}}} gebruiken. 
+ *::
+ In aanvulling daarop kunt u de * laag gebruiken om voorrang te verkrijgen en alle lagen te initialiseren.[[br]]
+ het krijgt voorrang boven alle bestaande subgedeelten, dus
+{{{
+#!css
+way::A { a; } 
+way::B { b; } 
+way::* { c; } 
+}}}
+ is equivalent aan
+{{{
+#!css
+way::A { a; } 
+way::B { b; } 
+way::A { c; } 
+way::B { c; }
+}}}
+ En het initialiseert nieuwe subgedeelten. Met andere woorden: 
+{{{
+#!css
+way::* { a; } 
+way::A { b; } 
+}}}
+ is equivalent aan 
+{{{
+#!css
+way::A {} 
+way::* { a; } 
+way::A { b; } 
+}}}
+ wat op zijn beurt hetzelfde is als 
+{{{
+#!css
+way::A { a; } 
+way::A { b; } 
+}}}
+ of
+{{{
+#!css
+way::A { a; b; }
+}}}
+
+
+=== Groeperen ===
+
+Regels met een algemeen declaratieblok kunnen worden gegroepeerd in één:
+{{{
+#!css
+area[landuse=forest] { color: green;   width: 2; }
+area[natural=wood] { color: green;   width: 2; }
+}}}
+is hetzelfde als
+{{{
+#!css
+area[landuse=forest], area[natural=wood] { color: green;   width: 2; }
+}}}
+
+=== Klassen ===
+U kunt klassen toewijzen aan overeenkomende elementen, en andere selectors definiëren met behulp van deze klassen:
+
+{{{
+#!css
+/* klassen toewijzen */
+selector {
+  set class;
+  /* of als equivalent */
+  set .class;
+}
+
+/* overeenkomende klassen */
+way.class, node[foo=bar].class {
+  /* ... */
+}
+}}}
+
+
+Voorbeeld voor het toewijzen/overeen laten komen van een klasse, genaamd `path`:
+{{{
+#!css
+way[highway=footway] { set path; color: #FF6644; width: 2; }
+way[highway=path]    { set path; color: brown; width: 2; }
+way.path { text:auto; text-color: green; text-position: line; text-offset: 5; }
+}}}
+U kunt klassen ook ontkennend gebruiken. Bijv. {{{way!.path}}} voor alle wegen, die geen deel uitmaken van de klasse ''.path''.
+
+== @supports-regel voor voorwaardelijk verwerken [''sinds 8087''] ==
+
+@supports-regels worden gebruikt om een gedeelte van de stijl onder bepaalde voorwaarden over te slaan. Gewoonlijk wilt u een object gebruiken dat werd geïntroduceerd in een nieuwere versie van JOSM, maar wil wel een stijl hebben om op terug te kunnen vallen voor gebruikers van oudere cliënten van JOSM clients. Voorbeeld:
+{{{
+#!css
+@supports (min-josm-version: 9789) {
+    way[highway] {
+        width: 4;
+        color: orange;
+    }
+    /* fijne nieuwe mogelijkheden */
+    /* ... */
+}
+
+@supports (max-josm-version: 9788) {
+    way[highway] {
+        width: 4;
+        color: blue;
+    }
+    /* modus om op terug te vallen, meer eenvoudige objecten gebruiken */
+    /* ... */
+}
+
+@supports (icon-offset-x) {
+    /* alleen als eigenschap icon-offset-x wordt ondersteund */
+    node[amenity] {
+        icon-offset-x: 5;
+    }
+}
+}}}
+
+De syntaxis komt nagenoeg overeen met de officiële [http://dev.w3.org/csswg/css-conditional/ syntaxis voor CSS]. De volgende voorwaarden worden ondersteund:
+
+{{{#!th
+'''Voorwaarde'''
+}}}
+{{{#!th
+'''Beschrijving'''
+}}}
+|-
+{{{#!td
+(''<mapcsskey>'')
+}}}
+{{{#!td
+Controleer of een bepaalde sleutel van MapCSS wordt ondersteund, bijv. `repeat-image` of `icon-offset-x`.
+}}}
+|-
+{{{#!td
+(min-josm-version: ''<getal>'')
+}}}
+{{{#!td
+Alleen gedeelte {{{@supports}}} opnemen als de huidige versie van JOSM groter is dan of gelijk is aan het gespecificeerde getal.
+}}}
+|-
+{{{#!td
+(max-josm-version: ''<getal>'')
+}}}
+{{{#!td
+Alleen gedeelte {{{@supports}}} opnemen als de huidige versie van JOSM kleiner is dan of gelijk is aan het gespecificeerde getal.
+}}}
+|-
+{{{#!td
+(user-agent: ''<tekenreeks>'')
+}}}
+{{{#!td
+Alleen gedeelte {{{@supports}}} opnemen als de naam van de bewerker / renderer overeenkomt met de opgegeven tekenreeks. In JOSM is de enige geaccepteerde waarde {{{josm}}}. 
+}}}
+
+Voorwaarden mogen worden gecombineerd met {{{and}}}:
+
+{{{
+#!css
+@supports (min-josm-version: 8087) and (max-josm-version: 8200) {
+ /* alleen voor JOSM-versies 8087 tot en met 8200 */
+}
+}}}
+
+Andere logische operatoren zoals {{{or}}} en {{{not}}} mogen ook worden gebruikt. Haakjes zijn nodig als u verschillende logische operatoren wilt combineren:
+
+{{{
+#!css
+@supports ((min-josm-version: 8087) and (max-josm-version: 8200)) or (user-agent: myEditor) {
+  /* voor JOSM-versie 8087 tot en met 8200 en voor de bewerker genaamd "myEditor" */
+}
+}}}
+
+Omdat @supports-regels alleen worden ondersteund in JOSM 8087 en later, zou u die ook als minimale versie van JOSM moeten specificeren in de meta-selector:
+
+{{{
+#!css
+meta {
+    min-josm-version: "8087"; /* Deze stijl gebruikt @supports-regels */
+    /* ... */
+}
+}}}
+
+== Media-query's [''sinds 6970'']  (vervallen) ==
+
+{{{#!td style="background-color: #faa"
+Opmerking: media-query's zijn vervallen. U zou in plaats daarvan @supports-regels moeten gebruiken (zie boven).
+}}}
+Media-query's worden gebruikt om onder bepaalde voorwaarden een gedeelte van de stijl over te slaan. Gewoonlijk wilt u een object gebruiken dat werd geïntroduceerd in een nieuwere versie van JOSM, maar wil wel een stijl hebben om op terug te kunnen vallen voor gebruikers van oudere cliënten van JOSM clients. Voorbeeld:
+{{{
+#!css
+@media (min-josm-version: 9789) {
+    way[highway] {
+        width: 4;
+        color: orange;
+    }
+    /* fijne nieuwe mogelijkheden */
+    /* ... */
+}
+
+@media (max-josm-version: 9788) {
+    way[highway] {
+        width: 4;
+        color: blue;
+    }
+    /* modus om op terug te vallen, meer eenvoudige objecten gebruiken */
+    /* ... */
+}
+}}}
+
+De syntaxis komt nagenoeg overeen met de officiële [http://www.w3.org/TR/css3-mediaqueries/#syntax syntaxis voor CSS]. De volgende voorwaarden worden ondersteund:
+
+{{{#!th
+'''Voorwaarde media'''
+}}}
+{{{#!th
+'''Beschrijving'''
+}}}
+|-
+{{{#!td
+(min-josm-version: ''<getal>'')
+}}}
+{{{#!td
+Alleen gedeelte {{{@media}}} opnemen als de huidige versie van JOSM groter is dan of gelijk is aan het gespecificeerde getal.
+}}}
+|-
+{{{#!td
+(max-josm-version: ''<getal>'')
+}}}
+{{{#!td
+Alleen gedeelte {{{@media}}} opnemen als de huidige versie van JOSM kleiner is dan of gelijk is aan het gespecificeerde getal.
+}}}
+|-
+{{{#!td
+(user-agent: ''<tekenreeks>'')
+}}}
+{{{#!td
+Alleen gedeelte {{{@media}}} opnemen als de naam van de bewerker / renderer overeenkomt met de opgegeven tekenreeks. In JOSM is de enige geaccepteerde waardee {{{josm}}}. 
+}}}
+
+Voorwaarden mogen worden gecombineerd met {{{and}}}:
+
+{{{
+#!css
+@media (min-josm-version: 6970) and (max-josm-version: 7014) {
+ /* alleen voor JOSM-versies 6970 tot en met 7014 */
+}
+}}}
+
+Meerdere gecombineerde voorwaardeb mogen worden verbonden met een komma (logische ''or''):
+
+{{{
+#!css
+@media (min-josm-version: 6970) and (max-josm-version: 7014), (user-agent: myEditor) {
+  /* voor JOSM-versies 6970 tot en met 7014 en voor de bewerker genaamd "myEditor" */
+}
+}}}
+
+Omdat media-query's alleen worden ondersteund in JOSM 6970 en later, zou u deze ook als de minimale versie van JOSM moeten spcificeren in de meta-selector:
+
+{{{
+#!css
+meta {
+    min-josm-version: "6970"; /* Deze stijl gebruik media-query's */
+    /* ... */
+}
+}}}
+
+
+{{{#!comment
+Er is ook het sleutelwoord {{{not}}} (bekijk het gekoppelde CSS-doc voor details).
+Dit is heímplementeerd, maar waarschijnlijk niet erg nuttig. Het staat u vrij documentatie toe te voegen.
+}}}
+
+== Instellingen voor stijl ==
+
+[[wiki:/Nl:Help/Dialog/MapPaint/StyleSettings|Instellingen voor stijl]] worden gebruikt om de gebruikersinstellingen te verschaffen voor het aanpassen van een kaarttekenstijl. De gebruiker kan ze gebruiken in het dialoogvenster Kaarttekenstijlen. Instellingen voor stijl zijn beschikbaar sinds r7450. De interne stijl verschaft instellingen voor stijl sinds r7454. Onthoud dat er plannen zijn om de implementatie van instellingen voor stijl uit te breiden (momenteel worden alleen Booleaanse waarden ondersteund), dus de syntaxis voor MapCSS zou in de toekomst kunnen wijzigen (zie #10435).
+
+een instelling maken:
+{{{
+#!css
+setting::highway_casing {
+  type: boolean;
+  label: tr("Teken highway casing");
+  default: true;
+}
+}}}
+een instelling gebruiken:
+{{{
+#!css
+way[highway][setting("highway_casing")] {
+  casing-width: 2;
+  casing-color: white;
+}
+}}}
+
+== Eigenschappen ==
+
+=== Algemene eigenschappen ===
+
+||=  '''Sleutel''' =||= '''Beschrijving''' =||= '''Opmaak waarde''' =||= '''standaard waarde''' =||
+|| {{{z-index}}}                                 || Specificeer de volgorde waarin de objecten worden getekend: De objecten met een hogere z-index worden bovenop objecten met een lagere z-index getekend || ''Getal'' (mag negatief zijn) ||  0  ||
+|| {{{major-z-index}}} || Soortgelijk aan {{{z-index}}}, maar heeft een hogere prioriteit dan {{{z-index}}}. Dus als een object een hogere {{{major-z-index}}} heeft dan een ander, wordt het er bovenop getekend. Als de {{{major-z-index}}} hetzelfde is, bepaalt {{{z-index}}}. || ''Getal'' (mag negatief zijn) ||  Afhankelijk van stijlelement: 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   ||
+|| {{{object-z-index}}} || Soortgelijk aan {{{z-index}}}, maar heeft een lagere prioriteit. Beheert de tekenvolgorde voor overlappende objecten. Bijv. voor twee kruisende wegen met tekst: Gebruik {{{z-index}}} of {{{major-z-index}}} als u eerst de twe elijnen wilt tekenen en dan de twee bijschriften. Gebruik {{{object-z-index}}} als één van de twee wegen volledig bovenop de ander zou moeten liggen. || ''Getal'' (mag negatief zijn) ||  0  ||
+|| {{{modifier}}} || Beter beheer, of een standaard lijn / symbool voor knoop wordt gegenereerd door JOSM. Dit gebeurt wanneer er geen juiste stijl ({{{modifier=false}}}) wordt gevonden op eender welke laag. || {{{false}}} of {{{true}}} || {{{false}}} voor de standaard laag en {{{true}}} voor elke andere laag ||
+
+
+
+=== Stijlen voor pictogrammen en symbolen ===
+
+||=  '''Sleutel''' =||= '''Beschrijving''' =||= '''Opmaak waarde''' =||= '''Standaard waarde''' =||
+|| {{{icon-image}}} || Het pictogram op de positie van de knoop || ''Afbeelding'' ||  -  ||
+|| {{{icon-opacity}}} || transparantie van de afbeelding van het pictogram || ''Transparantie'' ||  1.0  ||
+|| {{{icon-width}}} || Breedte van het pictogram. Indien slechts één van de eigenschappen {{{icon-width}}} en {{{icon-height}}} wordt opgegeven, zak de afbeelding proportioneel worden geschaald. Het pictogram zal zijn originele grootte behouden, als noch {{{icon-width}}} noch {{{icon-height}}} zijn ingesteld. || ''Getal'' ||  -  ||
+|| {{{icon-height}}} || Hoogte van het pictogram. (Zie {{{icon-width}}}) || ''Getal'' ||  -  ||
+|| `icon-offset-x` || Verplaats het pictogram in horizontale richting (positieve waarden naar rechts) (sinds r8085) || ''Getal'' ||  0  ||
+|| `icon-offset-y` || Verplaats het pictogram in verticale richting (positieve waarden naar beneden) (sinds r8085) || ''Getal'' ||  0  ||
+|| `icon-rotation` || Draai het pictogram met de klok mee of tegen de klok in (negatieve waarde)(sinds r8260) || `[rad]`, `[rad]rad`, `[deg]°`, `[deg]deg`, `[grad]grad`, `[turn]turn` ([https://developer.mozilla.org/en/docs/Web/CSS/angle definition]) van een cardinale richting (bijv. `northeast` of `sw`); Bekijk ook de functies `degree_to_radians`, `cardinal_to_radians`. ||  -  ||
+|| {{{symbol-shape}}}                               || Geef een symbool weer op de positie van de knoop || {{{square}}}, {{{circle}}}, {{{triangle}}}, {{{pentagon}}}, {{{hexagon}}}, {{{heptagon}}}, {{{octagon}}}, {{{nonagon}}}, {{{decagon}}} ||  -  ||
+|| {{{symbol-size}}} || Grootte van het symbool || ''Getal'', mag relatief zijn ("+4") ||  10  ||
+|| {{{symbol-stroke-width}}} || Breedte buitenste lijn || ''Breedte'' ||  1.0 als {{{symbol-stroke-color}}} is ingesteld  ||
+|| {{{symbol-stroke-color}}} || Lijnkleur || ''Kleur'' || {{{#FFC800}}} als {{{symbol-stroke-width}}} is ingesteld ||
+|| {{{symbol-stroke-opacity}}} || Transparantie lijn || ''Transparantie'' ||  1.0  ||
+|| {{{symbol-fill-color}}} || Kleur voor vulling van de vorm || ''Kleur'' || {{{blue}}}, tenzij ofwel {{{symbol-stroke-width}}} of {{{symbol-stroke-color}}} zijn ingesteld ||
+|| {{{symbol-fill-opacity}}} || Transparantie vulling || ''Transparantie'' ||  1.0  ||
+|| {{{text-...}}}, {{{font-...}}} ||||||  Algemene eigenschappen tekst & lettertype  ||
+|| {{{text-anchor-horizontal}}} || Horizontale plaatsing tekstlabel || {{{left}}}, {{{center}}}, {{{right}}} ||  {{{right}}}  ||
+|| {{{text-anchor-vertical}}} || Verticale plaatsing tekstlabel || {{{above}}}, {{{top}}}, {{{center}}}, {{{bottom}}}, {{{below}}} ||  {{{bottom}}}  ||
+
+Vertrouw niet op de standaard waarden voor eigenschappen van {{{symbol-...}}} (uitgezonderd {{{opacity}}}). Zij zijn bedoeld voor "snelle & vuile" stijlbladen en zouden moeten worden ingesteld op een expliciete waarde.
+
+
+
+
+
+=== Lijnstijlen ===
+||=  '''Sleutel''' =||= '''Beschrijving''' =||= '''Opmaak waarde''' =||= '''Standaard waarde''' =||
+|| {{{width}}} || Lijnbreedte || ''Breedte'' ||  -  ||
+|| {{{color}}} || Lijnkleur || ''Kleur'' ||  waarde van {{{fill-color}}} of (indien niet ingesteld) JOSM's standaard niet getagde kleur ({{{#808080}}}) ||
+|| {{{opacity}}} || Hoe transparant de lijn is. || ''Transparantie'' ||  1.0  ||
+|| {{{dashes}}} || Een array van wisselende aan/uit lengten || lijst met getallen, bijv. [[br]]> 15, 5 [[br]][[br]]mag worden geschreven als expressie: [[br]] > {{{list(3, 4, 5, 6)}}} [[br]][[br]]of het selutelwoord {{{none}}}[[br]]om de streepjes uit te schakelen ||  -  ||
+|| {{{dashes-offset}}} || Verplaats het patroon van streepjes met een bepaalde hoeveelheid || ''Getal'' (>= 0) ||  0  ||
+|| {{{dashes-background-color}}} || De kleur die gebruikt moet worden tussen de streepjes (optioneel) || ''Kleur'' ||  -  ||
+|| {{{dashes-background-opacity}}} || Waarde van transparantie voor de achtergrond van de streepjes || ''Transparantie'' ||  waarde van {{{opacity}}}  ||
+|| {{{linecap}}} || Vorm aan het einde van de lijn (zie [http://www.w3.org/TR/SVG/painting.html#StrokeLinecapProperty hier]) || {{{none}}}, {{{round}}}, {{{square}}} ||  {{{none}}}  ||
+|| {{{linejoin}}} || Vorm op hoeken van de lijn || {{{round}}}, {{{miter}}}, {{{bevel}}} ||  {{{round}}}  ||
+|| {{{miterlimit}}}                                   || Van toepassing voor {{{linejoin: miter}}}. Stelt de maximale oversteek in als lijnsegmenten elkaar ontmoeten onder een zeer kleine hoek || ''Getal'' (>= 1.0) ||  10.0  ||
+|| {{{offset}}} || Verplaats de lijn naar links of rechts (kijkend in de richting van de weg). Dit zou kunen worden gerbuikt voor het tekenen van meerdere rijstroken voor één weg of markeer de linker- en rechterzijde van de weg anders. || ''Getal'' (positieve waarde verplaatst de lijn naar links, negatieve naar rechts) ||  0  ||
+|| {{{text-position}}} || Ingesteld op {{{line}}}, als tekst langs de lijn zou moeten worden getekend || {{{line}}}, {{{center}}} ||  -  ||
+|| {{{text-...}}}, {{{font-...}}} ||||||  Algemene eigenschappen tekst & lettertype  ||
+|| `repeat-image` || Herhaalde afbeelding langs een lijn ''[sinds 5801]'' || ''Afbeelding'' ||  -  ||
+|| `repeat-image-width` || Breedte van de afbeelding (optioneel, zie `icon-width`) ''[sinds 5811]'' || ''Getal'' ||  -  ||
+|| `repeat-image-height` || Hoogte van de afbeelding (optioneel) ''[sinds 5811]'' || ''Getal'' ||  -  ||
+|| `repeat-image-align` || Uitlijning van de afbeelding. Boven-, onderrand of de (horizontale) middellijn van de afbeelding zal langs de lijn liggen ''[sinds 5801]'' || `top`, `center`, `bottom` ||  `center`  ||
+|| `repeat-image-offset` || Verschuiving vanaf de lijn ''[sinds 5801]'' || ''Getal'' ||  0  ||
+|| `repeat-image-spacing` || Afstand tussen herhalende afbeeldingen ''[sinds 5801]'' || ''Getal'' ||  0  ||
+|| `repeat-image-phase` || Initiële afstand ana het begin van de lijn ''[sinds 5812]'' || ''Getal'' ||  0  ||
+
+Al deze eigenschappen (behalve voor {{{text-...}}} en {{{font-...}}}) bestaan ook met het voorvoegsel {{{casing-}}}. De casing is een tweede onafhankelijk lijnelement, dat onder d enormale lijn wordt getekend en kan worden gebruikt om een dun frame rondom de lijn te tekenen in een andere kleur.
+||=  '''Sleutel''' =||= '''Beschrijving''' =||= '''Opmaak waarde''' =||= '''Standaard waarde''' =||
+|| {{{casing-width}}}               || Bredte van de rand aan beide zijden van de hoofdlijn. In JOSM < 5214: Totale breedte van de casing || ''Breedte'' (valt terug op {{{width}}} indien een relatieve breeedte wordt gespecificeerd) ||  -  ||
+|| {{{casing-color}}} || Kleur van de casing || ''Kleur'' ||  waarde van {{{fill-color}}} of (indien niet ingesteld) JOSM's standaard niet getagde kleur ({{{#808080}}}) ||
+|| {{{casing-opacity}}} || Hoe transparant de casing is. || ''Transparantie'' ||  1.0  ||
+|| {{{casing-}}}... || ... || ... ||  ...  ||
+Soortgelijk aan {{{casing-}}}, zijn er ook de voorvoegsels {{{left-casing-}}} en {{{right-casing-}}}. Dat tekent aanvullende lijnen links en reehcts van de hoofdlijn.
+
+=== Stijlen voor gebieden ===
+|||=  '''Sleutel''' =||= '''Beschrijving''' =||= '''Opmaak waarde''' =||= '''Standaard waarde''' =||
+|| {{{fill-color}}} || Kleur waarmee het gebied gevuld moet worden || ''Kleur'' ||  -  ||
+|| {{{fill-image}}} || Patroon van de afbeelding || ''Afbeelding'' ||  -  ||
+|| {{{fill-extent}}} || Stel deze eigenschap in om alleen de omtrek van het gebied te tekenen. Het getal specificeert hoe ver vanaf de rand van het gebied, in de richting van het midden, moet worden gevuld. (Indien niet ingesteld zal het gebied volledig worden gevuld) ''[sinds 9008]'' || ''Getal'' ||  -  ||
+|| {{{fill-opacity}}} || Hoe transparant de vulling is; van toepassing op zowel kleur als afbeelding || ''Transparantie'' ||  1.0  ||
+|| {{{text-position}}} || Ingesteld op {{{center}}}, als de tejst in het midden van het gebied zou moeten worden getekend || {{{line}}}, {{{center}}} ||  -  ||
+|| {{{text-...}}}, {{{font-...}}} ||||||  Algemene eigenschappen tekst & lettertype  ||
+Vereiste eigenschappen om een stijl voor een gebied te maken: {{{fill-color}}} of {{{fill-image}}} 
+
+
+=== Eigenschappen voor tekst & lettertype ===
+{{{#!th align=left valign=top 
+'''Sleutel'''
+}}}
+{{{#!th align=left valign=top
+'''Beschrijving'''
+}}}
+{{{#!th align=left valign=top
+'''opmaak waarde'''
+}}}
+{{{#!th align=left valign=top
+'''Standaard waarde'''
+}}}
+|-------------------------------------------------------------------------------
+{{{#!td align=left  valign=top
+{{{text}}}  
+}}}
+{{{#!td align=left  valign=top
+Hoe de labeltekst te zoeken. Er wordt geen label weergegeven, tenzij deze instructie aanwezig is.
+}}}
+{{{#!td align=left  valign=top
+{{{auto}}}
+   leid de tekst automatisch af. De standaard tags voor de naam zijn: "{{{name:}}}"+''<LANG>'', "{{{name}}}", "{{{int_name}}}", "{{{ref}}}", "{{{operator}}}", "{{{brand}}}" en "{{{addr:housenumber}}}". 
+
+   Configureer een lijst met namen van tags in de voorkeur "{{{mappaint.nameOrder}}}" om deze lijst te kunnen wijzigen. (na het wijzigen van de lijst, is opnieuw opstraten van JOSM vereist.)
+
+''Tekenreeks''
+   Geeft de sleutel van de tag aan waarvan de waarde moet worden gebruikt als tekst.
+
+''Expressies''
+  U mag een expressie invoeren om de weer te geven tekst te berekenen. Voorbeelden:
+  * {{{eval("dit is een statische tekst")}}} - renderert een statische tekst
+  * {{{eval(concat(tag("eerste"), "-", tag("tweede")))}}} - geeft de smanegevoegde tags "eerste" en "tweede" weer 
+
+{{{""}}}
+   Een eerder ingestelde tekst verwijderen.
+}}}
+{{{#!td align=center  valign=top
+-
+}}}
+|-------------------------------------------------------------------------------
+|| {{{text-color}}} || De tekstkleur || ''Kleur'' ||  {{{white}}} voor lijnen en knopen, {{{#c0c0c0}}} voor gebieden (JOSM voorkeur voor kleuren "{{{text}}}" en "{{{areatext}}}") ||
+|| {{{text-opacity}}} || Hoe transparant de tekst is || ''Transparantie'' ||  1.0  ||
+|| {{{text-offset-x}}} || Verplaatst de tekst horizontaal, (niet ondersteund voor tekst langs de lijn) || ''Getal'' ||  0  ||
+|| {{{text-offset-y}}} (mag ook worden geschreven als {{{text-offset}}})  || Verplaatst de tekst verticaal, positieve waarden verplaatsen de tekst naar boven  || ''Getal'' ||  0  ||
+|| {{{text-halo-radius}}} || Grootte van der and van de tekstachtergrond (om de tekst zichtbaar te maken op een achtergrond met soortgelijke kleur) || ''Getal'' ||  -  ||
+|| {{{text-halo-color}}} || Kleur van de teksthalo || ''Kleur'' ||  aanvulling op de tekstkleur  ||
+|| {{{text-halo-opacity}}} || Transparantie voor de teksthalo || ''Transparantie'' ||  1.0  ||
+|| {{{font-family}}} || Familie van lettertype || ''Tekenreeks'' ||  "Helvetica"[[br]](JOSM voorkeur "mappaint.font")  ||
+|| {{{font-size}}} || grootte lettertype || ''Getal'' ||  8[[br]](JOSM voorkeur "mappaint.fontsize")  ||
+|| {{{font-weight}}} || vet of niet || {{{bold}}}, {{{normal}}} ||  {{{normal}}}  ||
+|| {{{font-style}}} || cursief of niet || {{{italic}}}, {{{normal}}} ||  {{{normal}}}  ||
+
+'' '''Breedte''' ''
+ - 14.0 (elk positief getal)
+ - {{{default}}} (gebruik de standaard lijnbreedte van JOSM, die 2 is, mar mag worden geconfigureerd) 
+ - {{{thinnest}}} (tekent de lijn zo dun als mogelijk is) 
+ - +3 (met teken + er voor) voegt de hoeveelheid toe aan de breedte op de standaard laag. Dit is alleen van toepassing voor stijlen die niet op de standaard laag liggen, bijv. accenten. Een andere manier om dit te schrijven zou zijn {{{prop("width","default")+3}}}. Voor {{{casing-width}}} verwijst dit naar de waarde {{{width}}} op dezelfde laag.
+
+'' '''Afbeelding''' ''
+ Ziee [wiki:/Nl:Help/Styles/Images].
+
+'' '''Kleur''' ''
+ * benoemde kleur die kan worden gevonden in [http://www.w3.org/TR/css3-color/#svg-color deze] lijst
+ * HTML-stijl: '''{{{#RRGGBB}}}''', '''{{{#RGB}}}''', '''{{{#RRGGBBAA}}}'''
+ * '''{{{rgb(/*r*/, /*g*/, /*b*/)}}}''' - Waarde RGD met argumenten van 0.0 tot en met 1.0
+ * '''{{{rgba(/*r*/, /*g*/, /*b*/, /*alpha*/)}}}''' - Waarde RGB met alfa
+ * '''{{{hsb_color(/*hue*/, /*saturation*/, /*brightness*/)}}}''' - kleur uit de kleurruimte HSB
+
+'' '''Transparantie''' ''
+ * van 0.0 (transparant) tot en met 1.0 (ondoorzichtig)
+
+'' '''Tekenreeks''' ''
+ * elk reeks van tekens, tussen anahalingstekens, bijv. {{{"images/fill.png"}}}. Als de tkeenreeks een identificatie is, zijn aanhalingstekens optioneel. (Aanhalingstekens en teken backslash mogen worden geëscaped.)
+
+'' '''Getal''' ''
+ * integer of floating point (in eenvoudige vorm bijv. 0.3). Mag in het algemeen negatief zijn, maar de meesteeigenschappen ondersteunen geen negatieve getallen
+ * heeft een speciale betekenis als u er een teken "+" vóór zet (relatieve breedte)
+
+== Expressies voor eval ==
+
+
+Zie [/doc/org/openstreetmap/josm/gui/mappaint/mapcss/ExpressionFactory.Functions.html#method_summary Javadoc of Functions] voor de up-to-date lijst met functies die worden ondersteund door de implementatie van MapCSS in JOSM.
+
+ +, -, *, /::
+  rekenkundige bewerkingen
+ ||, &&, !::
+  Booleaanse bewerkingen
+ <, >, <=, >=, ==::
+  vergelijkinsoperatoren
+ asin, atan, atan2, ceil, cos, cosh, exp, floor, log, max, min, random, round, signum, sin, sinh, sqrt, tan, tanh::
+  in de gebruikelijke betekenis, [http://download.oracle.com/javase/7/docs/api/java/lang/Math.html details]
+ cond(b, fst, snd)::
+ b ? fst : snd::
+  if ('''b''') then '''fst''' else '''snd'''
+ list(a, b, ...)::
+  maak een lijst met waarden, bijv. voor de eigenschap {{{dashes}}}
+ get(lst, n)::
+  haal het ''n''e element van de lijst ''lst'' op (tellen begint bij 0) [''sinds 5699'']
+ split(sep, str)::
+  splits de tkeenreeks ''str'' op die punten waar de scheidingsreeks ''sep'' voorkomt, geeft een lijst terug [''sinds 5699'']
+ prop(''p_name'')::
+  waarde van de eigenschap ''p_name'' van de huidige laag, bijv. prop({{{"width"}}})
+ prop(''p_name'', ''layer_name'')::
+  eigenschap van de laag ''layer_name''
+ is_prop_set(''p_name'')::
+  true, als de eigenschap ''p_name'' is ingesteld voor de huidige laag
+ is_prop_set(''p_name'', ''layer_name'')::
+  true, als de eigenschap ''p_name'' is ingesteld voor de laag ''layer_name''
+ tag(''key_name'')::
+  haal de waarde van de sleutel ''key_name'' op uit het bevraagde object
+ parent_tag(''key_name'')::
+  haal de waarde van de sleutel ''key_name'' op uit de ouder van het object
+ parent_tags(''key_name'')::
+  geeft alle waarden van de ouders terug voor de sleutel ''key_name'' als een lijst gesorteerd in een natuurlijke volgorde [''sinds 8775'']
+ has_tag_key(''key_name'')::
+  true, als het object een tag heeft met de opgegeven sleutel
+ rgb(''r'', ''g'', ''b'')::
+  maak kleurwaarde (argumenten van 0.0 tot en met 1.0)
+ hsb_color(''h'', ''s'', ''b'')::
+  maak kleur uit hue, saturation en brightness (argumenten van 0.0 tot en met 1.0) [''sinds 6899'']
+ red(''clr''), green(''clr''), blue(''clr'')::
+  haal de waarde van de kleurkanelen op in het kleurmodel RGB
+ alpha(''clr'')::
+  haal de waarde Alfa op van de opgegeven kleur [''sinds 6749'']
+ length(''str'')::
+  lengte van een tekenreeks
+ count(''lst'')::
+  lengte van een lijst, d.i. telt zijn elementen [''sinds 7162'']
+ length(''lst'')::
+  lengte van een lijst [''sinds 5699''] – vervallen ''sinds 7162''
+ any(obj1, obj2, ...)::
+  geeft het eerste object teruf dat niet null is (vroeger coalesce, [''sinds 7164''])
+ concat(''str1'', ''str2'', ...)::
+  voeg de tekenreeksen samen tot één
+ join(''sep'', ''str1'', ''str2'', ...)::
+  voeg de tekenreeksen samen, met ''sep'' als scheidingsteken [''sinds 6737'']
+ join_list(''sep'', ''list_name'')::
+   voeg de elementen van de lijst ''list_name'' samen tot één tekenreeks, gescheiden door het scheidingsteken ''sep'' [''sinds 8775'']
+ JOSM_search("...")::
+  true, als zoekactie van JOSM van toepassing is op het object
+ tr(str, arg0, arg1, ...)::
+  vertaal vanuit het Engels naar de huidige taal (alleen voor tekenreeksennin de gebruikersinterface van JOSM) [''sinds 6506'']
+ regexp_test(regexp, string)::
+  test of ''string'' overeenkomt met het patroon van ''regexp'' [''sinds 5699'']
+ regexp_test(regexp, string, flags)::
+  test of ''string'' overeenkomt met het patroon van ''regexp''; flags is een tekenreeks die kan bevatten "i" (hoofdletter ongevoelig), "m" (multiregel) en "s" ("dot all") [''sinds 5699'']
+ regexp_match(regexp, string)::
+  probeert ''string'' overeen te laten komen met het patroon van ''regexp''. Geeft een lijst met gevangen groepen terug bij succes. Het eerste element (index 0) is de volledige overeenkomst, d.i. ''string''). Verdere elementen corresponderen met de gedeelten tussen haakjes van de reguliere expressie. [''sinds 5701'']
+ regexp_match(regexp, string, flags)::
+  probeert ''string'' overeen te laten komen met het patroon van ''regexp''. Geeft een lijst met gevangen groepen terug bij succes. Het eerste element (index 0) is de volledige overeenkomst, d.i. ''string''). Verdere elementen corresponderen met de gedeelten tussen haakjes van de reguliere expressie. Flags is een tekenreeks die kan bevatten "i" (hoofdletter ongevoelig), "m" (multiregel) en "s" ("dot all") [''sinds 5701'']
+ substring(str, idx)::
+  geef de subtekenreeks ''str'' terug, beginnend op de index ''idx'' (0-index) [''sinds 6534'']
+ substring(str, start, end)::
+  geef de subtekenreeks ''str'' terug, beginnend op de index ''start'' (inclusief) tot en met ''end'' (exclusief) (0-index) [''sinds 6534'']
+ replace(string, old, new)::
+   vervangt elke instantie van de subtekenreeks ''old'' in de tekenreeks ''string'' door de tekst ''new'' 
+ osm_id()::
+  geeft de ID van OSM terug voor het huidige object [''sinds 5699'']
+ URL_encode(str)::
+  [https://en.wikipedia.org/wiki/Percent-encoding percentage coderen] van een tekenreeks. kan nuttig zijn voor gegevens-URL's [''sinds 6805'']
+ XML_encode(str)::
+  escape speciale tekens in XML. Bijv. {{{<}}} wordt {{{&lt;}}}, andere speciale tekens: {{{>}}}, {{{"}}}, {{{'}}}, {{{&}}}, {{{\n}}}, {{{\t}}} en {{{\r}}} [''sinds 6809'']
+ CRC32_checksum(''str'')::
+  bereken de controlesom CRC32 van een tekenreeks (resultaat is een geheel getal tussen 0 tot en met 2^32^-1) [''sinds 6908'']
+ is_right_hand_traffic() [''sinds 7193'']::
+  controleer of er links- of rechtsrijdend verkeer is op de huidige locatie.
+ number_of_tags() [''sinds 7237'']::
+  gefet het aantal tags terug voor het huidige object van OSM
+ print(o) [''sinds 7237'']::
+  drukt een weergave van de tekenreeks `o` af naar de opdrachtregel (voor debuggen)
+ println(o) [''sinds 7237'']::
+  drukt een weergave van de tekenreeks `o` af naar de opdrachtregel, gevolgd door een neiuwe regel (voor debuggen)
+ JOSM_pref(''key'', ''default'') [''sinds 7238, met beperkingen sinds 3856'']::
+  haal de waarde op uit de uitgebreide voorkeuren van JOSM. Op deze manier kunt u de gebruiker bepaalde opties bieden en de stijl aan te passen te maken. Het werkt met tekenreeksen, getallen, kleuren en Booleaanse waarden. [[br]][Deze functie bestaat sinds versie 3856, maar met enkele beperkingen. `JOSM_pref` geeft altijd een tekenreeks terug, maar in versie 7237 en eerder, werkte de automatische conversie van de tekenreeks naar Booleaanse waarde en kleur niet. U kunt de volgende workarounds voor Booleaanse waarden en kleuren gebruiken in versie 7237 en eerder: `cond(JOSM_pref("myprefkey", "true")="true", "X", "O")` en `html2color(JOSM_pref("mycolor", "#FF345611"))`. Deze expliciete conversies zouden niet langer nodig behoeven te zijn in versie 7238 en later. Automatische conversie naar een getal werkt in elke versie.]
+ setting() [''sinds 7450'']::
+  een [[wiki:/Nl:Help/Styles/MapCSSImplementation#Stylesettings instelling voor stijl]] gebruiken
+ degree_to_radians() [''sinds 8260'']::
+  geeft een in graden opgegeven richting terug in radialen
+ cardinal_to_radians() [''sinds 8260'']::
+  geeft een cardinale richting terug in radialen
+ waylength() [''sinds 8253'']::
+  gefet d elengte van de weg in meters terug
+ areasize() [''sinds 8253'']::
+  geeft het gebied van een gesloten weg terug in vierkante meters
+  
+
+
+=== Voorbeelden ===
+
+* symnool van een cirkel voor huisnummer waarvan de grootte afhankelijk is van het aantal cijfers
+{{{
+#!css
+node[addr:housenumber] { 
+    symbol-shape: circle; 
+    symbol-size: eval((min(length(tag("addr:housenumber")), 3) * 5) + 3); 
+    symbol-fill-color: #B0E0E6; 
+
+    text: "addr:housenumber"; 
+    text-anchor-horizontal: center; 
+    text-anchor-vertical: center; 
+    text-offset-x: -1; 
+    text-offset-y: -1; }
+    
+node[addr:housenumber]::hn_casing { 
+    z-index: -100; 
+    symbol-shape: circle; 
+    symbol-size: +2; 
+    symbol-fill-color: blue; 
+}
+}}}
+* kleuren inverteren
+{{{
+#!css
+*::* {
+    color: eval(rgb(1 - red(prop(color)), 1 - green(prop(color)), 1 - blue(prop(color))));
+    fill-color: eval(rgb(1 - red(prop(fill-color)), 1 - green(prop(fill-color)), 1 - blue(prop(fill-color))));
+}
+}}}
+* willekeurige dingen
+{{{
+#!css
+way {
+    width: eval(random() * 20);
+    color: eval(rgb(random(), random(), random()));
+}
+}}}
+
+* regexp die overeenkomt met voorbeeld: wijzig "nameXXXsubname" naar "name::subname"
+{{{
+#!css
+*[name=~/.+XXX.+/] 
+{
+    _match: regexp_match("(.+?)XXX(.+)", tag("name"));
+    text: concat(get(prop("_match"),1), "::", get(prop("_match"),2));
+}
+}}}
+
+* kleur gebouwen in verschillende kleuren, afhankelijk van de straat in de tags address
+{{{
+#!css
+area[building][addr:street] {
+    fill-color: hsb_color(CRC32_checksum(tag("addr:street"))/4294967296.0, 0.9, 0.7);
+    fill-opacity: 0.8;
+}
+}}}
+
+
+== Opmerkingen over compatibiliteit ==
+=== MapCSS 0.2 ===
+
+==== Grammatica ====
+
+ * {{{way[oneway=yes]}}} is geen tovenarij, u mag in plaats daarvan {{{way[oneway?]}}} gebruiken
+ * geen {{{@import}}}
+ * JOSM vereist niet dat {{{eval(...)}}} expressies omsluit, maar voor compatibiliteit met andere implementaties van MapCSS zou u het uit moeten schrijven
+
+==== Eigenschappen ====
+Op dit moment ondersteunt JOSM de volgende eigenschapen ''niet'': 
+ line: ::
+  {{{image}}}
+ label: ::
+  {{{font-variant, text-decoration, text-transform, max-width}}}
+ shield: ::
+  niet ondersteund
+
+=== Halcyon (Potlatch 2) ===
+
+ * Tekstlabel wordt geplaatst in het midden van het pictogram. Plaats voor compatibiliteit met Halcyon
+{{{
+#!css
+node { text-anchor-vertical: center; text-anchor-horizontal: center; }
+}}}
+ aan het begin van uw srijlblad.
+ * standard  is de z-index in Halcyon 5, maar het is 0 in JOSM
+ * '''{{{image: circle;}}}''' correspondeert met '''{{{symbol-shape: circle;}}}'''
+
+=== Kothic ===
+
+ * Kothic heeft ondersteuning voor eval, die waarschijnlijk afwijkt van de eval in JOSM.
+ * Kothic begrijpt eenheden, terwijl JOSM altijd rekent in pixels.
+ * De mogelijkheden voor uittrekken zijn niet beschikbaar in JOSM
+
+=== Ceyx ===
+
+ * lijkt te hebben {{{[tunnel=1]}}} in plaats van {{{[tunnel=yes]}}} (Halcyon) of {{{[tunnel?]}}} (JOSM)
+
+== Zie ook ==
+ * [wiki:/Nl:Help/Validator/MapCSSTagChecker MapCSSTagChecker]
+ * [wiki:/Nl:Styles Stijlen]