FunnelArea Charts
Summary: This example shows how to create funnel area charts in F#.
let's first create some data for the purpose of creating example charts:
let values = [|5; 4; 3; 2; 1|]
let text = [|"The 1st"; "The 2nd"; "The 3rd"; "The 4th"; "The 5th"|]
FunnelArea charts visualize stages in a process using area-encoded trapezoids. This trace can be used to show data in a part-to-whole representation similar to a "pie" trace, wherein each item appears in a single stage. See also the the Funnel chart for a different approach to visualizing funnel data.
open Plotly.NET
let line = Line.init (Color=Color.fromString "purple", Width=3.)
let funnelArea =
Chart.FunnelArea(values, MultiText=text, SectionOutline=line)
More styled example
This example shows the usage of some of the styling possibility using Chart.FunnelArea.
For even more styling control, use the respective TraceStyle function TraceDomainStyle.FunnelArea
let funnelAreaStyled =
let values = [|5; 4; 3|]
let labels = [|"The 1st"; "The 2nd"; "The 3rd"|]
Chart.FunnelArea(
values,
Labels = labels,
MultiText = labels,
SectionColors = [
Color.fromKeyword Aqua
Color.fromKeyword Salmon
Color.fromKeyword Tan
],
SectionOutlineColor = Color.fromKeyword Black,
SectionOutlineWidth = 2.,
AspectRatio = 0.75,
BaseRatio = 0.1
)
val values : int []
val text : string []
namespace Plotly
namespace Plotly.NET
val line : Line
Multiple items
type Line = inherit DynamicObj new : unit -> Line static member init : ?Color:Color * ?Width:float * ?MultiWidth:seq<float> * ?Shape:Shape * ?Dash:DrawingStyle * ?Smoothing:float * ?OutlierColor:Color * ?OutlierWidth:float * ?AutoColorScale:bool * ?CAuto:bool * ?CMax:float * ?CMid:float * ?CMin:float * ?ColorAxis:SubPlotId * ?Colorscale:Colorscale * ?ReverseScale:bool * ?ShowScale:bool * ?ColorBar:#DynamicObj -> Line static member style : ?Color:Color * ?Width:float * ?MultiWidth:seq<float> * ?Shape:Shape * ?Dash:DrawingStyle * ?Smoothing:float * ?OutlierColor:Color * ?OutlierWidth:float * ?AutoColorScale:bool * ?CAuto:bool * ?CMax:float * ?CMid:float * ?CMin:float * ?ColorAxis:SubPlotId * ?Colorscale:Colorscale * ?ReverseScale:bool * ?ShowScale:bool * ?ColorBar:#DynamicObj -> (Line -> Line)
<summary> Line type inherits from dynamic object </summary>
--------------------
new : unit -> Line
type Line = inherit DynamicObj new : unit -> Line static member init : ?Color:Color * ?Width:float * ?MultiWidth:seq<float> * ?Shape:Shape * ?Dash:DrawingStyle * ?Smoothing:float * ?OutlierColor:Color * ?OutlierWidth:float * ?AutoColorScale:bool * ?CAuto:bool * ?CMax:float * ?CMid:float * ?CMin:float * ?ColorAxis:SubPlotId * ?Colorscale:Colorscale * ?ReverseScale:bool * ?ShowScale:bool * ?ColorBar:#DynamicObj -> Line static member style : ?Color:Color * ?Width:float * ?MultiWidth:seq<float> * ?Shape:Shape * ?Dash:DrawingStyle * ?Smoothing:float * ?OutlierColor:Color * ?OutlierWidth:float * ?AutoColorScale:bool * ?CAuto:bool * ?CMax:float * ?CMid:float * ?CMin:float * ?ColorAxis:SubPlotId * ?Colorscale:Colorscale * ?ReverseScale:bool * ?ShowScale:bool * ?ColorBar:#DynamicObj -> (Line -> Line)
<summary> Line type inherits from dynamic object </summary>
--------------------
new : unit -> Line
static member Line.init : ?Color:Color * ?Width:float * ?MultiWidth:seq<float> * ?Shape:StyleParam.Shape * ?Dash:StyleParam.DrawingStyle * ?Smoothing:float * ?OutlierColor:Color * ?OutlierWidth:float * ?AutoColorScale:bool * ?CAuto:bool * ?CMax:float * ?CMid:float * ?CMin:float * ?ColorAxis:StyleParam.SubPlotId * ?Colorscale:StyleParam.Colorscale * ?ReverseScale:bool * ?ShowScale:bool * ?ColorBar:#DynamicObj.DynamicObj -> Line
Multiple items
module Color from Plotly.NET
--------------------
type Color = private new : obj:obj -> Color override Equals : other:obj -> bool override GetHashCode : unit -> int static member fromARGB : a:int -> r:int -> g:int -> b:int -> Color static member fromColorScaleValues : c:seq<#IConvertible> -> Color static member fromColors : c:seq<Color> -> Color static member fromHex : s:string -> Color static member fromKeyword : c:ColorKeyword -> Color static member fromRGB : r:int -> g:int -> b:int -> Color static member fromString : c:string -> Color ...
<summary> Plotly color can be a single color, a sequence of colors, or a sequence of numeric values referencing the color of the colorscale obj </summary>
module Color from Plotly.NET
--------------------
type Color = private new : obj:obj -> Color override Equals : other:obj -> bool override GetHashCode : unit -> int static member fromARGB : a:int -> r:int -> g:int -> b:int -> Color static member fromColorScaleValues : c:seq<#IConvertible> -> Color static member fromColors : c:seq<Color> -> Color static member fromHex : s:string -> Color static member fromKeyword : c:ColorKeyword -> Color static member fromRGB : r:int -> g:int -> b:int -> Color static member fromString : c:string -> Color ...
<summary> Plotly color can be a single color, a sequence of colors, or a sequence of numeric values referencing the color of the colorscale obj </summary>
static member Color.fromString : c:string -> Color
val funnelArea : 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.FunnelArea : valuesLabels:seq<#System.IConvertible * #System.IConvertible> * ?Name:string * ?ShowLegend:bool * ?Opacity:float * ?MultiOpacity:seq<float> * ?Text:'a2 * ?MultiText:seq<'a2> * ?TextPosition:StyleParam.TextPosition * ?MultiTextPosition:seq<StyleParam.TextPosition> * ?SectionColors:seq<Color> * ?SectionOutlineColor:Color * ?SectionOutlineWidth:float * ?SectionOutlineMultiWidth:seq<float> * ?SectionOutline:Line * ?Marker:TraceObjects.Marker * ?TextInfo:StyleParam.TextInfo * ?AspectRatio:float * ?BaseRatio:float * ?UseDefaults:bool -> GenericChart.GenericChart (requires 'a2 :> System.IConvertible)
static member Chart.FunnelArea : values:seq<#System.IConvertible> * ?Name:string * ?ShowLegend:bool * ?Opacity:float * ?MultiOpacity:seq<float> * ?Labels:seq<#System.IConvertible> * ?Text:'c * ?MultiText:seq<'c> * ?TextPosition:StyleParam.TextPosition * ?MultiTextPosition:seq<StyleParam.TextPosition> * ?SectionColors:seq<Color> * ?SectionOutlineColor:Color * ?SectionOutlineWidth:float * ?SectionOutlineMultiWidth:seq<float> * ?SectionOutline:Line * ?Marker:TraceObjects.Marker * ?TextInfo:StyleParam.TextInfo * ?AspectRatio:float * ?BaseRatio:float * ?UseDefaults:bool -> GenericChart.GenericChart (requires 'c :> System.IConvertible)
static member Chart.FunnelArea : values:seq<#System.IConvertible> * ?Name:string * ?ShowLegend:bool * ?Opacity:float * ?MultiOpacity:seq<float> * ?Labels:seq<#System.IConvertible> * ?Text:'c * ?MultiText:seq<'c> * ?TextPosition:StyleParam.TextPosition * ?MultiTextPosition:seq<StyleParam.TextPosition> * ?SectionColors:seq<Color> * ?SectionOutlineColor:Color * ?SectionOutlineWidth:float * ?SectionOutlineMultiWidth:seq<float> * ?SectionOutline:Line * ?Marker:TraceObjects.Marker * ?TextInfo:StyleParam.TextInfo * ?AspectRatio:float * ?BaseRatio:float * ?UseDefaults:bool -> GenericChart.GenericChart (requires 'c :> System.IConvertible)
module GenericChart
from Plotly.NET
<summary> Module to represent a GenericChart </summary>
<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>
<summary> Converts a GenericChart to it HTML representation. The div layer has a default size of 600 if not specified otherwise. </summary>
val funnelAreaStyled : GenericChart.GenericChart
val labels : string []
static member Color.fromKeyword : c:ColorKeyword -> Color
union case ColorKeyword.Aqua: ColorKeyword
union case ColorKeyword.Salmon: ColorKeyword
union case ColorKeyword.Tan: ColorKeyword
union case ColorKeyword.Black: ColorKeyword