Passa al contenuto principale

Stile della mappa

Un file di stile MapCSS contiene regole applicate a ogni oggetto dall'alto verso il basso.

Ad esempio, questo stile:

node[natural=tree] {
    icon-image: "tree.svg";
}

mostra l'immagine tree.svg sui punti il cui tag natural ha valore tree.

Ogni regola ha due parti: il filtro node[natural=tree] e i parametri di disegno icon-image: tree.svg;. Il filtro determina a quali oggetti applicare i parametri.

Le regole possono essere annidate e i parametri definiti a ogni livello.

|z16- {
    icon-scale: 0.50;
    icon-tint: @color_icon_tint;

    [amenity=bicycle_parking] {
        icon-image: "bike_parking.svg";
    }
    [amenity=bicycle_rental] {
        icon-image: "bike_rental.svg";
    }
    [amenity=bicycle_repair_station] {
        icon-image: "bike_service.svg";
    }
}

Le regole annidate mantengono lo stile conciso e ordinato: i parametri comuni vengono definiti una volta sola invece di ripeterli in più blocchi.

Questa documentazione descrive il dialetto MapCSS usato da Guru Maps. Alcuni parametri del linguaggio originale non sono implementati, ma sono supportate macro di pre-elaborazione, regole annidate e nuove funzioni per i calcoli. Lo stile di Guru Maps è disponibile nel repository.

Filtri​

Consideriamo un filtro complesso:

node,area|z14-[boundary=forest_compartment][ref]

È composto da:

  1. Filtro del tipo node,area: usa node per i punti, line per le linee e area per i poligoni. Separa più tipi con virgole oppure usa * quando il tipo non è importante. canvas seleziona lo sfondo della mappa.
  2. Filtro di zoom z14-: indica i livelli ai quali si applica la regola. Puoi specificare solo il minimo, ad esempio z8-, solo il massimo z-9, un singolo livello z12 oppure un intervallo come z3-9. Gli estremi di un intervallo sono inclusi: z3-9 si applica dai livelli 3 a 9.
  3. Filtri dei tag [boundary=forest_compartment][ref]: selezionano gli oggetti con tag boundary uguale a forest_compartment e qualsiasi valore in ref. Per selezionare oggetti privi del tag ref, usa [!ref].

Ogni parte è facoltativa. Un filtro di zoom può stare da solo, come |z16- nell'esempio precedente.

Filtri dei tag​

FiltroSeleziona gli oggetti in cui
[ref]il tag ref è presente
[!ref]il tag ref manca
[highway=primary]il valore è uguale a primary
[highway!=primary]il valore non è primary
[population>100000]il valore è maggiore; <, >= e <= funzionano allo stesso modo
[ele%100]il valore è un multiplo di 100
[ref^=E]il valore inizia con E
[name$=Street]il valore finisce con Street
[name*=Park]il valore contiene Park
[cuisine~=pizza]pizza è uno dei valori separati da ;, come in pizza;burger

I confronti >, <, >= e <= confrontano numeri quando entrambi i valori sono numeri, altrimenti testo.

Racchiudi il valore tra virgolette doppie se contiene un apostrofo, delle virgolette o ], oppure se inizia o finisce con uno spazio:

[name="McDonald's"],
[ref^="B "] {
    icon-image: "logo.svg";
}

Un valore tra virgolette non può contenere {, }, ;, @ né //.

Filtri di raggruppamento​

Puoi separare più filtri con virgole:

node,area|z14-[boundary=forest_compartment][ref],
node,area|z14-[boundary=forestry_compartment][ref]

In questo esempio i parametri comuni possono essere spostati a un livello superiore:

node,area|z14-[ref] {
    [boundary=forest_compartment],
    [boundary=forestry_compartment] {

    }
}

Per riunire più regole in un gruppo, racchiudi i filtri tra parentesi ( e ) senza aprire ancora il blocco:

node,area|z14-[ref](
    [boundary=forest_compartment],
    [boundary=forestry_compartment]) {
}

Un filtro di zoom può riferirsi a un intero gruppo:

