xyz-reduction-dark.yaml

# Author: Geraldine Sarmiento

# cameras:
#     camera1:
#         type: perspective
scene:
    background:
        color: black

global:
    # default order for basemap features
    feature_order: function() { return feature.sort_rank; }
    feature_order_down_1: function() { return feature.sort_rank - 1; }
    building_extrude_height: |
        function () { return feature.height > 16 || $zoom >= 16; }

    # Sign up for a Mapzen API key to enjoy higher rate limits
    # https://mapzen.com/documentation/overview/#developer-accounts-and-api-keys
    sdk_api_key: '3eqm2_bfTNGZ85ar20fVyA'     # set this value to your Mapzen API key

    black_color:                  [0.400,0.400,0.400]

    roads_text_fill:              [0.750,0.750,0.750]
    roads_text_stroke:            [0.149,0.149,0.149]
    
    earth_color: [0.149,0.149,0.149]
    water_color: [0.120,0.120,0.120]

    text_font_family: 'Open Sans'

    #ux/ui
    ux_language: false             # l10n language code, trusting OSM in v0.10 tiles, fixed in v1.0 tiles
    ux_language_fallback: false    # l10n language code, trusting OSM in v0.10 tiles, fixed in v1.0 tiles
    ux_language_text_source: |
        function() {
            // if a ux_langauge has been defined use that, else if there is feature name in the fallback_ux_language then use that, else use the feature's default name in the local language
            return (global.ux_language && feature['name:'+global.ux_language]) || (global.ux_language_fallback && feature['name:'+global.ux_language_fallback]) || feature.name;
        }
    ux_language_text_source_left: |
        function() {
            // if a ux_langauge has been defined use that, else if there is feature name in the fallback_ux_language then use that, else use the feature's default name in the local language
            return (global.ux_language && feature['name:left:'+global.ux_language]) || (global.ux_language_fallback && feature['name:left:'+global.ux_language_fallback]) || feature['name:left'];
        }
    ux_language_text_source_right: |
        function() {
            // if a ux_langauge has been defined use that, else if there is feature name in the fallback_ux_language then use that, else use the feature's default name in the local language
            return (global.ux_language && feature['name:right:'+global.ux_language]) || (global.ux_language_fallback && feature['name:right:'+global.ux_language_fallback]) || feature['name:right'];
        }
    ux_language_text_source_boundary_lines_left_right:
        left: global.ux_language_text_source_left
        right: global.ux_language_text_source_right
    ux_language_text_source_boundary_lines: |
        function() {
           var right = (global.ux_language && feature['name:right:'+global.ux_language]) || (global.ux_language_fallback && feature['name:right:'+global.ux_language_fallback]) || feature['name:right'];
           var left = (global.ux_language && feature['name:left:'+global.ux_language]) || (global.ux_language_fallback && feature['name:left:'+global.ux_language_fallback]) || feature['name:left'];
           if( right && left ) {
               //if( right.includes(' ') || left.includes(' ') ) {
                   return left + " - " + right;
               //} else {
               //    return right + '\n' + left;
               //}
           } else {
               return (global.ux_language && feature['name:'+global.ux_language]) || (global.ux_language_fallback && feature['name:'+global.ux_language_fallback]) || feature.name;
           }
        }
    ux_language_text_source_short: |
        function() {
            return (global.ux_language && feature['name:short:'+global.ux_language]) || (global.ux_language_fallback && feature['name:short:'+global.ux_language_fallback]) || feature['name:short'];
        }
    ux_language_text_source_short_proxy_name: |
        function() {
            var name  = (global.ux_language && feature['name:'+global.ux_language]) || (global.ux_language_fallback && feature['name:'+global.ux_language_fallback]) || feature['name'] || '';
            var short = (global.ux_language && feature['name:short:'+global.ux_language]) || (global.ux_language_fallback && feature['name:short:'+global.ux_language_fallback]) || feature['name:short'];
            return short ? name : '';
        }
    ux_language_text_source_abbreviation: |
        function() {
            var name  = (global.ux_language && feature['name:'+global.ux_language]) || (global.ux_language_fallback && feature['name:'+global.ux_language_fallback]) || feature['name'] || '';
            var abbrev = (global.ux_language && feature['name:abbreviation:'+global.ux_language]) || (global.ux_language_fallback && feature['name:abbreviation:'+global.ux_language_fallback]) || feature['name:abbreviation'];
            return abbrev || name;
        }
    ux_language_text_source_iata: |
        function() {
            var name = (global.ux_language && feature['name:'+global.ux_language]) || (global.ux_language_fallback && feature['name:'+global.ux_language_fallback]) || feature['name'];
            if(feature.iata) {
                if (name) {
                    return name + ' (' + feature.iata + ')';
                }
                else {
                    return feature.iata;
                }
            } else {
                return name;
            }
        }
    ux_language_text_source_ocean: |
        function() {
            var name = (global.ux_language && feature['name:'+global.ux_language]) || (global.ux_language_fallback && feature['name:'+global.ux_language_fallback]) || feature['name'] || '';
            name = name.split(' ').join('\n');
            return name.split('').join('  ');
        }
    ux_language_text_source_sea: |
        function() {
            var name = (global.ux_language && feature['name:'+global.ux_language]) || (global.ux_language_fallback && feature['name:'+global.ux_language_fallback]) || feature['name'] || '';
            name = name.split(' ').join('\n');
            return name.split('').join(' ');
        }
    ux_language_text_source_continent_stacked_only: |
        function() {
            var name = (global.ux_language && feature['name:'+global.ux_language]) || (global.ux_language_fallback && feature['name:'+global.ux_language_fallback]) || feature['name'] || '';
            return name.split(' ').join('\n');
        }
    ux_language_text_source_continent: |
        function() {
            var name = (global.ux_language && feature['name:'+global.ux_language]) || (global.ux_language_fallback && feature['name:'+global.ux_language_fallback]) || feature['name'] || '';
            name = name.split(' ').join('\n');
            return name.split('').join(' ');
        }
    ux_language_text_source_road_ref_and_name: |
        function() {
            // if a ux_langauge has been defined use that, else if there is feature name in the fallback_ux_language then use that, else use the feature's default name in the local language
            return (global.ux_language && feature['name:'+global.ux_language]) || (global.ux_language_fallback && feature['name:'+global.ux_language_fallback]) || feature.name;

            /*
            var name = (global.ux_language && feature['name:'+global.ux_language]) || (global.ux_language_fallback && feature['name:'+global.ux_language_fallback]) || feature['name'];
            if(feature.ref && name) {
                return (feature.ref + ' ' + name);
            } else {
                return name;
            }
            */
        }
    ux_language_text_source_road_ref_and_name_short: |
        function() {
            // if a ux_langauge has been defined use that, else if there is feature name in the fallback_ux_language then use that, else use the feature's default name in the local language
            return (global.ux_language && feature['name:'+global.ux_language]) || (global.ux_language_fallback && feature['name:'+global.ux_language_fallback]) || feature.name;

            /*
            var name = (global.ux_language && feature['name:'+global.ux_language]) || (global.ux_language_fallback && feature['name:'+global.ux_language_fallback]) || feature['name'];
            if (feature.ref && (feature.ref.length < 6) && name) {
                return feature.ref + ' ' + name;
            } else {
                return name;
            }
            */
        }
    ux_language_text_source_piste_advanced: |
        function() {
            var name = (global.ux_language && feature['name:'+global.ux_language]) || (global.ux_language_fallback && feature['name:'+global.ux_language_fallback]) || feature['name'];
            return name ? ('◆ ' + name) : '◆';
        }
    ux_language_text_source_piste_expert: |
        function() {
            var name = (global.ux_language && feature['name:'+global.ux_language]) || (global.ux_language_fallback && feature['name:'+global.ux_language_fallback]) || feature['name'];
            return name ? ('◆◆ ' + name) : '◆◆';
        }
    ux_language_text_source_building_and_address: |
        function() {
            var name = (global.ux_language && feature['name:'+global.ux_language]) || (global.ux_language_fallback && feature['name:'+global.ux_language_fallback]) || feature['name'];
            if (name && feature.addr_housenumber) {
                return name + '\n' + feature.addr_housenumber;
            } else {
                return name;
            }
        }

