Waterfall Charts

BinderScriptNotebook

Summary: This example shows how to create waterfall charts in F#.

Waterfall charts are special bar charts that help visualizing the cumulative effect of sequentially introduced positive or negative values.

In addition to the x and y values, a WaterfallMeasure can be passed corresponding to each xy pair (there is also a constructor overload using a tripel of x,y,measure). By default the values are considered as 'relative'. However; it is possible to use 'total' to compute the sums. Also 'absolute' could be applied to reset the computed total or to declare an initial value where needed.

open Plotly.NET 
open Plotly.NET.TraceObjects
open Plotly.NET.LayoutObjects

let waterfall1 =
    Chart.Waterfall(
        x = ["Sales"; "Consulting"; "Net revenue"; "Purchases"; "Other expenses"; "Profit before tax"],
        y = [60; 80; 0; -40; -20; 0],
        Measure = [
            StyleParam.WaterfallMeasure.Relative
            StyleParam.WaterfallMeasure.Relative
            StyleParam.WaterfallMeasure.Total
            StyleParam.WaterfallMeasure.Relative
            StyleParam.WaterfallMeasure.Relative
            StyleParam.WaterfallMeasure.Total
        ]
    )

Horizontal waterfall charts

Set the orientation argument to Horizontal to create a horizontal waterfall. Keep in mind to correctly assign x and y values (the vallues are switched on the axes in comparison to the chart example above) To keep better track of which measure belongs to which datum, use

let waterfall2 =
    Chart.Waterfall(
        xymeasures = [
             60 , "Sales"             , StyleParam.WaterfallMeasure.Relative
             80 , "Consulting"        , StyleParam.WaterfallMeasure.Relative
             0  , "Net revenue"       , StyleParam.WaterfallMeasure.Total
             -40, "Purchases"         , StyleParam.WaterfallMeasure.Relative
             -20, "Other expenses"    , StyleParam.WaterfallMeasure.Relative
             0  , "Profit before tax" , StyleParam.WaterfallMeasure.Total
        ],
        Orientation = StyleParam.Orientation.Horizontal
    )
