andre-dietrich / elm-mapbox / Mapbox.Style

A Mapbox style is a document that defines the visual appearance of a map: what data to draw, the order to draw it in, and how to style the data when drawing it. A style document is a JSON object with specific root level and nested properties. This specification defines and describes these properties.


type Style
    = Style StyleDef
    | FromUrl String

A mapbox style.

You can either create a style spec in Elm (for which the rest of this library is useful :) or load one from a remote URL.

To load a style from the Mapbox API, you can use a URL of the form FromUrl "mapbox://styles/:owner/:style", where :owner is your Mapbox account name and :style is the style ID.

encode : Style -> Json.Encode.Value

Encodes the style into JSON.


type alias StyleDef =
{ transition : Transition
, light : Light
, layers : List Mapbox.Layer.Layer
, sources : List Mapbox.Source.Source
, misc : List MiscAttr 
}

This is the core representation of a Mapbox style. It has the following keys:

Layers

These define what is actually rendered on screen. See the Mapbox.Layer module on how to configure these.

Sources

These define the data sources that feed the Layers. See the Mapbox.Source module for more.

Misc

These are all optional attributes.

All the other keys are values defined below.

decode : Json.Decode.Decoder StyleDef


type alias MiscDef =
{ sprite : Maybe MiscAttr
, glyphs : Maybe MiscAttr
, name : Maybe MiscAttr
, center : Maybe MiscAttr
, zoom : Maybe MiscAttr
, bearing : Maybe MiscAttr
, pitch : Maybe MiscAttr
, meta : Maybe MiscAttr 
}

A simple record to be used, when a style is read from a json file.

use decodeMiscDef json to read out default values, you can reset them by setting them to Nothing use afterwards miscDefToList to generate a misc-list to be used in your StyleDef.

decodeMiscDef : Json.Decode.Decoder MiscDef

miscDefToList : MiscDef -> List MiscAttr

Light


type alias Light =
{ anchor : Mapbox.Expression.Expression Mapbox.Expression.CameraExpression { map : Internal.Supported
, viewport : Internal.Supported }
, position : Mapbox.Expression.Expression Mapbox.Expression.CameraExpression (Array Basics.Float)
, color : Mapbox.Expression.Expression Mapbox.Expression.CameraExpression Mapbox.Expression.Color
, intensity : Mapbox.Expression.Expression Mapbox.Expression.CameraExpression Basics.Float 
}

The global light source.

anchor

Whether extruded geometries are lit relative to the map or viewport.

position

Position of the light source relative to lit (extruded) geometries, in [r radial coordinate, a azimuthal angle, p polar angle] where r indicates the distance from the center of the base of an object to its light, a indicates the position of the light relative to 0° (0° when the anchor is set to viewport corresponds to the top of the viewport, or 0° when anchor is set to map corresponds to due north, and degrees proceed clockwise), and p indicates the height of the light (from 0°, directly above, to 180°, directly below).

color

Color tint for lighting extruded geometries.

intensity

Intensity of lighting (on a scale from 0 to 1). Higher numbers will present as more extreme contrast.

defaultLight : Light

A decent default light.

Transition


type alias Transition =
{ duration : Basics.Int
, delay : Basics.Int 
}

A transition property controls timing for the interpolation between a transitionable style property's previous value and new value.

duration

Time (in ms) allotted for transitions to complete.

delay

Length of time (in ms) before a transition begins.

defaultTransition : Transition

The defaults for a transition

Misc Attributes


type MiscAttr

sprite : String -> MiscAttr

A base URL for retrieving the sprite image and metadata. The extensions .png, .json and scale factor @2x.png will be automatically appended. This property is required if any layer uses the backgroundPattern, fillPattern, linePattern, fillExtrusionPattern, or iconImage properties.

glyphs : String -> MiscAttr

A URL template for loading signed-distance-field glyph sets in PBF format. The URL must include {fontstack} and {range} tokens. This property is required if any layer uses the textField layout property.

name : String -> MiscAttr

A human-readable name for the style.

defaultCenter : LngLat -> MiscAttr

Default map center in longitude and latitude. The style center will be used only if the map has not been positioned by other means (e.g. map options or user interaction).

defaultZoomLevel : Basics.Float -> MiscAttr

Default zoom level. The style zoom will be used only if the map has not been positioned by other means (e.g. map options or user interaction).

defaultBearing : Basics.Float -> MiscAttr

Default bearing, in degrees. The bearing is the compass direction that is "up"; for example, a bearing of 90° orients the map so that east is up. This value will be used only if the map has not been positioned by other means (e.g. map options or user interaction).

defaultPitch : Basics.Float -> MiscAttr

Default pitch, in degrees. Zero is perpendicular to the surface, for a look straight down at the map, while a greater value like 60 looks ahead towards the horizon. The style pitch will be used only if the map has not been positioned by other means (e.g. map options or user interaction).

metadata : List ( String, Json.Encode.Value ) -> MiscAttr

Arbitrary properties useful to track with the stylesheet, but do not influence rendering. Properties should be prefixed to avoid collisions, like 'mapbox:'.

Predefined styles

You can also use one of these predefined styles.

streets : Style

outdoors : Style

light : Style

dark : Style

satellite : Style

satelliteStreets : Style