# Fonts
fonts:
    Open Sans:
        - weight: 300 # Light
          url: ../fonts/OpenSans-Light.woff
        - weight: normal # Regular
          url: ../fonts/OpenSans-Regular.woff
        - weight: normal # Regular
          style: italic
          url: ../fonts/OpenSans-Italic.woff
        - weight: 600 # Semi Bold
          url: ../fonts/OpenSans-Semibold.woff
        - weight: 600 # Semi Bold
          style: italic
          url: ../fonts/OpenSans-SemiboldItalic.woff
        - weight: bold
          url: ../fonts/OpenSans-Bold.woff


scene:
    background:
        color: [0.149,0.149,0.149]

sources:
    # mapzen:
    #     type: MVT
    #     # url:  https://tile.nextzen.org/tilezen/vector/v1/512/all/{z}/{x}/{y}.mvt
    #     url: https://xyz.api.here.com/tiles/osmbase/512/all/{z}/{x}/{y}.mvt
    #     url_params:
    #         api_key: JJiaZE63TZObzPrmx0TQkw
    #     tile_size: 512
    #     max_zoom: 16

#     mapzen:
#         type: MVT
#         url: https://tile.nextzen.org/tilezen/vector/v1/512/all/{z}/{x}/{y}.mvt
#         url_params:
#             api_key: global.sdk_api_key
#         rasters: [normals-elevation]
#         tile_size: 512
#         max_zoom: 2
#     normals-elevation:
#         type: Raster
#         url: https://tile.nextzen.org/tilezen/terrain/v1/512/normal/{z}/{x}/{y}.png
#         url_params:
#             api_key: global.sdk_api_key
#         tile_size: 512
#         max_zoom: 15

    mapzen:
        type: MVT
        url: https://xyz.api.here.com/tiles/osmbase/512/all/{z}/{x}/{y}.mvt