namespace Plotly
namespace Plotly.NET
namespace Plotly.NET.TraceObjects
namespace Plotly.NET.LayoutObjects
val waterfall1 : GenericChart.GenericChart
type Chart = static member AnnotatedHeatmap : zData:seq<#seq<'a1>> * annotationText:seq<#seq<string>> * ?Name:string * ?ShowLegend:bool * ?Opacity:float * ?X:seq<#IConvertible> * ?XGap:int * ?Y:seq<#IConvertible> * ?YGap:int * ?Text:'a5 * ?MultiText:seq<'a5> * ?ColorBar:ColorBar * ?ColorScale:Colorscale * ?ShowScale:bool * ?ReverseScale:bool * ?ZSmooth:SmoothAlg * ?Transpose:bool * ?UseWebGL:bool * ?ReverseYAxis:bool * ?UseDefaults:bool -> GenericChart (requires 'a1 :> IConvertible and 'a5 :> IConvertible) static member Area : x:seq<#IConvertible> * y:seq<#IConvertible> * ?Name:string * ?ShowMarkers:bool * ?ShowLegend:bool * ?MarkerSymbol:MarkerSymbol * ?Color:Color * ?Opacity:float * ?Labels:seq<#IConvertible> * ?TextPosition:TextPosition * ?TextFont:Font * ?Dash:DrawingStyle * ?Width:float * ?UseDefaults:bool -> GenericChart + 1 overload static member Bar : values:seq<#IConvertible> * ?Keys:seq<#IConvertible> * ?Name:string * ?ShowLegend:bool * ?Opacity:float * ?MultiOpacity:seq<float> * ?Text:'a2 * ?MultiText:seq<'a2> * ?MarkerColor:Color * ?MarkerColorScale:Colorscale * ?MarkerOutline:Line * ?MarkerPatternShape:PatternShape * ?MultiMarkerPatternShape:seq<PatternShape> * ?MarkerPattern:Pattern * ?Marker:Marker * ?Base:#IConvertible * ?Width:'a4 * ?MultiWidth:seq<'a4> * ?TextPosition:TextPosition * ?MultiTextPosition:seq<TextPosition> * ?UseDefaults:bool -> GenericChart (requires 'a2 :> IConvertible and 'a4 :> IConvertible) + 1 overload static member BoxPlot : ?x:seq<#IConvertible> * ?y:seq<#IConvertible> * ?Name:string * ?ShowLegend:bool * ?Text:'a2 * ?MultiText:seq<'a2> * ?Fillcolor:Color * ?MarkerColor:Color * ?OutlierColor:Color * ?OutlierWidth:int * ?Opacity:float * ?WhiskerWidth:float * ?BoxPoints:BoxPoints * ?BoxMean:BoxMean * ?Jitter:float * ?PointPos:float * ?Orientation:Orientation * ?Marker:Marker * ?Line:Line * ?AlignmentGroup:string * ?Offsetgroup:string * ?Notched:bool * ?NotchWidth:float * ?QuartileMethod:QuartileMethod * ?UseDefaults:bool -> GenericChart (requires 'a2 :> IConvertible) + 1 overload static member Bubble : x:seq<#IConvertible> * y:seq<#IConvertible> * sizes:seq<int> * ?Name:string * ?ShowLegend:bool * ?Opacity:float * ?MultiOpacity:seq<float> * ?Text:'a2 * ?MultiText:seq<'a2> * ?TextPosition:TextPosition * ?MultiTextPosition:seq<TextPosition> * ?MarkerColor:Color * ?MarkerColorScale:Colorscale * ?MarkerOutline:Line * ?MarkerSymbol:MarkerSymbol * ?MultiMarkerSymbol:seq<MarkerSymbol> * ?Marker:Marker * ?LineColor:Color * ?LineColorScale:Colorscale * ?LineWidth:float * ?LineDash:DrawingStyle * ?Line:Line * ?StackGroup:string * ?Orientation:Orientation * ?GroupNorm:GroupNorm * ?UseWebGL:bool * ?UseDefaults:bool -> GenericChart (requires 'a2 :> IConvertible) + 1 overload static member Candlestick : open:seq<#IConvertible> * high:seq<#IConvertible> * low:seq<#IConvertible> * close:seq<#IConvertible> * x:seq<#IConvertible> * ?Name:string * ?ShowLegend:bool * ?Opacity:float * ?Text:'a5 * ?MultiText:seq<'a5> * ?Line:Line * ?IncreasingColor:Color * ?Increasing:FinanceMarker * ?DecreasingColor:Color * ?Decreasing:FinanceMarker * ?WhiskerWidth:float * ?UseDefaults:bool -> GenericChart (requires 'a5 :> IConvertible) + 1 overload static member Column : values:seq<#IConvertible> * ?Keys:seq<#IConvertible> * ?Name:string * ?ShowLegend:bool * ?Opacity:float * ?MultiOpacity:seq<float> * ?Text:'a2 * ?MultiText:seq<'a2> * ?MarkerColor:Color * ?MarkerColorScale:Colorscale * ?MarkerOutline:Line * ?MarkerPatternShape:PatternShape * ?MultiMarkerPatternShape:seq<PatternShape> * ?MarkerPattern:Pattern * ?Marker:Marker * ?Base:#IConvertible * ?Width:'a4 * ?MultiWidth:seq<'a4> * ?TextPosition:TextPosition * ?MultiTextPosition:seq<TextPosition> * ?UseDefaults:bool -> GenericChart (requires 'a2 :> IConvertible and 'a4 :> IConvertible) + 1 overload static member Contour : zData:seq<#seq<'a1>> * ?Name:string * ?ShowLegend:bool * ?Opacity:float * ?X:seq<#IConvertible> * ?Y:seq<#IConvertible> * ?Text:'a4 * ?MultiText:seq<'a4> * ?ColorBar:ColorBar * ?ColorScale:Colorscale * ?ShowScale:bool * ?ReverseScale:bool * ?Transpose:bool * ?LineColor:Color * ?LineDash:DrawingStyle * ?Line:Line * ?ContoursColoring:ContourColoring * ?ContoursOperation:ConstraintOperation * ?ContoursType:ContourType * ?ShowContourLabels:bool * ?ContourLabelFont:Font * ?Contours:Contours * ?FillColor:Color * ?NContours:int * ?UseDefaults:bool -> GenericChart (requires 'a1 :> IConvertible and 'a4 :> IConvertible) static member Funnel : x:seq<#IConvertible> * y:seq<#IConvertible> * ?Name:string * ?ShowLegend:bool * ?Opacity:float * ?Width:float * ?Offset:float * ?Text:'a2 * ?MultiText:seq<'a2> * ?TextPosition:TextPosition * ?MultiTextPosition:seq<TextPosition> * ?Orientation:Orientation * ?AlignmentGroup:string * ?OffsetGroup:string * ?MarkerColor:Color * ?MarkerOutline:Line * ?Marker:Marker * ?TextInfo:TextInfo * ?ConnectorLineColor:Color * ?ConnectorLineStyle:DrawingStyle * ?ConnectorFillColor:Color * ?ConnectorLine:Line * ?Connector:FunnelConnector * ?InsideTextFont:Font * ?OutsideTextFont:Font * ?UseDefaults:bool -> GenericChart (requires 'a2 :> IConvertible) static member Heatmap : zData:seq<#seq<'a1>> * ?Name:string * ?ShowLegend:bool * ?Opacity:float * ?X:seq<#IConvertible> * ?XGap:int * ?Y:seq<#IConvertible> * ?YGap:int * ?Text:'a4 * ?MultiText:seq<'a4> * ?ColorBar:ColorBar * ?ColorScale:Colorscale * ?ShowScale:bool * ?ReverseScale:bool * ?ZSmooth:SmoothAlg * ?Transpose:bool * ?UseWebGL:bool * ?ReverseYAxis:bool * ?UseDefaults:bool -> GenericChart (requires 'a1 :> IConvertible and 'a4 :> IConvertible) + 1 overload ...
static member Chart.Waterfall : xymeasures:seq<#System.IConvertible * #System.IConvertible * StyleParam.WaterfallMeasure> * ?Name:string * ?ShowLegend:bool * ?IncreasingColor:Color * ?Increasing:FinanceMarker * ?DecreasingColor:Color * ?Decreasing:FinanceMarker * ?TotalsColor:Color * ?Totals:FinanceMarker * ?Base:float * ?Width:float * ?MultiWidth:seq<float> * ?Opacity:float * ?Text:'c * ?MultiText:seq<'c> * ?TextPosition:StyleParam.TextPosition * ?MultiTextPosition:seq<StyleParam.TextPosition> * ?TextFont:Font * ?Connector:WaterfallConnector * ?AlignmentGroup:string * ?OffsetGroup:string * ?Orientation:StyleParam.Orientation * ?UseDefaults:bool -> GenericChart.GenericChart (requires 'c :> System.IConvertible)
static member Chart.Waterfall : xy:seq<#System.IConvertible * #System.IConvertible> * ?Name:string * ?ShowLegend:bool * ?IncreasingColor:Color * ?Increasing:FinanceMarker * ?DecreasingColor:Color * ?Decreasing:FinanceMarker * ?TotalsColor:Color * ?Totals:FinanceMarker * ?Base:float * ?Width:float * ?MultiWidth:seq<float> * ?Opacity:float * ?Text:'a2 * ?MultiText:seq<'a2> * ?TextPosition:StyleParam.TextPosition * ?MultiTextPosition:seq<StyleParam.TextPosition> * ?TextFont:Font * ?Connector:WaterfallConnector * ?Measure:seq<StyleParam.WaterfallMeasure> * ?AlignmentGroup:string * ?OffsetGroup:string * ?Orientation:StyleParam.Orientation * ?UseDefaults:bool -> GenericChart.GenericChart (requires 'a2 :> System.IConvertible)
static member Chart.Waterfall : x:seq<#System.IConvertible> * y:seq<#System.IConvertible> * ?Name:string * ?ShowLegend:bool * ?IncreasingColor:Color * ?Increasing:FinanceMarker * ?DecreasingColor:Color * ?Decreasing:FinanceMarker * ?TotalsColor:Color * ?Totals:FinanceMarker * ?Base:float * ?Width:float * ?MultiWidth:seq<float> * ?Opacity:float * ?Text:'c * ?MultiText:seq<'c> * ?TextPosition:StyleParam.TextPosition * ?MultiTextPosition:seq<StyleParam.TextPosition> * ?TextFont:Font * ?Connector:WaterfallConnector * ?Measure:seq<StyleParam.WaterfallMeasure> * ?AlignmentGroup:string * ?OffsetGroup:string * ?Orientation:StyleParam.Orientation * ?UseDefaults:bool -> GenericChart.GenericChart (requires 'c :> System.IConvertible)
argument x: seq<string>
<summary> Creates a waterfall chart. Waterfall charts are special bar charts that help visualizing the cumulative effect of sequentially introduced positive or negative values </summary>
argument y: seq<int>
<summary> Creates a waterfall chart. Waterfall charts are special bar charts that help visualizing the cumulative effect of sequentially introduced positive or negative values </summary>
Multiple items
type MeasureAttribute = inherit Attribute new : unit -> MeasureAttribute
<summary>Adding this attribute to a type causes it to be interpreted as a unit of measure. This may only be used under very limited conditions.</summary>
<category>Attributes</category>


--------------------
new : unit -> MeasureAttribute
module StyleParam from Plotly.NET
type WaterfallMeasure = | Relative | Total | Absolute member Convert : unit -> obj override ToString : unit -> string static member convert : (WaterfallMeasure -> obj) static member toString : (WaterfallMeasure -> string)
<summary> How to compute differences between bars in Waterfall Charts </summary>
union case StyleParam.WaterfallMeasure.Relative: StyleParam.WaterfallMeasure
union case StyleParam.WaterfallMeasure.Total: StyleParam.WaterfallMeasure
module GenericChart from Plotly.NET
<summary> Module to represent a GenericChart </summary>
val toChartHTML : gChart:GenericChart.GenericChart -> string
<summary> Converts a GenericChart to it HTML representation. The div layer has a default size of 600 if not specified otherwise. </summary>
val waterfall2 : GenericChart.GenericChart
type Orientation = | Horizontal | Vertical member Convert : unit -> obj override ToString : unit -> string static member convert : (Orientation -> obj) static member toString : (Orientation -> string)
union case StyleParam.Orientation.Horizontal: StyleParam.Orientation