LineChart.Axis.Line

If you're confused as to what "axis range" and "data range" means, check out Axis.Range for an explanation!

type alias Config msg =

Config msg

This configuration is part of the configuration in Axis.custom.

axisConfig : Axis.Config Data msg
axisConfig =
  Axis.custom
    { ..
    , range = AxisLine.default
    , ...
    }

See full example here.

default : Config msg

Draws the full length of your axis range.

axisLineConfig : AxisLine.Config msg
axisLineConfig =
  AxisLine.default

See full example here.

full : Color -> Config msg

Same as the default, except you get to pick the color.

axisLineConfig : AxisLine.Config msg
axisLineConfig =
  AxisLine.full Color.red

See full example here.

rangeFrame : Color -> Config msg

Draws the full length of your data range in your given color.

axisLineConfig : AxisLine.Config msg
axisLineConfig =
  AxisLine.rangeFrame Color.red

See full example here.

none : Config msg

Removes the axis line entirely.

axisLineConfig : AxisLine.Config msg
axisLineConfig =
  AxisLine.none

See full example here.

custom : (Range -> Range -> Properties msg) -> Config msg

Given your data range and axis range respectively, define your own axis line configuration.

axisLineConfig : AxisLine.Config msg
axisLineConfig =
  AxisLine.custom <| \dataRange axisRange ->
    { color = Colors.gray
    , width = 2
    , events = []
    , start = dataRange.min
    , end = 5
    }

See full example here.

type alias Properties msg =

{ color : Color

, width : Float

, events : List (Attribute msg)

, start : Float

, end : Float

}

terezka/line-charts/2.0.2

LineChart.Axis.Line

Modules