|z11-([highway=trunk], [highway=primary]) {
    shield-image: "shield.svg";
}

Filtri delle relazioni​

relation[...] seleziona gli oggetti che appartengono a una relazione con i tag indicati. Ad esempio, le vie dei percorsi escursionistici:

relation[type=route][route=hiking] {
    line|z9- {
        color: #0000ff80;
        width: 2pt;
    }
}

La funzione relationTag legge i tag di quella relazione, mentre per-relation disegna una via una volta per ciascuna delle sue relazioni.

Macro di pre-elaborazione​

Il preprocessore prepara lo stile per l'analisi: sostituisce valori e attiva o disattiva blocchi secondo le impostazioni.

Macro di sostituzione​

@import​

Inserisce il contenuto del file indicato:

@import "polygons.mapcss";

@{name}​

Inserisce il valore di una macro nel punto in cui viene usata:

// Definisce un colore
@color_ground: #EAE3D3;

// Poi lo usa così
canvas
{
    fill-color: @color_ground;
}

Una macro inserisce il proprio testo così com'è, quindi può contenere una parte di espressione:

@route_band_width: zlinear(13, 5pt, 7pt, 9pt, 11pt);

line|z13- {
    outline-width: eval(@route_band_width);
}

Una macro il cui valore inizia con eval( viene calcolata una sola volta, al caricamento dello stile.

Condizioni​

@if​

Controlla un parametro e include o esclude un blocco dallo stile:

@if Theme == Dark
    @import "colors_dark.mapcss";
@else // Colori predefiniti
    @import "colors.mapcss";
@endif

Una condizione può confrontare un parametro con ==, !=, <, >, <= o >=. Un valore è una sola parola composta da lettere, cifre e _. Un parametro senza confronto verifica che sia attivo; ! verifica che sia disattivo:

@if Food
    // mostrato quando l'interruttore Ristoranti e caffetterie è attivo
@endif
@if !Food
    // mostrato quando è disattivo
@endif

Guru Maps usa questi parametri di pre-elaborazione:

  • Theme {Light, Dark}: tema attuale dell'app. Nel tema scuro il bianco puro #FFFFFF nelle icone diventa grigio scuro; usa #FEFEFE per un bianco che deve restare bianco.
  • Style {City, Outdoor}: stile attuale della mappa;
  • SubStyle {Hike, Bike, Ski, Car}:
    • Hike, Bike e Ski sono impostati dalle varianti Outdoor della mappa per escursionismo, bicicletta e sci;
    • Car è impostato durante la navigazione in auto, con qualsiasi stile di mappa.
  • Gli interruttori di Elementi della mappa nelle impostazioni: AllShops, Bar, Beauty, BuildingName, CityService, Culture, Education, Entertaiment, Financial, Food, Hotel, Medical, PistesAndLifts, Postal, PublicTransport, Railway, Shop, Sport. Un interruttore vale 1 quando è attivo e 0 quando è disattivo. Durante la navigazione in auto tutti gli interruttori tranne BuildingName sono disattivati.

@else​

Definisce il blocco eseguito quando la prima condizione è falsa.

@elif​

Contiene una condizione valutata se quelle precedenti non sono state soddisfatte.

@endif​

Chiude il blocco della condizione attuale.

Commenti​

// commenta il resto della riga; /* e */ racchiudono un commento su più righe.

Parametri di disegno​

Questi parametri controllano come vengono disegnati gli oggetti sulla mappa.

Valori dei parametri​

Larghezza​

Lo spessore di una linea, width, può essere espresso in pixel 1px, punti 2pt, metri 3m o con un'espressione come eval( zlinear( 13, 1px,1pt,max(2pt, 4m)) );. Consulta Espressioni. Scrivi sempre l'unità: un numero senza unità è misurato in unità interne della mappa.

Colore​

Usa #RGB, #RRGGBB, #RRGGBBAA oppure un nome dall'elenco dei colori CSS.

fill-color, casing-color, dashes-color, text-color e font-stroke-color accettano solo un colore. color, icon-tint, outline-color, shield-color e shield-text-color accettano anche un'espressione.

Testo e virgolette​

Le virgolette singole e doppie hanno lo stesso significato. Non esistono sequenze di escape, quindi un testo non può contenere la virgoletta con cui è racchiuso: scrivi "McDonald's" tra virgolette doppie e 'say "hi"' tra virgolette singole. Gli esempi di questa pagina usano le virgolette doppie.

All'interno di eval() metti tra virgolette ogni testo. Il nome di un tag composto solo da lettere latine e cifre funziona anche senza, quindi tag(name) equivale a tag("name"), ma un nome con : o _ richiede le virgolette: tag("addr:street"). I numeri con unità, come 2pt, e i colori, come #808080, vanno senza virgolette. In questo esempio la tavolozza è un unico testo, relationTag("colour") legge un tag e #808080 è un colore:

color: eval(mapColor("red #E53935, green #43A047, blue #1E88E5", relationTag("colour"), #808080));

Fuori da eval() le virgolette sono facoltative: il valore di un parametro è il testo fino a ;, quindi icon-image: tree.svg; e icon-image: "tree.svg"; sono equivalenti. Gli spazi all'inizio e alla fine di un valore vengono eliminati, anche tra virgolette. @import funziona allo stesso modo.

Nei filtri dei tag, metti tra virgolette un valore che contiene un apostrofo, una virgoletta o ], oppure che inizia o finisce con uno spazio: [name="McDonald's"], [ref^="B "]. I nomi dei tag nei filtri e i valori nelle condizioni @if non vanno mai tra virgolette.

Anche tra virgolette, un valore non può contenere ;, { o }, che terminano il parametro o aprono un blocco, //, che avvia un commento, né @, che avvia una macro.

Presto

La prossima versione di Guru Maps elimina questi limiti. Una barra rovesciata farà da escape per le virgolette (\", \', \\), ;, {, }, // e @ diventeranno caratteri normali tra virgolette, e un valore tra virgolette manterrà i suoi spazi.

Numeri e interruttori​

text-priority, icon-scale, icon-offset-x, icon-offset-y e z-index accettano un numero semplice, non un'espressione. Gli interruttori come text-allow-overlap accettano true o false.

Ordine di disegno​

layer​

Il numero della proprietà layer separa i diversi livelli di rendering della mappa.

// Per ogni oggetto con il tag 'layer', imposta la proprietà 'layer' sul valore del tag
*|z9-[layer] {
    layer: eval(tag("layer"));
}

z-index​

z-index stabilisce l'ordine di disegno degli oggetti dello stesso tipo all'interno di un livello.

area|z10-[natural=wood] {
    z-index: -3;
    fill-color: @color_wood;
}

area[natural=oceanwater] {
    z-index: -2;
    fill-color: @color_water;
}

Parametri dei poligoni​

fill-color​

Colore di riempimento del poligono.

area|z5-[natural=water] {
    fill-color: @color_water;
}

fill-image​

Immagine di riempimento del poligono.

// Immagine di riempimento di un'area militare visualizzata sopra gli altri oggetti
area|z11- {
    [landuse=military],
    [military=danger_area] {
        z-index: 2;
        fill-image:"forbiddenArea.png";
    }
}

fill-image supporta stili incorporati con dati base64.

// Equivale ad arrow.svg
fill-image: eval(data("PHN2ZyB3aWR0aD0iMTI4IiBoZWlnaHQ9IjgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTI2IDNoMTBWMWw1IDMtNSAzVjVIMjZ6IiBmaWxsPSIjMDAwIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIG9wYWNpdHk9Ii40Ii8+PC9zdmc+Cg=="));

color e width per i poligoni​

Colore e larghezza del bordo.

area|z15-[building] {
    z-index: 3;
    width: 1px;
    color: @color_landuse_residential_stroke;
}

Parametri delle linee​

color e width per le linee​

Colore e larghezza della linea.

line|z13-[natural=tree_row] {
    width: 3pt;
    color: @color_wood;
    z-index: -10;
}

casing-color e casing-width​

Colore e larghezza del contorno di una linea, usati soprattutto per le strade. Il contorno viene aggiunto su ciascun lato della linea, quindi serve anche width.

line|z8-[highway=motorway],
line|z11-[highway=motorway_link] {
    color: @color_motorway;
    casing-color: @color_motorway_casing;
    casing-width: 0.5pt;
}

dashes​

Lunghezze dei segmenti pieni e vuoti, a turno. Usa fino a 8 numeri con somma inferiore a 64. Ogni numero è la lunghezza di un segmento di linea in punti.

line|z15-[highway=cycleway] {
    dashes: 2,2,2,2;
    dashes-color: @color_cycleway_dashes;
}

dashes-color e dashes-width​

Colore e larghezza dei tratti usati per sentieri, percorsi, scale e confini. I tratti vengono disegnati solo quando sono impostati tutti e tre dashes, dashes-color e dashes-width.

line|z15-[highway=steps] {
    dashes-color: @color_footway_dashes;
    dashes-width: eval( zlinear( 16, 3pt, 4pt ) );
}

linecap​

Forma delle estremità della linea. Valori possibili: none, square, round.

linejoin​

Forma delle giunzioni. Valori possibili: round, bevel.

outline-color e outline-width​

Una seconda linea disegnata lungo una linea o il bordo di un poligono, ad esempio una fascia traslucida sotto un percorso. A differenza del contorno (casing), non dipende da width: outline-width è la sua larghezza totale.

Un outline traslucido segna un sentiero escursionistico con una fascia larga, e il sentiero resta visibile attraverso di essa:

relation[type=route][route=hiking] {
    line|z13- {
        outline-width: 7pt;
        outline-color: #1E88E570; // blu traslucido
    }
}

offset​

Sposta la linea lateralmente: i valori positivi a sinistra della direzione della via, quelli negativi a destra. Lo spostamento si applica alla linea, al suo contorno, al suo outline e ai tratti. Si usa soprattutto con per-relation, per disegnare più percorsi affiancati sulla stessa via; vedi l'esempio qui sotto.

per-relation​

per-relation: true disegna una via una volta per ciascuna relazione a cui appartiene, con i parametri di quella relazione. Insieme a offset e alla funzione relationSlot, disegna affiancati i percorsi che condividono una via:

relation[type=route][route=subway] {
    line|z11- {
        per-relation: true;
        width: 2pt;
        offset: eval(relationSlot() * 2pt);
        color: eval(mapColor("red #E53935, green #43A047, blue #1E88E5", relationTag("colour"), #808080));
    }
}

Parametri del testo​

text​

Testo disegnato accanto a un punto o centrato su una linea o un poligono.

node,area|z2-8[place=country] {
    text: eval(locTag("name"));
    // Gli altri parametri sono omessi
}

font-weight​

Spessore del carattere. Valori possibili: lighter, light, normal, medium, semibold, bold, bolder.

node,area|z9-[place=town],
node,area|z10-[place=village],
node,area|z12-[place=hamlet] {
    font-weight:light;
    font-size:11;
    font-stroke-width:2px;
    font-stroke-color: @color_label_stroke;
}

font-style​

normal o italic. Per il grassetto usa font-weight.

Sulle mappe i nomi delle acque si compongono tradizionalmente in corsivo, così si distinguono dai nomi dei luoghi:

line|z15-[waterway=river] {
    text: eval(locTag("name"));
    font-style: italic;
    text-color: #0F4F80;
}

font-size​

Dimensione del carattere in punti. La dimensione può cambiare con lo zoom; scrivi numeri semplici in zlinear e il testo cresce gradualmente:

node|z10-[place=city] {
    font-size: eval(zlinear(10, 13, 14, 15));
}

font-stroke-width e font-stroke-color​

Larghezza e colore del contorno del carattere. La larghezza può essere un'espressione.

text-color​

Colore del testo.

node,area|z2-8[place=country] {
    text: eval(locTag("name"));
    text-color: @color_name_text;
    text-priority: 10;
    // Gli altri tag sono omessi
}

text-letter-spacing​

Spazio aggiuntivo tra le lettere, in frazioni della dimensione del carattere: 0.1 aggiunge un decimo della dimensione. Può cambiare con lo zoom tramite zlinear.

Le maiuscole spaziate distinguono i nomi delle regioni da quelli delle città. Con l'aumentare dello zoom le lettere si allontanano e il nome occupa più spazio della sua regione:

node|z6-[place=state] {
    text: eval(uppercase(locTag("name")));
    text-letter-spacing: eval(zlinear(6, 0.1, 0.18, 0.25));
}

text-priority​

Quando più etichette competono per lo stesso spazio, determina quale mostrare per prima.

text-allow-overlap​

Permette alle etichette di sovrapporsi.

text-big-padding​

Riserva il doppio dello spazio intorno al testo. Usalo per centri importanti — città, paesi, quartieri e così via — per evitare che le etichette nascondano la mappa.

Parametri delle icone​

icon-image​

Nome dell'immagine mostrata su un punto o al centro di un poligono.

node,area|z17-[amenity=library] {
    icon-image: "library.svg";
    icon-scale: 0.37;
    icon-tint: @color_icon_tint;
}

icon-image supporta stili incorporati con dati base64.

// Equivale a poi_circle_small.svg
icon-image: eval(data("PHN2ZyB3aWR0aD0iOCIgaGVpZ2h0PSI4IiB2aWV3Qm94PSIwIDAgOCA4IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNNyA0QzcgNS42NTY4NSA1LjY1Njg1IDcgNCA3QzIuMzQzMTUgNyAxIDUuNjU2ODUgMSA0QzEgMi4zNDMxNSAyLjM0MzE1IDEgNCAxQzUuNjU2ODUgMSA3IDIuMzQzMTUgNyA0WiIgZmlsbD0iIzgwODA4MCIvPgo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTggNEM4IDYuMjA5MTQgNi4yMDkxNCA4IDQgOEMxLjc5MDg2IDggMCA2LjIwOTE0IDAgNEMwIDEuNzkwODYgMS43OTA4NiAwIDQgMEM2LjIwOTE0IDAgOCAxLjc5MDg2IDggNFpNNCA3QzUuNjU2ODUgNyA3IDUuNjU2ODUgNyA0QzcgMi4zNDMxNSA1LjY1Njg1IDEgNCAxQzIuMzQzMTUgMSAxIDIuMzQzMTUgMSA0QzEgNS42NTY4NSAyLjM0MzE1IDcgNCA3WiIgZmlsbD0id2hpdGUiLz4KPC9zdmc+Cg=="));

icon-fallback​

Un'immagine più piccola mostrata al posto di icon-image quando l'icona non ha spazio sulla mappa, ad esempio un punto al posto del logo di un negozio. In una strada affollata il luogo resta sulla mappa, e il suo logo compare ingrandendo:

node|z16-[brand:wikidata=Q38076] {
    icon-image: "logo_mcdonalds.svg";
    icon-fallback: "poi_circle_small.svg";
}

icon-scale​

Cambia la scala dell'immagine per mostrarla più grande o più piccola dell'originale.

icon-tint​

icon-tint ricolora un'immagine. #FFF resta bianco; #CCC diventa una versione chiara del colore scelto; #888 corrisponde al colore; #444 ne assume una versione scura; #000 resta nero. I colori sfumano gradualmente tra questi punti.

icon-offset-x e icon-offset-y​

Spostano l'immagine rispetto al punto di ancoraggio. Per impostazione predefinita è centrata sul punto della mappa. Ad esempio, icon-offset-y: 0; allinea la parte inferiore di un'icona a spillo al punto di destinazione. I valori vanno da 0 a 1: 0 rappresenta il bordo inferiore o sinistro, 1 quello superiore o destro.

image-allow-overlap​

Permette alle icone di sovrapporsi.

Parametri degli scudi stradali​

Uno scudo mostra il numero di una strada su una targa lungo la strada. Viene disegnato sulle linee quando sono impostati sia shield-image sia shield-text.

Gli scudi nei colori dei cartelli stradali di un paese permettono di distinguere a colpo d'occhio le strade principali da quelle locali. In Bielorussia, ad esempio, i numeri delle strade principali sono bianchi su rosso, quelli delle strade locali scuri su bianco:

line|z11-[highway=primary][ref] {
    shield-image: "shield.svg";
    shield-text: eval(listItem(tag("ref"), 0)); // il primo numero di "М1;E30"
    shield-color: #005387;
    [ref^=М], [ref^=Р] {
        shield-color: #C1121C;
    }
    [ref^=Н] {
        shield-image: "shield_plate.svg";
        shield-color: #FEFEFE;
    }
}

shield-image​

L'immagine della targa.

shield-text​

Il testo sulla targa, di solito il numero della strada.

shield-color​

Colora l'immagine della targa come icon-tint.

shield-text-color​

Colore del testo. Se manca, il testo è scuro sulle targhe chiare e bianco su quelle scure.

shield-fit​

Come la targa si adatta al testo. stretch (predefinito) allunga la parte centrale dell'immagine fino alla larghezza del testo e mantiene le estremità. fixed mantiene l'immagine com'è disegnata e la allarga solo quando il testo non ci sta; usalo per le targhe con una forma particolare, come i cartelli stradali statunitensi. Per mantenere i colori originali dell'immagine, imposta shield-color: #00000000.

Le strade della California sono numerate in un cerchio per due cifre e in un'ellisse per tre. Il numero segue il prefisso della rete, come in CA 1:

line|z12-[highway=secondary][ref^="CA "] {
    shield-fit: fixed;
    shield-text: eval(listItem(listItem(tag("ref"), 0), 1, " "));
    shield-image: eval(cond(length(listItem(listItem(tag("ref"), 0), 1, " ")) == 3,
        "shield_state_3.svg", "shield_state_2.svg"));
    shield-color: #00000000;
    shield-text-color: #1E1E1E;
}

Parametri dei dettagli​

Usa details-text e details-description per definire nome e descrizione degli oggetti GeoJSON. details-text appare come titolo e details-description come descrizione. Se entrambi sono vuoti, i tocchi sull'oggetto vengono ignorati. I parametri supportano espressioni.

* {
    details-text: eval(tag("name"));
    details-description: eval(tag("description"));
}

details-enabled: false fa sì che i tocchi su un oggetto non facciano nulla: Guru Maps non apre i suoi dettagli. Una relazione con questo parametro, ad esempio un percorso, non compare nemmeno tra i percorsi di una via toccata. Usalo per gli oggetti che non hanno nulla da raccontare:

node|z15-[amenity=hunting_stand] {
    icon-image: "poi_hunting_stand.svg";
    details-enabled: false;
}

Espressioni​

Filtri e parametri di disegno possono dipendere da fattori esterni, essere calcolati con formule o variare secondo lo zoom.

I valori calcolati devono sempre iniziare con eval().

Funzioni​

All'interno puoi usare queste funzioni:

min e max​

Restituiscono il valore minimo o massimo dei parametri. Il numero di parametri non è limitato.

any​

Restituisce il primo valore diverso da null. Accetta un numero qualsiasi di argomenti.

data​

Decodifica una stringa base64. Può essere usata in icon-image e fill-image.

tag​

Restituisce il valore del tag indicato o null se non esiste.

locTag​

Restituisce il valore localizzato di un tag secondo le lingue preferite dell'utente. Ad esempio, se l'elenco contiene inglese, russo e lingua locale, locTag("name") controlla name:en, poi name:ru e infine name, usando la prima corrispondenza. Guru Maps supporta ar, be, cs, da, de, en, es, fr, it, ja, ko, nl, pl, pt, ru, sv, uk e zh. Usa locTag() per queste lingue e chiama esplicitamente tag() per le altre.

relationTag​

Restituisce il valore di un tag della relazione a cui appartiene l'oggetto, ad esempio il colore di un percorso: relationTag("colour"). Con per-relation legge la relazione che si sta disegnando.

relationSlot​

Con per-relation, restituisce la posizione della relazione tra i percorsi disegnati sulla via, centrata su 0: -0.5 e 0.5 per due percorsi, -1, 0 e 1 per tre. Moltiplicala per la larghezza della linea per affiancare i percorsi con offset, come nell'esempio di per-relation.

listItem​

Restituisce un elemento di un elenco, contando da 0. Gli elementi sono separati da ; o dal carattere indicato nel terzo parametro.

shield-text: eval(listItem(tag("ref"), 0));             // "E 50" per "E 50;E 65"
color: eval(listItem(tag("osmc:symbol"), 0, ":"));      // "red" per "red:white:red_bar"

length​

Restituisce il numero di caratteri del testo, ad esempio per scegliere uno scudo più largo per un numero di strada a tre cifre, come nell'esempio di shield-fit.

uppercase, lowercase e capitalize​

Cambia la capitalizzazione del testo. Il secondo parametro facoltativo è una lingua di cui usare le regole, ad esempio uppercase(locTag("name"), "el").

mapColor​

Sceglie un colore da una tavolozza. Il primo parametro è la tavolozza, "name color, name color, ..."; il secondo è il valore da cercare; il terzo, facoltativo, è il risultato quando il valore è vuoto. Un nome di colore della tavolozza restituisce il suo colore; qualsiasi altro colore restituisce il colore più vicino della tavolozza.

color: eval(mapColor("red #E53935, green #43A047, blue #1E88E5", relationTag("colour"), #808080));

formatElevation​

Formatta un'altezza in metri come 1234 m o in piedi, secondo le unità scelte nell'app. Una vetta riporta il nome e l'altezza, oppure solo l'altezza se non ha un nome:

node|z13-[natural=peak] {
    text: eval(cond(locTag("name"),
        cond(tag("ele"), locTag("name") . " " . formatElevation(tag("ele")), locTag("name")),
        formatElevation(tag("ele"))));
}

cond​

Valuta un'espressione logica. Se il primo argomento è vero restituisce il secondo, altrimenti il terzo.

// Controlla addr:housenumber
    text: eval( cond( tag("addr:housenumber"),
    // Se addr:housenumber esiste, concatena la condizione successiva
        tag("addr:housenumber") . cond( any( locTag("name"), tag("addr:housename") ),
            // Se name o addr:housename esiste, racchiudilo tra parentesi
            " (" . any( locTag("name"), tag("addr:housename") ) . ")",
            // Altrimenti usa una stringa vuota
            ""),
    // Se il numero civico non esiste, usa name o addr:housename
    any( locTag("name"), tag("addr:housename") ) ) );

boolean​

Converte il valore in booleano. Se manca o equivale a 0, No, Off o False, senza distinzione tra maiuscole e minuscole, restituisce false; negli altri casi restituisce true.

zlinear​

Cambia gradualmente il valore secondo lo zoom. Il primo parametro è il livello iniziale, seguito dai valori per ogni livello successivo.

line|z13-[highway=residential] {
    width: eval( zlinear( 13, 1px, 1pt, max(2pt, 4m) ) );
    color: @color_small_road;
    linecap: round;
}

Nell'esempio la strada misura 1 pixel al livello 13, 1 punto al 14 e, dal livello 15, il valore maggiore tra 2 punti e 4 metri.

metric​

Converte il parametro numerico in metri.

line|z12-[highway=tertiary] {
    width: eval( zlinear( 12, 1px, 1pt, 1pt, max(3pt, metric(any(tag("lanes"),2)*2)) ));
}

Qui il numero di corsie viene moltiplicato per 2 per ottenere una distanza in metri. max(3pt, metric()) restituisce la larghezza maggiore.

Operatori delle espressioni​

Le espressioni supportano gli operatori matematici +, -, *, /, l'operatore . per concatenare stringhe e l'operatore di uguaglianza == e ~=, che verifica se il testo contiene una sottostringa.