aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorAndré Dietrich <andre.dietrich@ovgu.de>2020-01-07 18:02:43 +0100
committerAndré Dietrich <andre.dietrich@ovgu.de>2020-01-07 18:02:43 +0100
commit1d440169042ecb74482569637f480306ad331f26 (patch)
tree80ea57140c34d738788cae8d98018915e5aa802b
parent42d5dacc1e2edeff15fabe507fdd6b4e335923d2 (diff)
parentd07b8909baedf4740b12f0c72d61b4f111ba2af2 (diff)
Merge branch 'master' of https://github.com/andre-dietrich/elm-mapbox
-rw-r--r--README.md47
-rw-r--r--elm-mapbox.umd.js.patch75
-rw-r--r--elm.json8
-rw-r--r--examples/Example01.elm1
-rw-r--r--examples/Example03.elm151
-rw-r--r--examples/Example04.elm180
-rw-r--r--examples/Map.elm8
-rw-r--r--examples/MapCommands.elm6
-rw-r--r--examples/elm.json5
-rw-r--r--examples/index.js10
-rw-r--r--examples/package-lock.json4167
-rw-r--r--examples/package.json7
-rw-r--r--src/Mapbox/Layer.elm57
-rw-r--r--src/Mapbox/Source.elm18
-rw-r--r--src/Mapbox/Style.elm96
15 files changed, 2640 insertions, 2196 deletions
diff --git a/README.md b/README.md
index bd08c04..3f31f30 100644
--- a/README.md
+++ b/README.md
@@ -1,3 +1,50 @@
+
+> This is only a fork of the great elm-mapbox library from Jakub Hampl with some
+> quick fixes, that I needed for my project. Please use the original version from
+> https://github.com/gampleman/elm-mapbox
+>
+> I will remove the project when this functionality will be available in the
+> original project.
+
+__Changes:__
+
+* Use the patch after running `npm i` in order to remove some errors
+ (at least on my system) with TouchEvents and not ready loaded maps
+
+ `patch -N node_modules/elm-mapbox/dist/elm-mapbox.umd.js < elm-mapbox.umd.js.patch`
+
+* This version contains some decoders for `StyleDef`, which are nice to
+ use, if you want to load your maps from MapBox-Studio and add some custom
+ layers in your code ... see for example examples/Example04
+
+* Or, as in my case, you can also use the great style generator to generate your
+ `StyleDef`, which in my case caused some errors and remove the layers by a
+ simple json-parser. Simply copy your original json definition into a string ...
+
+ ``` elm
+ Style
+ { transition = Style.defaultTransition
+ , light = Style.defaultLight
+ , layers =
+ """
+ [{"id": "background","type": "background","layout": {"visibility": "visi
+ ble"},"paint": {"background-color": "#fff", "background-opacity": 1},"in
+ teractive": true},{"id": "waterway","type": "line","metadata": {"mapbox:
+ group": "1452116608071.19"},"source": "mapbox://mapbox.mapbox-streets-v6
+ ","source-layer": "waterway","layout": {"visibility": "visible","line-ca
+ p": "round","line-join": "round"},"paint": {"line-width": 2,"line-color"
+ : "#62b0f0","line-blur": 0,"line-opacity": 0.7},"interactive": true},{"i
+ d": "water","type": "fill","metadata": {"mapbox:group": "14521166080 ...
+ """
+ |> Layer.jsonList
+ , ...
+ ```
+
+* If you want to achieve the same, but only for one layer, then use `Layer.json`...
+
+
+
+
# elm-mapbox
Great looking and performant maps in Elm using MapboxGl. Discuss in #maps on the Elm Slack.
diff --git a/elm-mapbox.umd.js.patch b/elm-mapbox.umd.js.patch
new file mode 100644
index 0000000..1a9748c
--- /dev/null
+++ b/elm-mapbox.umd.js.patch
@@ -0,0 +1,75 @@
+--- node_modules/elm-mapbox/dist/elm-mapbox.umd.js 1985-10-26 09:15:00.000000000 +0100
++++ elm-mapbox.umd.js 2019-09-12 18:24:24.087505291 +0200
+@@ -77,9 +77,16 @@
+ get mapboxStyle() {
+ return this._style;
+ }
+- set mapboxStyle(value) {
+- if (this._map) this._map.setStyle(value);
+- this._style = value;
++ set mapboxStyle(value)
++ if (this._map) {
++ // This is a simple check to prevent mapbox from
++ // setting the style over and over agian, otherwise
++ // it may cause errors by using events ...
++ if (JSON.stringify(this._style) != JSON.stringify(value)) {
++ this._map.setStyle(value);
++ }
++ }
++ this._style = value;
+ }
+
+ get minZoom() {
+@@ -229,7 +236,8 @@
+ };
+ } else if (["touchend", "touchmove", "touchcancel"].includes(type)) {
+ wrapped = e => {
+- e.features = this._map.queryRenderedFeatures([e.point], {
++ // removed the arrays, caused errors with using touch-events
++ e.features = this._map.queryRenderedFeatures(e.point, {
+ layers: this.eventFeaturesLayers,
+ filter: this.eventFeaturesFilter
+ });
+@@ -304,14 +312,18 @@
+ );
+ this._eventRegistrationQueue = {};
+ options.onMount(this._map, this);
+- if (commandRegistry[this.id]) {
+- this._map.on("load", () => {
+- var cmd;
+- while ((cmd = commandRegistry[this.id].shift())) {
+- cmd(this._map);
+- }
+- });
+- }
++ if (commandRegistry[this.id]) {
++ function onStyleData(){
++ if(map.isStyleLoaded()) {
++ var cmd;
++ while ((cmd = commandRegistry[this.id].shift())) {
++ cmd(this._map);
++ }
++ map.off('data', onStyleData)
++ }
++ };
++ this._map.on("data", onStyleData);
++ }
+ return this._map;
+ }
+
+@@ -415,6 +427,15 @@
+ bounds: map.getBounds().toArray()
+ });
+
++ // use it to get the center and the current zoom-level of the map
++ case "getCenter":
++ return elmApp.ports[options.incomingPort].send({
++ type: "getCenter",
++ id: event.requestId,
++ center: map.getCenter().toArray(),
++ zoom: map.getZoom()
++ });
++
+ case "queryRenderedFeatures":
+ return elmApp.ports[options.incomingPort].send({
+ type: "queryRenderedFeatures",
diff --git a/elm.json b/elm.json
index 77eb739..0a27d62 100644
--- a/elm.json
+++ b/elm.json
@@ -1,9 +1,9 @@
{
"type": "package",
- "name": "gampleman/elm-mapbox",
- "summary": "An advanced mapping library",
+ "name": "andre-dietrich/elm-mapbox",
+ "summary": "Fork form gampleman/elm-mapbox (4.1.0) ... An advanced mapping library",
"license": "MIT",
- "version": "4.1.0",
+ "version": "1.1.1",
"exposed-modules": [
"Mapbox.Element",
"Mapbox.Cmd.Template",
@@ -21,4 +21,4 @@
"elm/json": "1.0.0 <= v < 2.0.0"
},
"test-dependencies": {}
-} \ No newline at end of file
+}
diff --git a/examples/Example01.elm b/examples/Example01.elm
index 9401a99..07ac833 100644
--- a/examples/Example01.elm
+++ b/examples/Example01.elm
@@ -151,7 +151,6 @@ view model =
]
}
)
- , div [ style "position" "absolute", style "bottom" "20px", style "left" "20px" ] [ text (LngLat.toString model.position) ]
]
]
}
diff --git a/examples/Example03.elm b/examples/Example03.elm
new file mode 100644
index 0000000..ddd1d02
--- /dev/null
+++ b/examples/Example03.elm
@@ -0,0 +1,151 @@
+module Example03 exposing (main)
+
+import Browser
+import Html exposing (div, text)
+import Html.Attributes exposing (style)
+import Html.Lazy exposing (lazy)
+import Json.Decode
+import Json.Encode
+import LngLat exposing (LngLat)
+import Map
+import MapCommands
+import Mapbox.Cmd.Option as Opt
+import Mapbox.Element exposing (..)
+import Mapbox.Expression as E exposing (false, float, int, str, true)
+import Mapbox.Layer as Layer
+import Mapbox.Source as Source
+import Mapbox.Style as Style exposing (Style(..))
+
+
+main =
+ Browser.document
+ { init = init
+ , view = view
+ , update = update
+ , subscriptions = subscriptions
+ }
+
+
+subscriptions : Model -> Sub Msg
+subscriptions _ =
+ Sub.batch
+ [ Commands.elmMapboxIncoming MapCenter
+ ]
+
+
+type alias Model =
+ { position : LngLat
+ , zoom : Float
+ , features : List Json.Encode.Value
+ }
+
+
+init : () -> ( Model, Cmd Msg )
+init () =
+ ( { position = LngLat 0 0, zoom = 13.8, features = [] }, Cmd.none )
+
+
+type Msg
+ = Hover EventData
+ | Click EventData
+ | MapCenter Json.Encode.Value
+
+
+update msg model =
+ case msg of
+ Hover { lngLat, renderedFeatures } ->
+ ( { model | position = lngLat, features = renderedFeatures }, Cmd.none )
+
+ Click { lngLat, renderedFeatures } ->
+ ( { model | position = lngLat, features = renderedFeatures }, Commands.fitBounds "my-map" [ Opt.linear True, Opt.maxZoom 10 ] ( LngLat.map (\a -> a - 0.2) lngLat, LngLat.map (\a -> a + 0.2) lngLat ) )
+
+ MapCenter e ->
+ ( model, Cmd.none )
+
+
+geojson : Json.Encode.Value
+geojson =
+ Json.Decode.decodeString Json.Decode.value """
+{
+ "type": "FeatureCollection",
+ "features": [
+ {
+ "type": "Feature",
+ "id": 1,
+ "properties": {
+ "name": "Bermuda Triangle",
+ "area": 1150180
+ },
+ "geometry": {
+ "type": "Polygon",
+ "coordinates": [
+ [
+ [-64.73, 32.31],
+ [-80.19, 25.76],
+ [-66.09, 18.43],
+ [-64.73, 32.31]
+ ]
+ ]
+ }
+ }
+ ]
+}
+""" |> Result.withDefault (Json.Encode.object [])
+
+
+hoveredFeatures : List Json.Encode.Value -> MapboxAttr msg
+hoveredFeatures =
+ List.map (\feat -> ( feat, [ ( "hover", Json.Encode.bool True ) ] ))
+ >> featureState
+
+
+showMap features =
+ map
+ [ maxZoom 150
+ , onMouseMove Hover
+ , onClick Click
+ , id "my-map"
+ , eventFeaturesLayers [ "changes" ]
+ , hoveredFeatures features
+ ]
+ (Style
+ { transition = Style.defaultTransition
+ , light = Style.defaultLight
+ , layers =
+ (Map.layers
+ |> Layer.jsonList
+ )
+ ++ [ Layer.fill "changes"
+ "changes"
+ [ Layer.fillOpacity (E.ifElse (E.toBool (E.featureState (str "hover"))) (float 0.9) (float 0.1))
+ ]
+ ]
+ , sources =
+ [ Source.vectorFromUrl "mapbox://mapbox.mapbox-streets-v6" "mapbox://mapbox.mapbox-streets-v6"
+ , Source.vectorFromUrl "mapbox://mapbox.mapbox-terrain-v2" "mapbox://mapbox.mapbox-terrain-v2"
+ , Source.vectorFromUrl "mapbox://mslee.0fc2f90a" "mapbox://mslee.0fc2f90a"
+ , Source.geoJSONFromValue "changes" [] geojson
+ ]
+ , misc =
+ [ Style.sprite "mapbox://sprites/engiadina/ck0dvc9zq0g2v1cmw9xg18pu7/0y2vnk8n60t1vz01wcpm3bpqa"
+ , Style.glyphs "mapbox://fonts/engiadina/{fontstack}/{range}.pbf"
+ , Style.name "Winter"
+ , Style.defaultCenter <| LngLat 20.39789404164037 43.22523201923144
+ , Style.defaultZoomLevel 13
+ , Style.defaultBearing 0
+ , Style.defaultPitch 0
+ ]
+ }
+ )
+
+
+view model =
+ { title = "Mapbox Example"
+ , body =
+ [ css
+ , div [ style "width" "100vw", style "height" "100vh" ]
+ [ lazy showMap model.features
+ , div [ style "position" "absolute", style "bottom" "20px", style "left" "20px" ] [ text (LngLat.toString model.position) ]
+ ]
+ ]
+ }
diff --git a/examples/Example04.elm b/examples/Example04.elm
new file mode 100644
index 0000000..eb7b650
--- /dev/null
+++ b/examples/Example04.elm
@@ -0,0 +1,180 @@
+port module Example04 exposing (main)
+
+import Browser
+import Html exposing (div, text)
+import Html.Attributes exposing (style)
+import Html.Lazy exposing (lazy2)
+import Http
+import Json.Decode
+import Json.Encode
+import LngLat exposing (LngLat)
+import Map
+import MapCommands
+import Mapbox.Cmd.Option as Opt
+import Mapbox.Element exposing (..)
+import Mapbox.Expression as E exposing (false, float, int, str, true)
+import Mapbox.Layer as Layer
+import Mapbox.Source as Source
+import Mapbox.Style as Style exposing (Style(..), StyleDef)
+
+
+port elmMapboxIncoming : (Json.Encode.Value -> msg) -> Sub msg
+
+
+main =
+ Browser.document
+ { init = init
+ , view = view
+ , update = update
+ , subscriptions = subscriptions
+ }
+
+
+subscriptions : Model -> Sub Msg
+subscriptions _ =
+ elmMapboxIncoming MapCenter
+
+
+type alias Model =
+ { position : LngLat
+ , zoom : Float
+ , features : List Json.Encode.Value
+ , jsonMap : Maybe StyleDef
+ }
+
+
+init : () -> ( Model, Cmd Msg )
+init () =
+ ( { position = LngLat 0 0
+ , zoom = 13.8
+ , features = []
+ , jsonMap = Nothing
+ }
+ , fetchStyle "mapbox://styles/yourstile/ck0dvc9zq0g2v1cmw9xg18pu7" "pk.eyJ1Ijoi..."
+ )
+
+
+type Msg
+ = Hover EventData
+ | Click EventData
+ | MapCenter Json.Encode.Value
+ | LoadedStyle (Result Http.Error String)
+
+
+fetchStyle styleUrl token =
+ String.replace "mapbox://styles/" "https://api.mapbox.com/styles/v1/" styleUrl
+ ++ "?access_token="
+ ++ token
+ |> Http.getString
+ |> Http.send LoadedStyle
+
+
+update msg model =
+ case msg of
+ Hover { lngLat, renderedFeatures } ->
+ ( { model | position = lngLat, features = renderedFeatures }, Cmd.none )
+
+ Click { lngLat, renderedFeatures } ->
+ ( { model | position = lngLat, features = renderedFeatures }, MapCommands.fitBounds [ Opt.linear True, Opt.maxZoom 10 ] ( LngLat.map (\a -> a - 0.2) lngLat, LngLat.map (\a -> a + 0.2) lngLat ) )
+
+ MapCenter e ->
+ ( model, Cmd.none )
+
+ LoadedStyle (Ok style) ->
+ ( { model
+ | jsonMap =
+ case
+ ( Json.Decode.decodeString Style.decode style
+ , Json.Decode.decodeString Style.decodeMiscDef style
+ )
+ of
+ ( Ok mapbox, Ok misc ) ->
+ Just { mapbox | misc = Style.miscDefToList misc }
+
+ _ ->
+ Nothing
+ }
+ , Cmd.none
+ )
+
+ LoadedStyle (Err e) ->
+ ( model, Cmd.none )
+
+
+geojson : Json.Encode.Value
+geojson =
+ Json.Decode.decodeString Json.Decode.value """
+{
+ "type": "FeatureCollection",
+ "features": [
+ {
+ "type": "Feature",
+ "id": 1,
+ "properties": {
+ "name": "Bermuda Triangle",
+ "area": 1150180
+ },
+ "geometry": {
+ "type": "Polygon",
+ "coordinates": [
+ [
+ [-64.73, 32.31],
+ [-80.19, 25.76],
+ [-66.09, 18.43],
+ [-64.73, 32.31]
+ ]
+ ]
+ }
+ }
+ ]
+}
+""" |> Result.withDefault (Json.Encode.object [])
+
+
+hoveredFeatures : List Json.Encode.Value -> MapboxAttr msg
+hoveredFeatures =
+ List.map (\feat -> ( feat, [ ( "hover", Json.Encode.bool True ) ] ))
+ >> featureState
+
+
+showMap mapbox features =
+ case mapbox of
+ Just style ->
+ map
+ [ maxZoom 150
+ , onMouseMove Hover
+ , onClick Click
+ , id "my-map"
+ , eventFeaturesLayers [ "changes" ]
+ , hoveredFeatures features
+ ]
+ (Style
+ { style
+ | layers =
+ style.layers
+ ++ [ Layer.fill "changes"
+ "changes"
+ [ Layer.fillOpacity (E.ifElse (E.toBool (E.featureState (str "hover"))) (float 0.9) (float 0.1))
+ ]
+ ]
+ , sources =
+ style.sources
+ ++ [ Source.geoJSONFromValue "changes" [] geojson
+ ]
+ }
+ )
+
+ Nothing ->
+ Html.text "Nothing"
+
+
+view model =
+ { title = "Mapbox Example"
+ , body =
+ [ css
+ , div [ style "width" "100vw", style "height" "100vh" ]
+ [ lazy2 showMap model.jsonMap model.features
+ , div [ style "position" "absolute", style "bottom" "20px", style "left" "20px" ] [ text (LngLat.toString model.position) ]
+ ]
+ ]
+ }
diff --git a/examples/Map.elm b/examples/Map.elm
new file mode 100644
index 0000000..e8d13d5
--- /dev/null
+++ b/examples/Map.elm
@@ -0,0 +1,8 @@
+module Map exposing (layers)
+
+
+layers : String
+layers =
+ """
+[{"id": "background","type": "background","layout": {"visibility": "visible"},"paint": {"background-color": "#fff", "background-opacity": 1},"interactive": true},{"id": "waterway","type": "line","metadata": {"mapbox:group": "1452116608071.19"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "waterway","layout": {"visibility": "visible","line-cap": "round","line-join": "round"},"paint": {"line-width": 2,"line-color": "#62b0f0","line-blur": 0,"line-opacity": 0.7},"interactive": true},{"id": "water","type": "fill","metadata": {"mapbox:group": "1452116608071.19"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "water","layout": {"visibility": "visible"},"paint": {"fill-color": "#62b0f0","fill-opacity": 0.35,"fill-outline-color": "#62b0f0"},"interactive": true},{"id": "water outline","type": "line","metadata": {"mapbox:group": "1452116608071.19"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "water","layout": {},"paint": {"line-color": "#62b0f0", "line-width": 2, "line-blur": 1},"interactive": true},{"id": "water copy","type": "fill","metadata": {"mapbox:group": "1452116608071.19"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "water","layout": {"visibility": "visible"},"paint": {"fill-opacity": 0.35, "fill-color": "#fff"},"interactive": true},{"id": "snow copy","type": "fill","metadata": {"mapbox:group": "1452538953048.7173"},"source": "mapbox://mapbox.mapbox-terrain-v2","source-layer": "landcover","filter": ["==", "class", "snow"],"layout": {"visibility": "visible"},"paint": {"fill-color": "rgba(255,255,255,1)"},"interactive": true},{"id": "snowline copy","type": "line","metadata": {"mapbox:group": "1452538953048.7173"},"source": "mapbox://mapbox.mapbox-terrain-v2","source-layer": "landcover","filter": ["==", "class", "snow"],"layout": {"line-join": "round","line-cap": "round","visibility": "visible"},"paint": {"line-color": "#fff", "line-blur": 2},"interactive": true},{"id": "shadow 67 copy 2","type": "fill","metadata": {"mapbox:group": "1452538953048.7173"},"source": "mapbox://mapbox.mapbox-terrain-v2","source-layer": "hillshade","filter": ["all", ["==", "class", "shadow"], ["==", "level", 67]],"layout": {"visibility": "visible"},"paint": {"fill-color": "#62b0f0", "fill-opacity": 0.1},"interactive": true},{"id": "shadow 56 copy 2","type": "fill","metadata": {"mapbox:group": "1452538953048.7173"},"source": "mapbox://mapbox.mapbox-terrain-v2","source-layer": "hillshade","filter": ["all", ["==", "class", "shadow"], ["==", "level", 56]],"layout": {"visibility": "visible"},"paint": {"fill-opacity": 0.2, "fill-color": "#62b0f0"},"interactive": true},{"id": "shadow 78 copy 1","type": "fill","metadata": {"mapbox:group": "1452538953048.7173"},"source": "mapbox://mapbox.mapbox-terrain-v2","source-layer": "hillshade","filter": ["all", ["==", "class", "shadow"], ["==", "level", 78]],"layout": {"visibility": "visible"},"paint": {"fill-color": "rgba(128,128,128,1)","fill-opacity": 0.2,"fill-pattern": "paleblue-lines-32"},"interactive": true},{"id": "shadow 78 copy 2","type": "fill","metadata": {"mapbox:group": "1452538953048.7173"},"source": "mapbox://mapbox.mapbox-terrain-v2","source-layer": "hillshade","filter": ["all", ["==", "class", "shadow"], ["==", "level", 78]],"layout": {"visibility": "visible"},"paint": {"fill-color": "rgba(255,255,255,1)","fill-opacity": 0.8,"fill-pattern": "paleblue-lines-32"},"interactive": true},{"id": "shadow 78 (texture) copy","type": "fill","metadata": {"mapbox:group": "1452538953048.7173"},"source": "mapbox://mapbox.mapbox-terrain-v2","source-layer": "hillshade","filter": ["all", ["==", "class", "shadow"], ["==", "level", 78]],"layout": {"visibility": "visible"},"paint": {"fill-color": "rgba(128,128,128,1)","fill-pattern": "paleblue-lines-32","fill-translate": [3, 5],"fill-opacity": 0.15},"interactive": true},{"id": "highlight 89 copy 2","type": "fill","metadata": {"mapbox:group": "1452538953048.7173"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "landuse","filter": ["in", "class", "grass", "park", "wood"],"layout": {"visibility": "visible"},"paint": {"fill-color": "rgba(167,36,237,1)","fill-pattern": "paleblue-lines-32","fill-opacity": 0.25},"interactive": true},{"id": "shadow 67 copy 1","type": "fill","metadata": {"mapbox:group": "1452538953048.7173"},"source": "mapbox://mapbox.mapbox-terrain-v2","source-layer": "hillshade","filter": ["all", ["==", "class", "shadow"], ["==", "level", 67]],"layout": {"visibility": "visible"},"paint": {"fill-color": "rgba(128,128,128,1)","fill-opacity": 0.3,"fill-pattern": "paleblue-lines-32"},"interactive": true},{"id": "shadow 56 copy 1","type": "fill","metadata": {"mapbox:group": "1452538953048.7173"},"source": "mapbox://mapbox.mapbox-terrain-v2","source-layer": "hillshade","filter": ["all", ["==", "class", "shadow"], ["==", "level", 56]],"layout": {"visibility": "visible"},"paint": {"fill-color": "rgba(128,128,128,1)","fill-pattern": "paleblue-lines-32","fill-opacity": 0.2},"interactive": true},{"id": "highlight 94 copy","type": "fill","metadata": {"mapbox:group": "1452538953048.7173"},"source": "mapbox://mapbox.mapbox-terrain-v2","source-layer": "hillshade","filter": ["all",["==", "class", "highlight"],["==", "level", 94]],"layout": {"visibility": "visible"},"paint": {"fill-color": "rgba(252,252,252,1)", "fill-opacity": 1},"interactive": true},{"id": "highlight 89 copy","type": "fill","metadata": {"mapbox:group": "1452538953048.7173"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "landuse","filter": ["in", "class", "grass", "park", "wood"],"layout": {"visibility": "visible"},"paint": {"fill-color": "#fff", "fill-opacity": 0.5},"interactive": true},{"id": "highlight 89 copy 1","type": "fill","metadata": {"mapbox:group": "1452538953048.7173"},"source": "mapbox://mapbox.mapbox-terrain-v2","source-layer": "hillshade","filter": ["all",["==", "class", "highlight"],["==", "level", 89]],"layout": {"visibility": "visible"},"paint": {"fill-color": "rgba(167,36,237,1)","fill-pattern": "paleblue-lines-32"},"interactive": true},{"id": "shadow 78 (dotted) copy","type": "fill","metadata": {"mapbox:group": "1452538953048.7173"},"source": "mapbox://mapbox.mapbox-terrain-v2","source-layer": "hillshade","filter": ["all", ["==", "class", "shadow"], ["==", "level", 78]],"layout": {"visibility": "visible"},"paint": {"fill-color": "rgba(128,128,128,1)","fill-pattern": "13dot-blk16","fill-opacity": {"base": 1, "stops": [[14, 0], [18, 0.75]]},"fill-antialias": true,"fill-translate": [3, 5]},"interactive": true},{"id": "glacier bg","type": "fill","metadata": {"mapbox:group": "1452119469254.5605"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "landuse","filter": ["==", "type", "glacier"],"layout": {"visibility": "visible"},"paint": {"fill-color": "#fff","fill-opacity": {"base": 1,"stops": [[0, 1], [14, 0.5], [22, 0.3]]},"fill-outline-color": "#fff"},"interactive": true},{"id": "glacier outline","type": "line","metadata": {"mapbox:group": "1452119469254.5605"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "landuse","filter": ["==", "type", "glacier"],"layout": {"visibility": "visible"},"paint": {"line-color": "#62b0f0","line-width": {"base": 1, "stops": [[9, 0.5], [14, 1.5]]},"line-blur": 0.5,"line-dasharray": {"base": 1,"stops": [[0, [2, 1]], [14, [2, 4]]]}},"interactive": true},{"id": "glacier pattern - blue","type": "fill","metadata": {"mapbox:group": "1452119469254.5605"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "landuse","filter": ["==", "type", "glacier"],"layout": {"visibility": "visible"},"paint": {"fill-opacity": 0.6,"fill-pattern": "blue-widept-pattern","fill-translate-anchor": "map"},"interactive": true},{"id": "glacier pattern - blk","type": "fill","metadata": {"mapbox:group": "1452119469254.5605"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "landuse","filter": ["==", "type", "glacier"],"layout": {"visibility": "visible"},"paint": {"fill-opacity": 0.25,"fill-pattern": "blk-widept-pattern","fill-translate-anchor": "map","fill-translate": [0, 0]},"interactive": true},{"id": "contours","type": "line","metadata": {"mapbox:group": "1452037801360.402"},"source": "mapbox://mapbox.mapbox-terrain-v2","source-layer": "contour","layout": {"visibility": "visible"},"paint": {"line-color": "#62b0f0","line-opacity": {"base": 1, "stops": [[9, 0.4], [13, 1]]},"line-width": {"base": 1, "stops": [[9, 0.25], [14, 0.75]]}},"interactive": true},{"id": "index contour ","type": "line","metadata": {"mapbox:group": "1452037801360.402"},"source": "mapbox://mapbox.mapbox-terrain-v2","source-layer": "contour","filter": ["in", "index", 10, 5],"layout": {"visibility": "visible"},"paint": {"line-color": "#62b0f0","line-opacity": {"base": 1, "stops": [[9, 0.4], [18, 1]]},"line-width": {"base": 1, "stops": [[9, 1], [14, 2.5]]}},"interactive": true},{"id": "contour elevation","type": "symbol","metadata": {"mapbox:group": "1452037801360.402"},"source": "mapbox://mapbox.mapbox-terrain-v2","source-layer": "contour","filter": ["in", "index", 10, 5],"layout": {"text-field": "{ele}","symbol-placement": "line","text-rotation-alignment": "map","text-font": ["Tisa Offc Pro Medium","Arial Unicode MS Regular"],"text-size": {"base": 1, "stops": [[9, 9], [14, 12]]}},"paint": {"text-color": "#62b0f0","text-halo-color": "rgba(255,255,255,0.8)","text-halo-width": 2},"interactive": true},{"id": "road minor case","type": "line","metadata": {"mapbox:group": "1452294613743.9702"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "road","filter": ["all",["!in", "type", "aerialway", "piste"],["in","class","motorway_link","path","service","street","street_limited"]],"layout": {"visibility": "visible","line-cap": "butt","line-join": "round"},"paint": {"line-color": "rgba(219,219,217,1)","line-width": {"base": 1.55, "stops": [[4, 0.05], [20, 4]]},"line-gap-width": {"base": 1.44, "stops": [[4, 0.5], [20, 20]]}},"interactive": true},{"id": "road minor","type": "line","metadata": {"mapbox:group": "1452294613743.9702"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "road","filter": ["all",["!in", "type", "aerialway", "piste"],["in","class","motorway_link","path","service","street","street_limited"]],"layout": {"visibility": "visible","line-cap": "butt","line-join": "round"},"paint": {"line-width": {"base": 1.55, "stops": [[4, 0.25], [20, 20]]},"line-color": "#fff"},"interactive": true},{"id": "tunnel minor case","type": "line","metadata": {"mapbox:group": "1452294613743.9702"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "tunnel","filter": ["in","class","motorway_link","path","service","street","street_limited"],"layout": {"visibility": "visible","line-cap": "butt","line-join": "round"},"paint": {"line-color": "rgba(219,219,217,1)","line-width": {"base": 1.55, "stops": [[4, 0.05], [20, 4]]},"line-gap-width": {"base": 1.44, "stops": [[4, 0.5], [20, 20]]},"line-dasharray": [2, 2.5]},"interactive": true},{"id": "tunnel minor","type": "line","metadata": {"mapbox:group": "1452294613743.9702"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "tunnel","filter": ["in","class","motorway_link","path","service","street","street_limited"],"layout": {"visibility": "visible","line-cap": "butt","line-join": "round"},"paint": {"line-width": {"base": 1.55, "stops": [[4, 0.25], [20, 20]]},"line-color": "#fff","line-opacity": 0.6},"interactive": true},{"id": "bridge minor case","type": "line","metadata": {"mapbox:group": "1452294613743.9702"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "bridge","filter": ["in","class","motorway_link","path","service","street","street_limited"],"layout": {"visibility": "visible","line-cap": "butt","line-join": "round"},"paint": {"line-color": "rgba(219,219,217,1)","line-width": {"base": 1.55, "stops": [[4, 0.05], [20, 4]]},"line-gap-width": {"base": 1.44, "stops": [[4, 0.5], [20, 20]]}},"interactive": true},{"id": "bridge minor","type": "line","metadata": {"mapbox:group": "1452294613743.9702"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "bridge","filter": ["in","class","motorway_link","path","service","street","street_limited"],"layout": {"visibility": "visible","line-cap": "butt","line-join": "round"},"paint": {"line-width": {"base": 1.55, "stops": [[4, 0.25], [20, 20]]},"line-color": "#fff"},"interactive": true},{"id": "tunnel major case","type": "line","metadata": {"mapbox:group": "1452294613743.9702"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "tunnel","filter": ["in","class","main","major_rail","motorway","motorway_link"],"layout": {"visibility": "visible","line-cap": "butt","line-join": "round"},"paint": {"line-gap-width": {"base": 1.4, "stops": [[6, 0.5], [20, 25]]},"line-color": "rgba(219,219,217,1)","line-width": {"base": 1.4, "stops": [[6, 1], [22, 2]]},"line-dasharray": [2, 2.5]},"interactive": true},{"id": "tunnel major","type": "line","metadata": {"mapbox:group": "1452294613743.9702"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "tunnel","filter": ["in","class","main","major_rail","motorway","motorway_link"],"layout": {"visibility": "visible","line-cap": "butt","line-join": "round"},"paint": {"line-color": "#fff","line-width": {"base": 1.4, "stops": [[6, 0.5], [20, 25]]},"line-opacity": 0.6},"interactive": true},{"id": "bridge major case","type": "line","metadata": {"mapbox:group": "1452294613743.9702"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "bridge","filter": ["in","class","main","major_rail","motorway","motorway_link"],"layout": {"visibility": "visible","line-cap": "butt","line-join": "round"},"paint": {"line-gap-width": {"base": 1.4, "stops": [[6, 0.5], [20, 25]]},"line-color": "rgba(219,219,217,1)","line-width": {"base": 1.4, "stops": [[6, 1], [22, 2]]}},"interactive": true},{"id": "bridge major","type": "line","metadata": {"mapbox:group": "1452294613743.9702"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "bridge","filter": ["in","class","main","major_rail","motorway","motorway_link"],"layout": {"visibility": "visible","line-cap": "butt","line-join": "round"},"paint": {"line-color": "#fff","line-width": {"base": 1.4, "stops": [[6, 0.5], [20, 25]]}},"interactive": true},{"id": "road major case","type": "line","metadata": {"mapbox:group": "1452294613743.9702"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "road","filter": ["in","class","main","major_rail","motorway","motorway_link"],"layout": {"visibility": "visible","line-cap": "butt","line-join": "round"},"paint": {"line-gap-width": {"base": 1.4, "stops": [[6, 0.5], [20, 25]]},"line-color": "rgba(219,219,217,1)","line-width": {"base": 1.4, "stops": [[6, 1], [22, 2]]}},"interactive": true},{"id": "road major","type": "line","metadata": {"mapbox:group": "1452294613743.9702"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "road","filter": ["in","class","main","major_rail","motorway","motorway_link"],"layout": {"visibility": "visible","line-cap": "butt","line-join": "round"},"paint": {"line-color": "#fff","line-width": {"base": 1.4, "stops": [[6, 0.5], [20, 25]]}},"interactive": true},{"id": "minor streets","type": "line","metadata": {"mapbox:group": "1452119539441.3816"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "road","filter": ["all",["!in", "type", "aerialway", "cycleway", "footway", "piste"],["in", "class", "driveway", "path", "service", "street_limited"]],"layout": {"visibility": "visible"},"paint": {"line-color": "rgba(201,197,197,1)","line-opacity": 1,"line-width": 0.5},"interactive": true},{"id": "footway","type": "line","metadata": {"mapbox:group": "1452119539441.3816"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "road","filter": ["all",["==", "class", "path"],["==", "type", "footway"]],"layout": {"visibility": "visible"},"paint": {"line-color": "rgba(143,140,140,1)","line-dasharray": [5, 2]},"interactive": true},{"id": "cycleway","type": "line","metadata": {"mapbox:group": "1452119539441.3816"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "road","filter": ["all",["==", "class", "path"],["==", "type", "cycleway"]],"layout": {"visibility": "visible"},"paint": {"line-color": "rgba(97,151,201,1)","line-dasharray": [5, 3],"line-opacity": 1},"interactive": true},{"id": "piste","type": "line","metadata": {"mapbox:group": "1452119539441.3816"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "road","filter": ["all", ["==", "class", "path"], ["==", "type", "piste"]],"layout": {"visibility": "visible"},"paint": {"line-color": "rgba(107,105,105,1)","line-width": {"base": 1, "stops": [[15, 1.5], [18, 3]]}},"interactive": true},{"id": "chair_lift","type": "line","metadata": {"mapbox:group": "1452119539441.3816"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "bridge","filter": ["all",["==", "class", "aerialway"],["in", "type", "cable_car", "chair_lift", "drag_lift"]],"layout": {"visibility": "visible"},"paint": {"line-color": {"base": 1,"stops": [[11, "rgba(163,163,163,1)"],[15, "rgba(171,169,169,1)"]]},"line-dasharray": [1, 0],"line-width": {"base": 1, "stops": [[11, 0.75], [16, 1.5]]}},"interactive": true},{"id": "chair_lift ticks","type": "line","metadata": {"mapbox:group": "1452119539441.3816"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "bridge","filter": ["all",["==", "class", "aerialway"],["in", "type", "cable_car", "chair_lift", "drag_lift"]],"layout": {"visibility": "visible","line-cap": "square","line-join": "bevel"},"paint": {"line-color": {"base": 1,"stops": [[11, "rgba(163,163,163,1)"],[15, "rgba(171,169,169,1)"]]},"line-dasharray": {"base": 1,"stops": [[11, [0.1, 2]], [17, [0.25, 4]], [22, [0.5, 6]]]},"line-translate-anchor": "viewport","line-width": {"base": 1, "stops": [[11, 4], [17, 8], [22, 12]]}},"interactive": true},{"id": "gondola","type": "line","metadata": {"mapbox:group": "1452119539441.3816"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "bridge","filter": ["==", "type", "gondola"],"layout": {"visibility": "visible"},"paint": {"line-color": {"base": 1,"stops": [[11, "rgba(163,163,163,1)"],[15, "rgba(171,169,169,1)"]]},"line-dasharray": [1, 0],"line-width": {"base": 1, "stops": [[11, 0.75], [18, 1.25]]}},"interactive": true},{"id": "gondola dots","type": "line","metadata": {"mapbox:group": "1452119539441.3816"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "bridge","filter": ["==", "type", "gondola"],"layout": {"visibility": "visible","line-cap": "butt","line-join": "round"},"paint": {"line-color": {"base": 1,"stops": [[11, "rgba(163,163,163,1)"],[15, "rgba(171,169,169,1)"]]},"line-dasharray": {"base": 1,"stops": [[11, [0.75, 1]], [17, [1, 2.5]]]},"line-width": {"base": 1, "stops": [[11, 2], [17, 3]]}},"interactive": true},{"id": "building","type": "line","metadata": {"mapbox:group": "1452123103210.5454"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "building","layout": {},"paint": {"line-color": {"base": 1,"stops": [[14, "rgba(10,10,10,1)"],[22, "rgba(120,120,120,1)"]]},"line-blur": 0.5,"line-opacity": {"base": 1,"stops": [[14, 0.05], [18, 0.5], [22, 1]]}},"interactive": true},{"id": "building copy","type": "fill","metadata": {"mapbox:group": "1452123103210.5454"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "building","layout": {},"paint": {"fill-pattern": "thin-diagonal-lines-blk32","fill-opacity": {"base": 1, "stops": [[14, 0.4], [18, 0.6]]}},"interactive": true},{"id": "boundaries","type": "line","metadata": {"mapbox:group": "1452377264560.7012"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "admin","filter": ["==", "maritime", 0],"layout": {"visibility": "visible", "line-join": "bevel"},"paint": {"line-color": "rgba(120,119,119,1)","line-dasharray": {"base": 1,"stops": [[0, [3, 2]], [8, [2, 1]], [14, [3, 4]]]},"line-width": {"base": 1,"stops": [[0, 0.25], [4, 1], [8, 2], [14, 5]]},"line-opacity": {"base": 1, "stops": [[0, 0.3], [6, 1]]}},"interactive": true},{"id": "maritime","type": "line","metadata": {"mapbox:group": "1452377264560.7012"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "admin","filter": ["==", "maritime", 1],"layout": {"visibility": "none"},"paint": {"line-color": "rgba(120,119,119,1)","line-dasharray": [1, 0],"line-width": {"base": 1,"stops": [[0, 0.5], [8, 1], [14, 2], [22, 4]]},"line-opacity": {"base": 1, "stops": [[0, 0.3], [6, 1]]}},"interactive": true},{"id": "maritime copy","type": "line","metadata": {"mapbox:group": "1452377264560.7012"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "admin","filter": ["==", "maritime", 1],"layout": {"visibility": "visible"},"paint": {"line-color": "rgba(129,176,214,1)","line-dasharray": [1, 0],"line-width": {"base": 1,"stops": [[0, 0.25], [4, 1], [8, 2.5], [14, 4], [22, 8]]},"line-opacity": {"base": 1, "stops": [[0, 0.3], [6, 1]]}},"interactive": true},{"id": "maritime copy 1","type": "line","metadata": {"mapbox:group": "1452377264560.7012"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "admin","filter": ["==", "maritime", 1],"layout": {"visibility": "visible"},"paint": {"line-color": "rgba(129,176,214,1)","line-dasharray": [1, 0],"line-width": {"base": 1,"stops": [[4, 1], [8, 2.5], [14, 4], [22, 8]]},"line-opacity": {"base": 1, "stops": [[0, 0.3], [6, 1]]},"line-blur": 4},"interactive": true},{"id": "POI labels","type": "symbol","metadata": {"mapbox:group": "1452214567277.007"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "poi_label","filter": ["in","type","Alpine Hut","Attraction","Bed And Breakfast","Biergarten","Golf Course","Hotel","Yes"],"layout": {"visibility": "visible","text-field": "{name_en}","text-size": {"base": 1, "stops": [[15, 10], [18, 12]]},"text-font": ["Tisa Offc Pro Bold", "Arial Unicode MS Regular"]},"paint": {"text-opacity": 0.75,"text-color": "rgba(15,15,15,1)","text-halo-color": "rgba(255,255,255,1)","text-halo-blur": 0,"text-halo-width": 1.5},"interactive": true},{"id": "path label","type": "symbol","metadata": {"mapbox:group": "1452214567277.007"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "road_label","filter": ["==", "class", "path"],"layout": {"text-size": {"base": 1.4, "stops": [[14, 9.5], [22, 14]]},"text-max-angle": 45,"text-transform": "uppercase","text-font": ["Noto Sans CJK KR Medium","Arial Unicode MS Regular"],"symbol-placement": "line","visibility": "visible","text-offset": [0, -0.1],"text-rotation-alignment": "map","text-anchor": "center","text-field": "{name}"},"paint": {"text-color": "rgba(48,47,47,1)","text-halo-color": "rgba(252,252,252,1)","text-halo-width": 21},"interactive": true},{"id": "chairlift aerialway label","type": "symbol","metadata": {"mapbox:group": "1452214567277.007"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "road_label","filter": ["==", "class", "aerialway"],"layout": {"text-size": {"base": 1, "stops": [[15, 10], [22, 14]]},"text-max-angle": 0,"text-font": ["Noto Sans CJK KR DemiLight","Arial Unicode MS Regular"],"symbol-placement": "line","visibility": "visible","text-offset": {"base": 1,"stops": [[15, [0, 1.5]], [20, [0, 2.5]]]},"text-rotation-alignment": "map","text-anchor": "bottom","text-field": "{name}"},"paint": {"text-halo-color": "#fff","text-color": "rgba(69,68,68,1)","text-translate": {"base": 1,"stops": [[14, [15, 0]], [22, [40, 0]]]},"text-halo-width": 2,"text-halo-blur": 1},"interactive": true},{"id": "water-label","type": "symbol","metadata": {"mapbox:group": "1452214567277.007"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "water_label","layout": {"text-size": {"base": 1,"stops": [[10, 9], [16, 14], [22, 20]]},"text-transform": "uppercase","text-font": ["Noto Sans CJK KR Medium","Arial Unicode MS Regular"],"symbol-placement": "point","visibility": "visible","text-rotation-alignment": "map","text-keep-upright": {"base": 1,"stops": [[0, true], [22, true]]},"text-field": "{name}","text-rotate": -45,"text-letter-spacing": {"base": 1,"stops": [[9, 0.5], [14, 1]]},"text-max-width": 20},"paint": {"text-color": "#62b0f0","text-halo-color": "rgba(252,252,252,0.8)","text-halo-width": {"base": 1, "stops": [[14, 1], [22, 2]]}},"interactive": true},{"id": "water-label (lg)","type": "symbol","metadata": {"mapbox:group": "1452214567277.007"},"source": "mapbox://mapbox.mapbox-streets-v6","source-layer": "water_label","filter": [">=", "area", "258500"],"layout": {"text-size": {"base": 1,"stops": [[10, 10], [16, 16], [22, 22]]},"text-transform": "uppercase","text-font": ["Noto Sans CJK KR Medium","Arial Unicode MS Regular"],"symbol-placement": "point","visibility": "none","text-rotation-alignment": "map","text-keep-upright": {"base": 1,"stops": [[0, true], [22, true]]},"text-field": "{name}","text-rotate": -45,"text-letter-spacing": {"base": 1,"stops": [[9, 0.5], [14, 1]]},"text-max-width": 20},"paint": {"text-color": "#62b0f0","text-halo-color": "rgba(252,252,252,0.8)","text-halo-width": {"base": 1, "stops": [[14, 1], [22, 2]]}},"interactive": true},{"id": "waterway-label","type": "symbol","met