simpler-line-dash-example.yaml

author: Patricio Gonzalez Vivo (@patriciogv) - 2016 ; modified by Will Skora
### this works

import:
    - https://tangrams.github.io/blocks/filter/grid.yaml
    - https://tangrams.github.io/blocks/lines/dash.yaml
    - https://tangrams.github.io/blocks/global.yaml

sources:
    mapzen:
        type: TopoJSON
        url: https://tile.mapzen.com/mapzen/vector/v1/all/{z}/{x}/{y}.topojson
        url_params:
            api_key: mapzen-Pjac2MJ
        max_zoom: 16

cameras:
    cam:
        type: perspective
        # vanishing_point: [0, -500]

lights:
    dir:
        type: directional
        direction: [.1, .5, -1]
        diffuse: .7
        ambient: .5

layers:
    water:
        data: { source: mapzen }
        draw:
            water:
                order: global.order
                color: '#353535'
    earth:
        data: { source: mapzen }
        draw:
            earth:
                order: global.order
                color: '#555'
    landuse:
        data: { source: mapzen }
        draw:
            landuse:
                order: global.order
                color: '#666'
    roads:
        data: { source: mapzen }
        filter: { not: { kind: [rail, ferry] } }
        draw:
            roads:
                order: global.order
                color: [0.988, 0.988, 0.988]
                width: [[7,0.0px], [10, .5px], [15, .75px], [17, 5m]]
        highway:
            filter: { kind: highway }
            draw:
                roads:
                    order: global.order
                    width: [[8,0px], [8,.25px], [11, 1.5px], [14, 2px], [16, 4px], [17, 10m]]
            link:
                filter: { is_link: true } # on- and off-ramps, etc
                draw:
                    roads:
                        width: [[8,0px], [14, 3px], [16, 5px], [18, 10m]]
                tunnel-link:
                    filter: {is_tunnel: true, $zoom: {min: 13} }
        tunnel:
            filter: {is_tunnel: true }
            draw:
                roads:
                    order: global.order
    buildings:
        data: { source: mapzen }
        draw:
            buildings:
                order: global.order
                color: '#999'
                extrude: true
    boundaries:
        data: { source: mapzen}
        draw:
            lines-dash:
                order: global.order
                color: [0.976, 0.988, 0.000, 1.00]
                width: 4px
               # i DON'T need the commented line out below 
               # mix: lines-dash
                shaders:
                    define:
                DASH_SCALE: 44
                DASH_SIZE: 0.098
styles:
    water:
        base: polygons
    earth:
        base: polygons
    landuse:
        base: polygons
    roads:
        base: lines
        lighting: false
    buildings:
        base: polygons