Skip to content

Add Icicle Chart/Trace and related objects #210

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Sep 27, 2021
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions Plotly.NET.sln
Original file line number Diff line number Diff line change
Expand Up @@ -89,6 +89,7 @@ Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "docs", "docs", "{7B09CC0A-F
docs\09_0_parallel-categories.fsx = docs\09_0_parallel-categories.fsx
docs\09_1_parallel-coords.fsx = docs\09_1_parallel-coords.fsx
docs\09_2_sankey.fsx = docs\09_2_sankey.fsx
docs\09_3_icicle.fsx = docs\09_3_icicle.fsx
docs\10_0_ternary_line_scatter_plots.fsx = docs\10_0_ternary_line_scatter_plots.fsx
docs\10_1_styling_ternary_layouts.fsx = docs\10_1_styling_ternary_layouts.fsx
docs\11_1_carpet_line_scatter_plots.fsx = docs\11_1_carpet_line_scatter_plots.fsx
Expand Down
64 changes: 64 additions & 0 deletions docs/09_3_icicle.fsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,64 @@
(**
---
title: Icicle Charts
category: Categorical Charts
categoryindex: 10
index: 4
---
*)


(*** hide ***)

(*** condition: prepare ***)
#r "nuget: Newtonsoft.JSON, 12.0.3"
#r "nuget: DynamicObj"
#r "../bin/Plotly.NET/netstandard2.0/Plotly.NET.dll"

(*** condition: ipynb ***)
#if IPYNB
#r "nuget: Plotly.NET, {{fsdocs-package-version}}"
#r "nuget: Plotly.NET.Interactive, {{fsdocs-package-version}}"
#endif // IPYNB

(**
# Icicle charts

[![Binder]({{root}}img/badge-binder.svg)](https://mybinder.org/v2/gh/plotly/Plotly.NET/gh-pages?filepath={{fsdocs-source-basename}}.ipynb) 
[![Script]({{root}}img/badge-script.svg)]({{root}}{{fsdocs-source-basename}}.fsx) 
[![Notebook]({{root}}img/badge-notebook.svg)]({{root}}{{fsdocs-source-basename}}.ipynb)

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

Icicle charts visualize hierarchical data using rectangular sectors that cascade from root to leaves in one of four directions: up, down, left, or right.
Similar to Sunburst charts and Treemaps charts, the hierarchy is defined by labels and parents attributes.
Click on one sector to zoom in/out, which also displays a pathbar on the top of your icicle.
To zoom out, you can click the parent sector or click the pathbar as well.
*)

open Plotly.NET
open Plotly.NET.TraceObjects

let character = ["Eve"; "Cain"; "Seth"; "Enos"; "Noam"; "Abel"; "Awan"; "Enoch"; "Azura"]
let parent = [""; "Eve"; "Eve"; "Seth"; "Seth"; "Eve"; "Eve"; "Awan"; "Eve" ]

let icicle =
Chart.Icicle(
character,
parent,
ShowScale = true,
ColorScale = StyleParam.Colorscale.Viridis,
TilingOrientation = StyleParam.Orientation.Vertical, // wether the icicles will grow in the vertical (up/down) or horizontal (left/right) direction
TilingFlip = StyleParam.TilingFlip.Y, // flip in the Y direction (grow up instead of down)
PathBarEdgeShape = StyleParam.PathbarEdgeShape.BackSlash
)

(*** condition: ipynb ***)
#if IPYNB
icicle
#endif // IPYNB

(***hide***)
icicle |> GenericChart.toChartHTML
(***include-it-raw***)

124 changes: 123 additions & 1 deletion src/Plotly.NET/ChartAPI/ChartDomain.fs
Original file line number Diff line number Diff line change
Expand Up @@ -559,4 +559,126 @@ module ChartDomain =
Gauge = gauge
)
)
|> GenericChart.ofTraceObject
|> GenericChart.ofTraceObject

