Changes between Version 11 and Version 12 of Nl:Help/Styles/MapCSSImplementation


Ignore:
Timestamp:
2016-08-22T18:33:58+02:00 (9 years ago)
Author:
DiGro
Comment:

adjusted to revision 119

Legend:

Unmodified
Added
Removed
Modified

  • Nl:Help/Styles/MapCSSImplementation

    v11 v12  
    1 [[TranslatedPages(revision=116)]]
     1[[TranslatedPages(revision=119)]]
    22[[PageOutline(1-10,Inhoud)]]
    33Deze pagina documenteert details over implementatie van [osmwiki:MapCSS/0.2 MapCSS] in JOSM.
     4
     5== Waar het in JOSM wordt gebruikt ==
     6(stub)
     7* [wiki;/Nl:Help/Action/Search dialoogvenster Zoeken]
     8* [[Extend JOSM#Customstylesandpublication]]
     9* [[Extend JOSM#Customtagcheckerrules]]
    410
    511== Algemene structuur ==
    … …  
    802808    /* ... */
    803809}
    804 }}}
    805 
    806 == Media-query's [''sinds 6970'']  (vervallen) ==
    807 
    808 {{{#!td style="background-color: #faa"
    809 Opmerking: media-query's zijn vervallen. U zou in plaats daarvan @supports-regels moeten gebruiken (zie boven).
    810 }}}
    811 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:
    812 {{{
    813 #!css
    814 @media (min-josm-version: 9789) {
    815     way[highway] {
    816         width: 4;
    817         color: orange;
    818     }
    819     /* fijne nieuwe mogelijkheden */
    820     /* ... */
    821 }
    822 
    823 @media (max-josm-version: 9788) {
    824     way[highway] {
    825         width: 4;
    826         color: blue;
    827     }
    828     /* modus om op terug te vallen, meer eenvoudige objecten gebruiken */
    829     /* ... */
    830 }
    831 }}}
    832 
    833 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:
    834 
    835 {{{#!th
    836 '''Voorwaarde media'''
    837 }}}
    838 {{{#!th
    839 '''Beschrijving'''
    840 }}}
    841 |-
    842 {{{#!td
    843 (min-josm-version: ''<getal>'')
    844 }}}
    845 {{{#!td
    846 Alleen gedeelte {{{@media}}} opnemen als de huidige versie van JOSM groter is dan of gelijk is aan het gespecificeerde getal.
    847 }}}
    848 |-
    849 {{{#!td
    850 (max-josm-version: ''<getal>'')
    851 }}}
    852 {{{#!td
    853 Alleen gedeelte {{{@media}}} opnemen als de huidige versie van JOSM kleiner is dan of gelijk is aan het gespecificeerde getal.
    854 }}}
    855 |-
    856 {{{#!td
    857 (user-agent: ''<tekenreeks>'')
    858 }}}
    859 {{{#!td
    860 Alleen gedeelte {{{@media}}} opnemen als de naam van de bewerker / renderer overeenkomt met de opgegeven tekenreeks. In JOSM is de enige geaccepteerde waardee {{{josm}}}.
    861 }}}
    862 
    863 Voorwaarden mogen worden gecombineerd met {{{and}}}:
    864 
    865 {{{
    866 #!css
    867 @media (min-josm-version: 6970) and (max-josm-version: 7014) {
    868  /* alleen voor JOSM-versies 6970 tot en met 7014 */
    869 }
    870 }}}
    871 
    872 Meerdere gecombineerde voorwaarden mogen worden verbonden met een komma (logische ''or''):
    873 
    874 {{{
    875 #!css
    876 @media (min-josm-version: 6970) and (max-josm-version: 7014), (user-agent: myEditor) {
    877   /* voor JOSM-versies 6970 tot en met 7014 en voor de bewerker genaamd "myEditor" */
    878 }
    879 }}}
    880 
    881 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:
    882 
    883 {{{
    884 #!css
    885 meta {
    886     min-josm-version: "6970"; /* Deze stijl gebruik media-query's */
    887     /* ... */
    888 }
    889 }}}
    890 
    891 
    892 {{{#!comment
    893 Er is ook het sleutelwoord {{{not}}} (bekijk het gekoppelde CSS-doc voor details).
    894 Dit is heímplementeerd, maar waarschijnlijk niet erg nuttig. Het staat u vrij documentatie toe te voegen.
    895 }}}
    896810
    897811== Instellingen voor stijl ==
    … …  
    926840|| {{{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  ||
    927841|| {{{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 ||
    928 
    929 
    930842
    931843=== Stijlen voor pictogrammen en symbolen ===
    … …  
    951863
    952864Vertrouw 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.
    953 
    954 
    955 
    956 
    957865
    958866=== Lijnstijlen ===
    … …  
    996904|| {{{text-...}}}, {{{font-...}}} ||||||  Algemene eigenschappen tekst & lettertype  ||
    997905Vereiste eigenschappen om een stijl voor een gebied te maken: {{{fill-color}}} of {{{fill-image}}}
    998 
    999906
    1000907=== Eigenschappen voor tekst & lettertype ===
    … …  
    11831090 areasize() [''sinds 8253'']::
    11841091  geeft het gebied van een gesloten weg terug in vierkante meters
    1185  
    1186 
    11871092
    11881093=== Voorbeelden ===
    … …  
    12851190 * lijkt te hebben {{{[tunnel=1]}}} in plaats van {{{[tunnel=yes]}}} (Halcyon) of {{{[tunnel?]}}} (JOSM)
    12861191
    1287 == Zie ook ==
    1288  * [wiki:/Nl:Help/Validator/MapCSSTagChecker MapCSSTagChecker]
    1289  * [wiki:/Nl:Styles Stijlen]
     1192}}}
     1193
     1194== Media-query's [''sinds 6970'']  (vervallen) ==
     1195
     1196{{{#!td style="background-color: #faa"
     1197Opmerking: media-query's zijn vervallen. U zou in plaats daarvan @supports-regels moeten gebruiken (zie boven).
     1198}}}
     1199Media-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:
     1200{{{
     1201#!css
     1202@media (min-josm-version: 9789) {
     1203    way[highway] {
     1204        width: 4;
     1205        color: orange;
     1206    }
     1207    /* fijne nieuwe mogelijkheden */
     1208    /* ... */
     1209}
     1210
     1211@media (max-josm-version: 9788) {
     1212    way[highway] {
     1213        width: 4;
     1214        color: blue;
     1215    }
     1216    /* modus om op terug te vallen, meer eenvoudige objecten gebruiken */
     1217    /* ... */
     1218}
     1219}}}
     1220
     1221De syntaxis komt nagenoeg overeen met de officiële [http://www.w3.org/TR/css3-mediaqueries/#syntax syntaxis voor CSS]. De volgende voorwaarden worden ondersteund:
     1222
     1223{{{#!th
     1224'''Voorwaarde media'''
     1225}}}
     1226{{{#!th
     1227'''Beschrijving'''
     1228}}}
     1229|-
     1230{{{#!td
     1231(min-josm-version: ''<getal>'')
     1232}}}
     1233{{{#!td
     1234Alleen gedeelte {{{@media}}} opnemen als de huidige versie van JOSM groter is dan of gelijk is aan het gespecificeerde getal.
     1235}}}
     1236|-
     1237{{{#!td
     1238(max-josm-version: ''<getal>'')
     1239}}}
     1240{{{#!td
     1241Alleen gedeelte {{{@media}}} opnemen als de huidige versie van JOSM kleiner is dan of gelijk is aan het gespecificeerde getal.
     1242}}}
     1243|-
     1244{{{#!td
     1245(user-agent: ''<tekenreeks>'')
     1246}}}
     1247{{{#!td
     1248Alleen gedeelte {{{@media}}} opnemen als de naam van de bewerker / renderer overeenkomt met de opgegeven tekenreeks. In JOSM is de enige geaccepteerde waardee {{{josm}}}.
     1249}}}
     1250
     1251Voorwaarden mogen worden gecombineerd met {{{and}}}:
     1252
     1253{{{
     1254#!css
     1255@media (min-josm-version: 6970) and (max-josm-version: 7014) {
     1256 /* alleen voor JOSM-versies 6970 tot en met 7014 */
     1257}
     1258}}}
     1259
     1260Meerdere gecombineerde voorwaarden mogen worden verbonden met een komma (logische ''or''):
     1261
     1262{{{
     1263#!css
     1264@media (min-josm-version: 6970) and (max-josm-version: 7014), (user-agent: myEditor) {
     1265  /* voor JOSM-versies 6970 tot en met 7014 en voor de bewerker genaamd "myEditor" */
     1266}
     1267}}}
     1268
     1269Omdat 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:
     1270
     1271{{{
     1272#!css
     1273meta {
     1274    min-josm-version: "6970"; /* Deze stijl gebruik media-query's */
     1275    /* ... */
     1276}
     1277}}}
     1278{{{#!comment
     1279Er is ook het sleutelwoord {{{not}}} (bekijk hte gekoppelde CSS-doc voor details).
     1280Dit is geïmplementeerd, maar waarschijnlijk niet erg nuttig. Gaarne documentatie toevoegen.