layers:
# we should be able to add the style: _... on the fly in js
    _xyz_dots:
        draw:
            points:
                style: _points
        donut_points:
            draw:
                points:
                    style: _points

    _xyz_lines:
        draw:
            _lines_overlay: {}
            text:
                style: _text

    _xyz_polygons:
        _outlines:
            draw:
                _lines: {}
        draw:
            _polygons_inlay: {}
            text:
                style: _text
    earth:
        data: { source: mapzen, layer: earth }
        draw:
            polygons:
                style: _polygons
                order: global.feature_order
#                 order: 9
                color: [0.149,0.149,0.149]


    great_lakes:
        data: { source: mapzen, layer: water }
        filter:
            all:
                - kind: [lake]
            any:
                # limit show smaller landuse areas to higher zooms
                - { $zoom: [1],  area: { min: 10000000000 } }
                - { $zoom: [2],  area: { min: 7000000000 } }
                # some weird natural earth scale set transition
                - { $zoom: [3],  area: { min: 5000000000 } }
                - { $zoom: [4],  area: { min: 300000000 } }
                - { $zoom: [5],  area: { min: 50000000 } }
                - { $zoom: [6],  area: { min: 50000000 } }
                - { $zoom: [7],  area: { min: 50000000 } }
                - { $zoom: [8],  area: { min: 50000000 } }
                - { $zoom: [9],  area: { min: 15000000 } }
                - { $zoom: [10], area: { min: 4000000 } }
                - { $zoom: [11], area: { min: 1000000 } }
                - { $zoom: [12], area: { min: 250000 } }
                - { $zoom: [13], area: { min: 150000 } }
                - { $zoom: [14], area: { min: 40000 } }
                - { $zoom: { min: 15 } }
        draw:
            polygons:
                style: _polygons
                order: 501
                color: [0.1,0.1,0.1]

    water:
        data: { source: mapzen, layer: water }
        draw:
            polygons:
                style: _polygons
                order: global.feature_order
                color: [0.120,0.120,0.120]
            lines:
                style: _lines

        lakes:
            filter:
                all:
                    - kind: [ocean, water, riverbank, reservoir, swimming_pool] # moved out lakes
                any:
                    # limit show smaller landuse areas to higher zooms
                    - { $zoom: [1],  area: { min: 10000000000 } }
                    - { $zoom: [2],  area: { min: 7000000000 } }
                    # some weird natural earth scale set transition
                    - { $zoom: [3],  area: { min: 5000000000 } }
                    - { $zoom: [4],  area: { min: 300000000 } }
                    - { $zoom: [5],  area: { min: 50000000 } }
                    - { $zoom: [6],  area: { min: 50000000 } }
                    - { $zoom: [7],  area: { min: 50000000 } }
                    - { $zoom: [8],  area: { min: 50000000 } }
                    - { $zoom: [9],  area: { min: 15000000 } }
                    - { $zoom: [10], area: { min: 4000000 } }
                    - { $zoom: [11], area: { min: 1000000 } }
                    - { $zoom: [12], area: { min: 250000 } }
                    - { $zoom: [13], area: { min: 150000 } }
                    - { $zoom: [14], area: { min: 40000 } }
                    - { $zoom: { min: 15 } }
            draw:
                polygons:
                    color: [0.120,0.120,0.120]
                    


        other-water-areas:
            filter: { not: { kind: [ocean, lake, water, reservoir] }, $zoom: { min: 11 }, area: { min: 100 } }
            draw:
                polygons:
                    color: [0.120,0.120,0.120]

        playas:
            filter: { kind: playa }
            draw:
                polygons:
                    visible: true
                    order: global.feature_order
                    color: [0.130,0.130,0.130]

        water-boundary-ocean:
            filter: { boundary: true, kind: ocean, $zoom: { min: 1 } }
            draw:
                lines:
                    visible: true
                    order: global.feature_order
                    color: [0.212,0.212,0.212]
                    width: 1.25px
                    join: round

        water_boundaries-not-ocean:
            filter:
                all:
                    - boundary: true
                    - not: { kind: ocean }
                    - $zoom: { min: 8 }
                any:
                    # limit show smaller landuse areas to higher zooms
                    - { $zoom: [1],  area: { min: 10000000000 } }
                    - { $zoom: [2],  area: { min: 7000000000 } }
                    # some weird natural earth scale set transition
                    - { $zoom: [3],  area: { min: 5000000000 } }
                    - { $zoom: [4],  area: { min: 300000000 } }
                    - { $zoom: [5],  area: { min: 50000000 } }
                    - { $zoom: [6],  area: { min: 50000000 } }
                    - { $zoom: [7],  area: { min: 50000000 } }
                    - { $zoom: [8],  area: { min: 50000000 } }
                    - { $zoom: [9],  area: { min: 15000000 } }
                    - { $zoom: [10], area: { min: 4000000 } }
                    - { $zoom: [11], area: { min: 1000000 } }
                    - { $zoom: [12], area: { min: 250000 } }
                    - { $zoom: [13], area: { min: 150000 } }
                    - { $zoom: [14], area: { min: 40000 } }
                    - { $zoom: { min: 15 } }
            draw:
                lines:
                    visible: true
                    order: global.feature_order
                    color: [0.212,0.212,0.212]
                    width: [[6, 0.75px], [10, 2px]]
                    join: round
            riverbank:
                # river boundaries like the thames in london, la seine in paris
                filter: { kind: riverbank }
                draw:
                    lines:
                        visible: true
                        color: [0.212,0.212,0.212]
                        width: [[9, 0.5px], [15, 2px]]
        river:
            #river center lines, not boundaries for polygons
            filter: { kind: [river,canal,stream,dam,ditch,drain], $zoom: { min: 11 }, not: { is_tunnel: true } }
            draw:
                lines:
                    visible: true
                    order: global.feature_order_down_1
                    color: [0.212,0.212,0.212]
                    width: [[11, 0.5px], [17, 1px]]
                    cap: round

    roads:
        data: { source: mapzen, layer: roads }
        draw:
            lines:
                style: _lines
                visible: true
                width: 0.5px
                order: global.feature_order
                # but give them all the same outline
                outline:
                    order: 352
            text-blend-order:
                text_source: global.ux_language_text_source
                visible: false    # labels are enabled by each layer below
                font:
                    family: global.text_font_family
                    weight: normal
                    fill: global.roads_text_fill

        # default outlines starting at zoom 16
        default-outline-width:
            filter: { $zoom: { min: 16 } }
            draw:
                lines:
                    outline:
                        width: function () { return 3/16 * Math.log($zoom); }

        natural_earth_highways:
            filter: { $zoom: { min: 5, max: 8 } }
            draw:
                lines:
                    color: global.black_color
                    width: 0.5px
            major_road:
                filter: { kind: major_road }
                draw:
                    lines:
                        color: global.black_color
                        width: 0.5px
            minor_road:
                filter: { kind: minor_road }
                draw:
                    lines:
                        color: global.black_color
                        width: 0.5px
            ferry:
                filter: { kind: ferry }
                draw:
                    lines:
                        visible: false
        highway:
            filter: { kind: highway, $zoom: { min: 8 } }
            draw:
                lines:
                    color: [[8, [0.400,0.400,0.400]], [16, [0.700,0.700,0.700]]]
                    width: [[8, 1px], [17, 2px]]
            link:
                filter: { is_link: true } # on- and off-ramps, etc
                draw:
                    lines:
                        color: global.black_color
                        width: 0.5px
        

    boundaries:
        data: { source: mapzen, layer: boundaries }
        # country subdivisions (states, provinces)
        draw:
            lines:
                style: _lines
                order: 500 # global.feature_order
        country:
            filter:
                any:
                    - kind: country
                    - admin_level: 2
            draw:
                lines:
                    order: function() { return (feature.sort_rank -1); }
                    color: [0.2,0.2,0.2]
                    width: [[0, 0px], [4, 2px], [8, 6px], [14, 8px], [17, 16m]]
            water:
                filter: { maritime_boundary: true }
                draw:
                    lines:
                        visible: false

        other_country_boundary_disputed_etc:
            filter: { kind: [disputed, indefinite, indeterminate, lease_limit, line_of_control, overlay_limit] }
            draw:
                lines:
                    dash: [1.25, 1.25]
                    order: global.feature_order
                    color: [0.110,0.110,0.110]
                    width: [[1,0.2px],[9,1.5px],[17,10m]]
            disputed:
                filter: { kind: [disputed, line_of_control] }
                draw:
                    lines:
                        dash: [2.0, 1.0]
                        order: global.feature_order
                        color: [0.2,0.2,0.2]
                        width: [[1, 1px], [9, 4px], [17,14m]]

        region:
            filter:
                any:
                    - kind: [region,macroregion]
                    - kind_detail: [3,4]
            draw:
                lines:
                    color: [0.2,0.2,0.2]
                    width: [[0, 0.5px], [9, 2px], [14, 4px], [16, 6.5px], [17, 16m]]

            water:
                filter: { maritime_boundary: true }
                draw:
                    lines:
                        visible: false

            dash-borders:
                filter:
                    $zoom: { min: 7 }
                draw:
                    lines:
                        dash: [7.0, 3.0]

            early:
                filter: { not: { min_zoom: [1,2] }, $zoom: { max: 8 } }
                draw:
                    lines:
                        visible: false

    places:
        data: { source: mapzen, layer: places }
        filter:
            name: true
        draw:
            text-blend-order:
                style: _text
                visible: false    # labels are enabled by each layer below
                buffer: 3px
                font:
                    family: global.text_font_family
                    fill: [1.000,1.000,1.000]
            # END NOTE

        country:
            filter:
                kind: country
                $zoom: { min: 2, max: 9 }
            draw:
                text-blend-order:
                    priority: 3
                    visible: true
                    text_source: global.ux_language_text_source
                    font:
                        fill: [0.550,0.550,0.550]
                        weight: 600
                        stroke: { color: [0.149,0.149,0.149], width: 4px }
            country-z2-3:
                filter:
                    $zoom: [2,3]
                draw:
                    text-blend-order:
                        priority: 10
                        buffer: 10px
                        font:
                            size: 11px
                early-ones-z2:
                    filter:
                        $zoom: [2]
                        not: { name: [United States of America,Brasil,中华人民共和国,Россия,Canada,Kalaallit Nunaat,Ísland,Australia,India,日本,Guam,Indonesia,South Africa,مصر,Nigeria,Kenya] }
                    draw:
                        text-blend-order:
                            visible: false
                early-ones-z3:
                    filter:
                        $zoom: [3]
                        name: [Nederland,Luxembourg,Liechtenstein,San Marino,Civitatis Vaticanæ,Crna Gora,Македонија,The Gambia,Burundi,Swaziland,الإمارات العربية المتحدة,العراق,Singapore,El Salvador,Belize,Trinidad and Tobago, Saint Lucia, Montserrat,Anguilla,República Dominicana,Bahamas,British Virgin Islands,Antigua and Barbuda,Grenada,Sint Maarten,Saint Kitts and Nevis,Cayman Islands,België - Belgique - Belgien,Deutschland,España]
                    draw:
                        text-blend-order:
                            visible: false
            country-z4:
                filter:
                    $zoom: [4]
                draw:
                    text-blend-order:
                        buffer: 10px
                        priority: 8
                        font:
                            size: 13px
                early-ones-z4:
                    filter:
                        name: [Nederland,Luxembourg,Liechtenstein,San Marino,Civitatis Vaticanæ,Crna Gora,Македонија,The Gambia,Burundi,Swaziland,الإمارات العربية المتحدة,العراق,Singapore,El Salvador,Belize,Trinidad and Tobago, Saint Lucia, Montserrat,Anguilla,República Dominicana,Bahamas,British Virgin Islands,Antigua and Barbuda,Grenada,Sint Maarten,Saint Kitts and Nevis,Cayman Islands,België - Belgique - Belgien,Deutschland,España,Magyarország,Österreich,Polska,Хуссар Ирыстон,Аҧсны - Абхазия]
                    draw:
                        text-blend-order:
                            visible: false
            country-z5:
                filter:
                    $zoom: [5]
                draw:
                    text-blend-order:
                        priority: 8
                        font:
                            size: 16px
                early-ones-z5:
                    filter:
                        # South Ossetia and Abkhazia aren't countries (they are disputed areas)
                        - name: [Luxembourg,Liechtenstein,San Marino,Civitatis Vaticanæ,El Salvador,Belize,België - Belgique - Belgien,"Хуссар Ирыстон - Южная Осетия","Хуссар Ирыстон","Аҧсны - Абхазия","Լեռնային Ղարաբաղի Հանրապետությու (Nagorno-Karabakh Republic)"]
                        - population: { max: 5000000 }
                    draw:
                        text-blend-order:
                            visible: false
            country-z6:
                filter:
                    $zoom: [6]
                draw:
                    text-blend-order:
                        priority: 8
                        font:
                            size: 19px
                small-ones-z6:
                    filter:
                        # South Ossetia and Abkhazia aren't countries (they are disputed areas)
                        - name: [Luxembourg,Liechtenstein,San Marino,Civitatis Vaticanæ,België - Belgique - Belgien,"Хуссар Ирыстон - Южная Осетия","Хуссар Ирыстон","Аҧсны - Абхазия","Լեռնային Ղարաբաղի Հանրապետությու (Nagorno-Karabakh Republic)"]
                        - population: { max: 5000000 }
                    draw:
                        text-blend-order:
                            visible: false
            country-z7:
                # South Ossetia and Abkhazia aren't countries (they are disputed areas)
                filter: { $zoom: { min: 7, max: 9 } }
                draw:
                    text-blend-order:
                        font:
                            size: 19px
                small-ones-z7:
                    filter:
                        $zoom: [7]
                        # South Ossetia and Abkhazia aren't countries (they are disputed areas)
                        name: [Liechtenstein,San Marino,Civitatis Vaticanæ,"Хуссар Ирыстон - Южная Осетия","Хуссар Ирыстон","Аҧсны - Абхазия","Լեռնային Ղարաբաղի Հանրապետությու (Nagorno-Karabakh Republic)"]
                    draw:
                        text-blend-order:
                            visible: false
                small-pop:
                    filter:
                        - population: { max: 5000000 }
                    draw:
                        text-blend-order:
                            priority: 30
                            font:
                                size: 12px

        region:
            filter:
                kind: region
                $zoom: { min: 4, max: 9 }
            draw:
                text-blend-order:
                    priority: 14
                    visible: false
                    text_source: global.ux_language_text_source_short
                    font:
                        size: 11px
                        weight: normal
                        fill: [0.400,0.400,0.400]
                        stroke: { color: [0.149,0.149,0.149], width: 4px }
            region-z4:
                filter:
                    $zoom: [4]
                    not: { name: [Western Cape,Eastern Cape,Northern Cape,North West,Limpopo,KwaZulu-Natal,Hamburg,Freie und Hansestadt Hamburg,Neuchâtel,Nordrhein-Westfalen,Haute-Normandie,Baden-Württemberg,Bayern,Sachsen-Anhalt,Berlin,Mecklenburg-Vorpommern,Schleswig-Holstein,Brandenburg,Niedersachsen,Saarland,Thüringen,Hessen,Sachsen] }
                draw:
                    text-blend-order:
                        visible: true
                        # font:
                        #     fill: [0.70,0.70,0.70]
            region-z5:
                filter:
                    $zoom: [5]
                    not: { name: [Western Cape,Eastern Cape,Northern Cape,North West,Limpopo,KwaZulu-Natal,Hamburg,Freie und Hansestadt Hamburg,Neuchâtel,Nordrhein-Westfalen,Haute-Normandie,Baden-Württemberg,Bayern,Sachsen-Anhalt,Berlin,Mecklenburg-Vorpommern,Schleswig-Holstein,Brandenburg,Niedersachsen,Saarland,Thüringen,Hessen,Sachsen] }
                draw:
                    text-blend-order:
                        visible: true
                        font:
                            size: 15px
            region-z6:
                filter:
                    $zoom: [6]
                    not: { name: [Western Cape,Eastern Cape,Northern Cape,North West,Limpopo,KwaZulu-Natal,Hamburg,Freie und Hansestadt Hamburg,Neuchâtel,Nordrhein-Westfalen,Haute-Normandie,Baden-Württemberg,Bayern,Sachsen-Anhalt,Berlin,Mecklenburg-Vorpommern,Schleswig-Holstein,Brandenburg,Niedersachsen,Saarland,Thüringen,Hessen,Sachsen] }
                draw:
                    text-blend-order:
                        visible: true
                        font:
                            size: 16px
                            transform: uppercase

            region-z7-z8:
                filter: { $zoom: [7,8] }
                draw:
                    text-blend-order:
                        visible: true
                        text_source: global.ux_language_text_source_short_proxy_name
                        font:
                            size: 18px
                            transform: uppercase
                pesky:
                    filter:
                        $zoom: [7]
                        name: [Western Cape,Eastern Cape,Northern Cape,North West,Limpopo,KwaZulu-Natal,Hamburg,Freie und Hansestadt Hamburg,Neuchâtel,Nordrhein-Westfalen,Haute-Normandie,Baden-Württemberg,Bayern,Sachsen-Anhalt,Berlin,Mecklenburg-Vorpommern,Schleswig-Holstein,Brandenburg,Niedersachsen,Saarland,Thüringen,Hessen,Sachsen]
                    draw:
                        text-blend-order:
                            visible: false
                abbrev-small-ones-z7:
                    filter:
                        $zoom: [7]
                        name: [Delaware,New Jersey,Connecticut,Rhode Island,Massachusetts,New Hampshire,Vermont]
                    draw:
                        text-blend-order:
                            text_source: global.ux_language_text_source_abbreviation
                            font: { transform: uppercase }
                region-z8:
                    filter:
                        $zoom: [8]
                    draw:
                        text-blend-order:
                            text_source: global.ux_language_text_source
                    no-pop:
                        filter:
                            any:
                                - population: false
                                - population: { max: 1000000 }
                        draw:
                            text-blend-order:
                                font:
                                    size: 12px

        populated-places:
            filter:
                kind: locality
            draw:
                text-blend-order:
                    visible: true
                    buffer: 42px
                    font:
                        size: [[5,9px],[8,10px],[12,11px]]
                        stroke: { color: [0.149,0.149,0.149], width: 5px }

            # _text_early:
            #     filter: { $zoom: { max: 11 } }
            #     draw:
            #         text-blend-order:
            #             visible: false


            # HACK
            # NOTE: These should use icon: buffer instead of going visible: false, but there are problems using icon here :(
            # This fixes Paris area, but causes problems for small places in the USA eg Table Bluff near Eureka, California.
            funky-village:
                filter: { $zoom: [11], population: { max: 1000 }, kind_detail: [village] }
                draw:
                    text-blend-order:
                        visible: false
            funky-isolated_dwelling:
                filter: { $zoom: [13], kind_detail: [isolated_dwelling] }
                draw:
                    text-blend-order:
                        visible: false
            hamlet:
                filter: { $zoom: [13], kind_detail: hamlet }
                draw:
                    text-blend-order:
                        visible: false
            # END HACK

            # someone in London and Salt Lake City thought neighbourhoods should be tagged place: locality
            # They were wrong
            funky-fake-neighbourhoods:
                filter: { $zoom: { min: 13 }, kind_detail: [locality] }
                draw:
                    text-blend-order:
                        visible: false


            population-10m-up:
                filter:
                    population: { min: 10000000 }
                draw:
                    text-blend-order:
                        priority: 6
                        font:
                            size: [[2,11px],[6,15px],[8,18px],[10,20px],[12,20px],[13,0px]]
            population-5m-10m:
                filter:
                    population: { min: 5000000, max: 10000000 }
                draw:
                    text-blend-order:
                        priority: 7
                        font:
                            size: [[4,10px],[6,14px],[8,18px],[10,20px],[12,20px],[13,0px]]
            population-1m-5m:
                filter:
                    population: { min: 1000000, max: 5000000 }
                draw:
                    text-blend-order:
                        priority: 9
                        font:
                            size: [[4,10px],[6,14px],[8,15px],[12,18px],[13,0px]]
            population-500k-1m:
                filter:
                    population: { min: 500000, max: 1000000 }
                draw:
                    text-blend-order:
                        priority: 11
                        font:
                            size: [[5,10px],[8,12px],[10,14px],[12,16px],[13,0px]]
            population-200k-500k:
                filter:
                    population: { min: 200000, max: 500000 }
                draw:
                    text-blend-order:
                        priority: 13
                        font:
                            size: [[6,10px],[8,14px],[10,15px],[12,16px],[13,0px]]
            population-100k-200k:
                filter:
                    population: { min: 100000, max: 200000 }
                draw:
                    text-blend-order:
                        priority: 15
                        font:
                            size: [[6,10px],[8,12px],[14,14px],[15,0px]]
            population-50k-100k:
                filter:
                    population: { min: 50000, max: 100000 }
                draw:
                    text-blend-order:
                        priority: 17
                        font:
                            size: [[6,10px],[8,12px],[14,14px],[15,0px]]
            population-20k-50k:
                filter:
                    population: { min: 20000, max: 50000 }
                draw:
                    text-blend-order:
                        priority: 19
                        font:
                            size: [[9,10px],[14,12px],[15,0px]]
            population-10k-20k:
                filter:
                    population: { min: 10000, max: 20000 }
                draw:
                    text-blend-order:
                        priority: 21
                        font:
                            size: [[9, 10px],[14, 12px],[15, 0px]]
            population-5k-10k:
                filter:
                    population: { min: 5000, max: 10000 }
                draw:
                    text-blend-order:
                        priority: 23
                        font:
                            size: [[9,10px], [14,12px], [15,0px]]
            population-2k-5k:
                filter:
                    population: { min: 2000, max: 5000 }
                draw:
                    text-blend-order:
                        priority: 25
                        font:
                            size: [[9,10px], [14,12px], [15,0px]]
            population-1k-2k:
                filter:
                    population: { min: 1000, max: 2000 }
                draw:
                    text-blend-order:
                        priority: 27
                        font:
                            size: [[9, 10px], [14, 12px], [15, 0px]]
            population-200-1k:
                filter:
                    population: { min: 200, max: 1000 }
                draw:
                    text-blend-order:
                        priority: 28
                        font:
                            size: [[9, 10px], [14, 11px], [15, 0px]]

styles:
    lines_transparent:
        base: lines
        blend: overlay

    polygons_transparent:
        base: polygons
        blend: overlay
                    
    text-blend-order:
        base: text
        blend: overlay