From 181401c4ffd06c127c57e27e2e88b05f7fdd1f88 Mon Sep 17 00:00:00 2001 From: Jakub Hampl Date: Mon, 25 Jun 2018 13:59:42 +0100 Subject: Fix issue with passing in token --- examples/Example01.elm | 93 ++++++++++++++++++++++++++++++++++++++++++++++++++ examples/Light.elm | 49 -------------------------- 2 files changed, 93 insertions(+), 49 deletions(-) create mode 100644 examples/Example01.elm delete mode 100644 examples/Light.elm (limited to 'examples') diff --git a/examples/Example01.elm b/examples/Example01.elm new file mode 100644 index 0000000..cac4bf9 --- /dev/null +++ b/examples/Example01.elm @@ -0,0 +1,93 @@ +module Example01 exposing (main) + +import Html exposing (div, text) +import Html.Attributes exposing (style) +import Json.Decode exposing (Value) +import Json.Encode +import MapCommands +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 = + Html.program + { init = init + , view = view + , update = update + , subscriptions = \m -> Sub.none + } + + +init = + ( { position = ( 0, 0 ), selectedFeatures = [] }, Cmd.none ) + + +type Msg + = Hover EventData + | Click EventData + + +mapPair f ( a, b ) = + ( f a, f b ) + + +update msg model = + case msg of + Hover { lngLat, renderedFeatures } -> + ( { model | position = lngLat, selectedFeatures = renderedFeatures }, Cmd.none ) + + Click { lngLat } -> + ( model, MapCommands.fitBounds [ MapCommands.linear True ] ( mapPair (\a -> a - 0.2) lngLat, mapPair (\a -> a + 0.2) lngLat ) ) + + +view model = + div [ style [ ( "width", "100vw" ), ( "height", "100vh" ) ] ] + [ css + , map + [ maxZoom 5 + , onMouseMove Hover + , onClick Click + , id "my-map" + , model.selectedFeatures + |> List.map (\f -> ( f, [ ( "hover", Json.Encode.bool True ) ] )) + |> featureState + ] + (Style + { transition = Style.defaultTransition + , light = Style.defaultLight + , sources = + [ Source.vectorFromUrl "composite" "mapbox://mapbox.mapbox-terrain-v2,mapbox.mapbox-streets-v7,astrosat.07pz1g3y" ] + , misc = + [ Style.name "light" + , Style.defaultCenter 20.39789404164037 43.22523201923144 + , Style.defaultZoomLevel 1.5967483759772743 + , Style.sprite "mapbox://sprites/astrosat/cjht22eqw0lfc2ro6z0qhlm29" + , Style.glyphs "mapbox://fonts/astrosat/{fontstack}/{range}.pbf" + ] + , layers = + [ Layer.background "background" + [ E.rgba 246 246 244 1 |> Layer.backgroundColor + ] + , Layer.fill "landcover" + "composite" + [ Layer.sourceLayer "landcover" + , E.any + [ E.getProperty (str "class") |> E.isEqual (str "wood") + , E.getProperty (str "class") |> E.isEqual (str "scrub") + , E.getProperty (str "class") |> E.isEqual (str "grass") + , E.getProperty (str "class") |> E.isEqual (str "crop") + ] + |> Layer.filter + + -- , Layer.fillColor (E.rgba 227 227 227 1) + , Layer.fillColor (E.ifElse (E.coalesce [ (E.featureState (str "hover")), false ]) (E.rgba 20 227 227 1) (E.rgba 227 227 227 1)) + , Layer.fillOpacity (float 0.6) + ] + ] + } + ) + , div [ style [ ( "position", "absolute" ), ( "bottom", "20px" ), ( "left", "20px" ) ] ] [ text (toString model.position) ] + ] diff --git a/examples/Light.elm b/examples/Light.elm deleted file mode 100644 index a83308a..0000000 --- a/examples/Light.elm +++ /dev/null @@ -1,49 +0,0 @@ -module Light exposing (main) - -import Html exposing (text, pre) -import Json.Encode -import Mapbox.Expression exposing (..) -import Mapbox.Layer as Layer -import Mapbox.Source as Source -import Mapbox.Style as Style - - -style = - Style.encode - { transition = Style.defaultTransition - , light = Style.defaultLight - , sources = - [ Source.vectorFromUrl "composite" "mapbox://mapbox.mapbox-terrain-v2,mapbox.mapbox-streets-v7" ] - , misc = - [ Style.name "light" - , Style.defaultCenter 20.39789404164037 43.22523201923144 - , Style.defaultZoomLevel 1.5967483759772743 - , Style.sprite "mapbox://sprites/seppotamminen/cjascxlb86kfe2rrvvtkd4ay1" - , Style.glyphs "mapbox://fonts/seppotamminen/{fontstack}/{range}.pbf" - ] - , layers = - [ Layer.background "background" - [ getProperty (str "emotion") - |> matchesStr (rgba 55 22 32 1) [ ( "funny", rgba 20 200 20 1 ), ( "angry", rgba 200 20 20 1 ) ] - |> Layer.backgroundColor - , zoom - |> interpolate Linear - [ ( 5, int 1 ) - , ( 10, int 5 ) - ] - |> Layer.circleRadius - , makeRGBColor - -- red is higher when feature.properties.temperature is higher - (getProperty (str "temperature")) - -- green is always zero - (int 0) - -- blue is higher when feature.properties.temperature is lower - (getProperty (str "temperature") |> minus (int 100)) - |> Layer.circleColor - ] - ] - } - - -main = - pre [] [ text <| Json.Encode.encode 2 style ] -- cgit v1.2.3