/// creates table out of header sequence and row sequences
[<Extension>]
static member Icicle
(
labels : seq<#IConvertible>,
parents : seq<#IConvertible>,
[<Optional;DefaultParameterValue(null)>] ?Name : string,
[<Optional;DefaultParameterValue(null)>] ?ShowLegend : bool,
[<Optional;DefaultParameterValue(null)>] ?Values : seq<#IConvertible>,
[<Optional;DefaultParameterValue(null)>] ?Opacity : float,
[<Optional;DefaultParameterValue(null)>] ?MultiOpacity : seq<float>,
[<Optional;DefaultParameterValue(null)>] ?Color : Color,
[<Optional;DefaultParameterValue(null)>] ?ColorScale : StyleParam.Colorscale,
[<Optional;DefaultParameterValue(null)>] ?ShowScale : bool,
[<Optional;DefaultParameterValue(null)>] ?Marker : Marker,
[<Optional;DefaultParameterValue(null)>] ?Text : #IConvertible,
[<Optional;DefaultParameterValue(null)>] ?MultiText : seq<#IConvertible>,
[<Optional;DefaultParameterValue(null)>] ?TextPosition : StyleParam.TextPosition,
[<Optional;DefaultParameterValue(null)>] ?MultiTextPosition : seq<StyleParam.TextPosition>,
[<Optional;DefaultParameterValue(null)>] ?Domain : Domain,
[<Optional;DefaultParameterValue(null)>] ?BranchValues : StyleParam.BranchValues,
[<Optional;DefaultParameterValue(null)>] ?Count : StyleParam.IcicleCount,
[<Optional;DefaultParameterValue(null)>] ?TilingOrientation : StyleParam.Orientation,
[<Optional;DefaultParameterValue(null)>] ?TilingFlip : StyleParam.TilingFlip,
[<Optional;DefaultParameterValue(null)>] ?Tiling : IcicleTiling,
[<Optional;DefaultParameterValue(null)>] ?PathBarEdgeShape : StyleParam.PathbarEdgeShape,
[<Optional;DefaultParameterValue(null)>] ?PathBar : Pathbar
) =

let tiling =
Tiling
|> Option.defaultValue(IcicleTiling.init())
|> IcicleTiling.style(?Orientation = TilingOrientation, ?Flip = TilingFlip)

let pathbar =
PathBar
|> Option.defaultValue(Pathbar.init())
|> Pathbar.style(?EdgeShape = PathBarEdgeShape)

TraceDomain.initIcicle(
TraceDomainStyle.Icicle(
?Name = Name ,
?ShowLegend = ShowLegend ,
?Opacity = Opacity ,
Parents = parents ,
?Values = Values ,
Labels = labels ,
?Text = Text ,
?MultiText = MultiText ,
?TextPosition = TextPosition ,
?MultiTextPosition = MultiTextPosition ,
?Domain = Domain ,
?Marker = Marker ,
?BranchValues = BranchValues ,
?Count = Count ,
Tiling = tiling ,
PathBar = pathbar
)
>> TraceStyle.Marker (
?Color = Color,
?MultiOpacity = MultiOpacity,
?Colorscale = ColorScale,
?ShowScale = ShowScale
)
)
|> GenericChart.ofTraceObject

/// creates table out of header sequence and row sequences
[<Extension>]
static member Icicle
(
labelsParents: seq<#IConvertible * #IConvertible>,
[<Optional;DefaultParameterValue(null)>] ?Name : string,
[<Optional;DefaultParameterValue(null)>] ?ShowLegend : bool,
[<Optional;DefaultParameterValue(null)>] ?Values : seq<#IConvertible>,
[<Optional;DefaultParameterValue(null)>] ?Opacity : float,
[<Optional;DefaultParameterValue(null)>] ?MultiOpacity : seq<float>,
[<Optional;DefaultParameterValue(null)>] ?Color : Color,
[<Optional;DefaultParameterValue(null)>] ?ColorScale : StyleParam.Colorscale,
[<Optional;DefaultParameterValue(null)>] ?ShowScale : bool,
[<Optional;DefaultParameterValue(null)>] ?Marker : Marker,
[<Optional;DefaultParameterValue(null)>] ?Text : #IConvertible,
[<Optional;DefaultParameterValue(null)>] ?MultiText : seq<#IConvertible>,
[<Optional;DefaultParameterValue(null)>] ?TextPosition : StyleParam.TextPosition,
[<Optional;DefaultParameterValue(null)>] ?MultiTextPosition : seq<StyleParam.TextPosition>,
[<Optional;DefaultParameterValue(null)>] ?Domain : Domain,
[<Optional;DefaultParameterValue(null)>] ?BranchValues : StyleParam.BranchValues,
[<Optional;DefaultParameterValue(null)>] ?Count : StyleParam.IcicleCount,
[<Optional;DefaultParameterValue(null)>] ?TilingOrientation : StyleParam.Orientation,
[<Optional;DefaultParameterValue(null)>] ?TilingFlip : StyleParam.TilingFlip,
[<Optional;DefaultParameterValue(null)>] ?Tiling : IcicleTiling,
[<Optional;DefaultParameterValue(null)>] ?PathBarEdgeShape : StyleParam.PathbarEdgeShape,
[<Optional;DefaultParameterValue(null)>] ?PathBar : Pathbar
) =

let labels, parents = Seq.unzip labelsParents

