terezka/elm-plot/3.0.0

NOTE: this package is not compatible with Elm 0.19.1

Plot.Label

Attributes for altering the values and view of your axis' labels.

Before you read any further, please note that when I speak of the label index, then I'm talking about how many labels that particular label is from the origin.

Ok, now you can go on!

Definition

type alias Attribute msg =
Config msg -> Config msg

Styling

type alias StyleAttribute msg =
StyleConfig msg -> StyleConfig msg
view : List (StyleAttribute msg) -> Attribute msg

Provide a list of style attributes to alter the view of the label.

myYAxis : Plot.Element msg
myYAxis =
    Plot.yAxis
        [ Axis.label
            [ Label.view
                [ Label.classes [ "label-class" ]
                , Label.displace ( 12, 0 )
                ]
            ]
        ]

Note: If you add another attribute altering the view like viewDynamic or viewCustom after this attribute, then this attribute will have no effect.

viewDynamic : (( Int, Float ) -> List (StyleAttribute msg)) -> Attribute msg

Alter the view of the label based on the label's value and index (amount of ticks from origin) by providing a function returning a list of style attributes.

toViewStyles : Int -> Float -> List Label.StyleAttribute a
toViewStyles index value =
    if isOdd index then
        [ Label.classes [ "label--odd" ]
        , Label.displace ( 12, 0 )
        ]
    else
        [ Label.classes [ "label--even" ]
        , Label.displace ( 16, 0 )
        ]


myYAxis : Plot.Element msg
myYAxis =
    Plot.yAxis
        [ Axis.label
            [ Label.viewDynamic toViewStyles ]
        ]

Note: If you add another attribute altering the view like view or viewCustom after this attribute, then this attribute will have no effect.

viewCustom : (( Int, Float ) -> Svg msg) -> Attribute msg

Define your own view for the labels. Your view will be passed label's value and index (amount of ticks from origin).

viewLabel : Int -> Float -> Svg.Svg a
viewLabel index value =
    let
        attrs =
            if isOdd index then oddAttrs else evenAttrs
    in
        text_ attrs (toString value)


myYAxis : Plot.Element msg
myYAxis =
    Plot.yAxis
        [ Axis.label
            [ Label.viewCustom viewLabel ]
        ]

Note: If you add another attribute altering the view like view or viewDynamic after this attribute, then this attribute will have no effect.

Style attributes

If these attributes do not forfill your needs, try out the viewCustom! If you have a suspicion that I have missed a very common configuration, then please let me know and I'll add it.

classes : List String -> StyleAttribute a

Adds classes to the label.

myYAxis : Plot.Element msg
myYAxis =
    Plot.yAxis
        [ Axis.label
            [ Label.view
                [ Label.classes [ "my-class" ] ]
            ]
        ]
displace : ( Int, Int ) -> StyleAttribute a

Displaces the label.

myYAxis : Plot.Element msg
myYAxis =
    Plot.yAxis
        [ Axis.label
            [ Label.view
                [ Label.displace ( 12, 0 ) ]
            ]
        ]
format : (( Int, Float ) -> String) -> StyleAttribute a

Format the label based on its value and index.

formatter : Int -> Float -> String
formatter index value =
    if isDivisibleBy5 index then
        formatEveryFifth value
    else
        normalFormat value


myYAxis : Plot.Element msg
myYAxis =
    Plot.yAxis
        [ Axis.label
            [ Label.view
                [ Label.format formatter ]
            ]
        ]
stroke : String -> StyleAttribute a

Set the stroke color.

strokeWidth : Int -> StyleAttribute a

Set the stroke width (in pixels).

opacity : Float -> StyleAttribute a

Set the opacity.

fill : String -> StyleAttribute a

Set the fill color.

fontSize : Int -> StyleAttribute a

Set the font size (in pixels).

customAttrs : List (Attribute a) -> StyleAttribute a

Add your own attributes. For events, see this example

Values

values : List Float -> Attribute msg

Specify the values which you want a label for.

myYAxis : Plot.Element msg
myYAxis =
    Plot.yAxis
        [ Axis.label
            [ Label.values [ 0, 5, 10, 11 ] ]
        ]

Note: If you add another attribute altering the values like filter after this attribute, then this attribute will have no effect.

filter : (( Int, Float ) -> Bool) -> Attribute msg

Add a filter determining which of the tick values are added a label. Your filter will be passed label's value and index (amount of ticks from origin).

myYAxis : Plot.Element msg
myYAxis =
    Plot.yAxis
        [ Axis.label
            [ Label.filter onlyEven ]
        ]

Note: If you add another attribute altering the values like values after this attribute, then this attribute will have no effect.