Functions for creating a maps program and maniuplating the maps model.
You can use the functions below to display a map.
import Html.Styled as Html exposing (program)
import Maps
main =
program
{ init = ( Maps.defaultModel, Cmd.none )
, subscriptions = Maps.subscriptions
, update = Maps.update
, view = Maps.view
}
defaultModel : Model msg
The default model is a map zoomed into Sydney, Australia with no markers.
subscriptions : Model msg -> Platform.Sub.Sub (Msg msg)
update : Msg msg -> Model msg -> ( Model msg, Platform.Cmd.Cmd (Msg msg) )
view : Model msg -> Html.Styled.Html (Msg msg)
mapView : (Msg msg -> msg) -> Html.Styled.Html (Msg msg) -> Html.Styled.Html msg
Transforms the Maps HTML view into an arbitrary HTML view.
Requires a function that can transform Maps.Msg
s into msg
s.
import Html.Styled as Html
import Html.Styled.Event exposing (onClick)
import Maps
type MyMsg = Click | MapsMsg Maps.Msg
...
view msg model =
Html.div
[]
[ Maps.view model.map |> Maps.mapView MapsMsg
, Html.button [ onClick Click ] [ Html.text "Click!" ]
]
updateMap : (Map -> Map) -> Model msg -> Model msg
Change the map inside of a model.
For example, set the width/height of a map and zoom into Seoul, South Korea:
import Maps.Geo
import Maps.Map as Map
let
seoul = Maps.Geo.latLng 37.532600 127.024612
in
model
|> updateMap (Map.setHeight 600)
|> updateMap (Map.setWidth 1000)
|> updateMap (Map.viewBounds <| Maps.Geo.centeredBounds 10 seoul)
See Maps.Map for documentation of the Map functions.
updateMarkers : (List (Marker msg) -> List (Marker msg)) -> Model msg -> Model msg
Change the markers inside of the model
For example, add markers for some Sydney attractions and then another marker for the city center:
import Maps.Geo
import Maps.Marker as Marker
let
attractions =
List.map (uncurry Maps.Geo.latLng)
[ (-33.852324, 151.210819)
, (-33.856872, 151.215239)
, (-33.870397, 151.208835)
]
sydney = Maps.Geo.latLng -33.865143 151.209900
in
model
|> updateMarkers (\markers -> List.map Marker.create attractions ++ markers)
|> updateMarkers ((::) (Marker.create sydney))
See Maps.Marker for documentation of the Marker functions.
The following types are opaque. Use the functions above to maniuplate and extract information from them.
Internal.Msg msg
Internal.OpaqueTypes.Model msg