Chart.Icicle(
labels, parents,
?Name = Name ,
?ShowLegend = ShowLegend ,
?Values = Values ,
?Opacity = Opacity ,
?MultiOpacity = MultiOpacity ,
?Color = Color ,
?ColorScale = ColorScale ,
?ShowScale = ShowScale ,
?Marker = Marker ,
?Text = Text ,
?MultiText = MultiText ,
?TextPosition = TextPosition ,
?MultiTextPosition = MultiTextPosition ,
?Domain = Domain ,
?BranchValues = BranchValues ,
?Count = Count ,
?TilingOrientation = TilingOrientation ,
?TilingFlip = TilingFlip ,
?Tiling = Tiling ,
?PathBarEdgeShape = PathBarEdgeShape ,
?PathBar = PathBar
)
39 changes: 33 additions & 6 deletions src/Plotly.NET/CommonAbstractions/StyleParams.fs
Original file line number Diff line number Diff line change
Expand Up @@ -1113,6 +1113,19 @@ module StyleParam =
//--------------------------
// #I#
//--------------------------

[<RequireQualifiedAccess>]
type IcicleCount =
| Branches | Leaves | BranchesLeaves
static member toString = function
| Branches -> "branches"
| Leaves -> "leaves"
| BranchesLeaves-> "branches+leaves"

static member convert = IcicleCount.toString >> box
override this.ToString() = this |> IcicleCount.toString
member this.Convert() = this |> IcicleCount.convert


[<RequireQualifiedAccess>]
type IndicatorMode =
Expand Down Expand Up @@ -1144,7 +1157,6 @@ module StyleParam =
static member convert = IndicatorAlignment.toString >> box
override this.ToString() = this |> IndicatorAlignment.toString
member this.Convert() = this |> IndicatorAlignment.convert

[<RequireQualifiedAccess>]
type IndicatorGaugeShape =
| Angular | Bullet
Expand Down Expand Up @@ -2216,7 +2228,22 @@ module StyleParam =
//--------------------------
// #T#
//--------------------------


[<RequireQualifiedAccess>]
type TilingFlip =
| X
| Y
| XY

static member toString = function
| X -> "x"
| Y -> "y"
| XY-> "x+y"

static member convert = TilingFlip.toString >> box
override this.ToString() = this |> TilingFlip.toString
member this.Convert() = this |> TilingFlip.convert

[<RequireQualifiedAccess>]
type TransitionEasing =
| Linear
Expand Down Expand Up @@ -2404,7 +2431,7 @@ module StyleParam =
member this.Convert() = this |> UnitMode.convert

[<RequireQualifiedAccess>]
type TreemapEdgeShape =
type PathbarEdgeShape =
| ArrowRight | ArrowLeft | Straight | Slash | BackSlash

static member toString = function
Expand All @@ -2414,9 +2441,9 @@ module StyleParam =
| Slash -> "/"
| BackSlash -> """\"""

static member convert = TreemapEdgeShape.toString >> box
override this.ToString() = this |> TreemapEdgeShape.toString
member this.Convert() = this |> TreemapEdgeShape.convert
static member convert = PathbarEdgeShape.toString >> box
override this.ToString() = this |> PathbarEdgeShape.toString
member this.Convert() = this |> PathbarEdgeShape.convert

[<RequireQualifiedAccess>]
type TreemapTilingPacking =
Expand Down
15 changes: 15 additions & 0 deletions src/Plotly.NET/Playground.fsx
Original file line number Diff line number Diff line change
Expand Up @@ -93,6 +93,7 @@
#load "Error.fs"
#load "Table.fs"
#load "Indicator.fs"
#load "Icicle.fs"

#I "Traces"

Expand Down Expand Up @@ -160,6 +161,20 @@ open FSharpAux
open System
open System.IO

let character = ["Eve"; "Cain"; "Seth"; "Enos"; "Noam"; "Abel"; "Awan"; "Enoch"; "Azura"]
let parent = [""; "Eve"; "Eve"; "Seth"; "Seth"; "Eve"; "Eve"; "Awan"; "Eve" ]

Chart.Icicle(
character,
parent,
ShowScale = true,
ColorScale = StyleParam.Colorscale.Viridis,
TilingOrientation = StyleParam.Orientation.Vertical,
TilingFlip = StyleParam.TilingFlip.Y,
PathBarEdgeShape = StyleParam.PathbarEdgeShape.BackSlash
)
|> Chart.show

[
Chart.Indicator(
120., StyleParam.IndicatorMode.NumberDeltaGauge,
Expand Down
1 change: 1 addition & 0 deletions src/Plotly.NET/Plotly.NET.fsproj
Original file line number Diff line number Diff line change
Expand Up @@ -101,6 +101,7 @@
<Compile Include="Traces\ObjectAbstractions\Error.fs" />
<Compile Include="Traces\ObjectAbstractions\Table.fs" />
<Compile Include="Traces\ObjectAbstractions\Indicator.fs" />
<Compile Include="Traces\ObjectAbstractions\Icicle.fs" />
<Compile Include="Traces\Trace.fs" />
<Compile Include="Traces\Trace2D.fs" />
<Compile Include="Traces\Trace3D.fs" />
Expand Down
Loading