Skip to content

Commit 1894f87

Browse files
authored
Merge pull request #26 from bvenn/developer
add plotly tables
2 parents dd0aed2 + 9efb45f commit 1894f87

File tree

10 files changed

+379
-12
lines changed

10 files changed

+379
-12
lines changed

FSharp.Plotly.sln

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
Microsoft Visual Studio Solution File, Format Version 12.00
2-
# Visual Studio Version 16
3-
VisualStudioVersion = 16.0.29613.14
2+
# Visual Studio 15
3+
VisualStudioVersion = 15.0.28307.960
44
MinimumVisualStudioVersion = 10.0.40219.1
55
Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = ".paket", ".paket", "{63297B98-5CED-492C-A5B7-A5B4F73CF142}"
66
ProjectSection(SolutionItems) = preProject
@@ -56,6 +56,7 @@ Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "content", "content", "{8E6D
5656
docsrc\content\sankey.fsx = docsrc\content\sankey.fsx
5757
docsrc\content\shapes.fsx = docsrc\content\shapes.fsx
5858
docsrc\content\splom.fsx = docsrc\content\splom.fsx
59+
docsrc\content\table.fsx = docsrc\content\table.fsx
5960
docsrc\content\violin-plots.fsx = docsrc\content\violin-plots.fsx
6061
docsrc\content\windrose-charts.fsx = docsrc\content\windrose-charts.fsx
6162
EndProjectSection

docsrc/content/range-plots.fsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ values.
1414
*)
1515

1616
open FSharp.Plotly
17+
open StyleParam
1718

1819
let rnd = System.Random()
1920

@@ -25,7 +26,7 @@ let yLower = y |> List.map (fun v -> v - rnd.NextDouble())
2526

2627

2728
let range1 =
28-
Chart.Range(x,y,yUpper,yLower,Color="grey",RangeColor="lightblue")
29+
Chart.Range(x,y,yUpper,yLower,Mode.Markers,Color="grey",RangeColor="lightblue")
2930

3031
(***do-not-eval***)
3132
range1 |> Chart.Show

docsrc/content/table.fsx

Lines changed: 191 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,191 @@
1+
(*** hide ***)
2+
#r "netstandard"
3+
#r @"../../lib/Formatting/FSharp.Plotly.dll"
4+
5+
(**
6+
# FSharp.Plotly: Tables
7+
8+
This example shows how to create tables in F#.
9+
10+
11+
*)
12+
13+
open FSharp.Plotly
14+
open FSharp.Plotly.StyleParam
15+
16+
let header = ["<b>RowIndex</b>";"A";"simple";"table"]
17+
let rows =
18+
[
19+
["0";"I" ;"am" ;"a"]
20+
["1";"little";"example";"!"]
21+
]
22+
23+
let table1 = Chart.Table(header, rows)
24+
25+
26+
(***do-not-eval***)
27+
table1 |> Chart.Show
28+
29+
(*** include-value:table1 ***)
30+
31+
(**
32+
A little bit of styling:
33+
*)
34+
35+
let table2 =
36+
Chart.Table(
37+
header,
38+
rows,
39+
//sets global header alignment
40+
AlignHeader = [HorizontalAlign.Center],
41+
//sets alignment for each column separately
42+
//(The last alignment is applied to all potential following columns)
43+
AlignCells = [HorizontalAlign.Left;HorizontalAlign.Center;HorizontalAlign.Right],
44+
//sets global header color
45+
ColorHeader = "#45546a",
46+
//sets specific color to each header column
47+
//ColorHeader=["#45546a";"#deebf7";"#45546a";"#deebf7"],
48+
//sets global cell color
49+
//ColorRows = "#deebf7",
50+
//sets cell column colors
51+
ColorCells = ["#deebf7";"lightgrey";"#deebf7";"lightgrey"],
52+
//sets cell row colors
53+
//ColorCells=[["#deebf7";"lightgrey"]],
54+
//sets font of header
55+
FontHeader = Font.init(FontFamily.Courier_New, Size=12, Color="white"),
56+
//sets the height of the header
57+
HeightHeader= 30.,
58+
//sets lines of header
59+
LineHeader = Line.init(2.,"black"),
60+
ColumnWidth = [70;50;100;70],
61+
//defines order of columns
62+
ColumnOrder = [1;2;3;4]
63+
)
64+
65+
(***do-not-eval***)
66+
table2 |> Chart.Show
67+
68+
(*** include-value:table2 ***)
69+
70+
(**
71+
Value dependent cell coloring:
72+
*)
73+
74+
let header2 = ["Identifier";"T0";"T1";"T2";"T3"]
75+
let rowvalues =
76+
[
77+
[10001.;0.2;2.0;4.0;5.0]
78+
[10002.;2.1;2.0;1.8;2.1]
79+
[10003.;4.5;3.0;2.0;2.5]
80+
[10004.;0.0;0.1;0.3;0.2]
81+
[10005.;1.0;1.6;1.8;2.2]
82+
[10006.;1.0;0.8;1.5;0.7]
83+
[10007.;2.0;2.0;2.1;1.9]
84+
]
85+
|> Seq.sortBy (fun x -> x.[1])
86+
87+
//map color from value to hex representation
88+
let mapColor min max value =
89+
let proportion =
90+
(255. * (value - min) / (max - min))
91+
|> int
92+
Colors.fromRgb 255 (255 - proportion) proportion
93+
|> Colors.toWebColor
94+
95+
//Assign a color to every cell seperately. Matrix must be transposed for correct orientation.
96+
let cellcolor =
97+
rowvalues
98+
|> Seq.map (fun row ->
99+
row
100+
|> Seq.mapi (fun index value ->
101+
if index = 0 then "white"
102+
else mapColor 0. 5. value
103+
)
104+
)
105+
|> Seq.transpose
106+
107+
let table3 = Chart.Table(header2,rowvalues,ColorCells=cellcolor)
108+
109+
(***do-not-eval***)
110+
table3 |> Chart.Show
111+
112+
113+
(*** include-value:table3 ***)
114+
115+
116+
(**
117+
Sequence representation:
118+
119+
*)
120+
121+
let sequence =
122+
[
123+
"ATGAGACGTCGAGACTGATAGACGTCGATAGACGTCGATAGACCG"
124+
"ATAGACTCGTGATAGACGTCGATAGACGTCGATAGAGTATAGACC"
125+
"GTGATAGACGTCGAGAAGACGTCGATAGACGTCGATAGACGTCGA"
126+
"TAGAGATAGACGTCGATAGACCGTATAGAAGACGTCGATAGATAG"
127+
"ACGTCGATAGACCGTAGACGTCGATAGACGTCGATAGACCGT"
128+
]
129+
|> String.concat ""
130+
131+
let elementsPerRow = 60
132+
133+
let headers =
134+
[0..elementsPerRow]
135+
|> Seq.map (fun x ->
136+
if x%10=0 && x <> 0 then "|"
137+
else ""
138+
)
139+
140+
let cells =
141+
sequence
142+
|> Seq.chunkBySize elementsPerRow
143+
|> Seq.mapi (fun i x -> Seq.append [string (i * elementsPerRow)] (Seq.map string x))
144+
145+
let cellcolors =
146+
cells
147+
|> Seq.map (fun row ->
148+
row
149+
|> Seq.map (fun element ->
150+
match element with
151+
//colors taken from DRuMS
152+
//(http://biomodel.uah.es/en/model4/dna/atgc.htm)
153+
| "A" -> "#5050FF"
154+
| "T" -> "#E6E600"
155+
| "G" -> "#00C000"
156+
| "C" -> "#E00000"
157+
| "U" -> "#B48100"
158+
| _ -> "white"
159+
)
160+
)
161+
|> Seq.transpose
162+
|> Seq.map (fun x -> Seq.append x (seq ["white"]))
163+
164+
let font = Font.init(FontFamily.Consolas,Size=14)
165+
let line = Line.init(0,"white")
166+
let chartwidth = 50. + 10. * float elementsPerRow
167+
168+
let table4 =
169+
Chart.Table(
170+
headers,
171+
cells,
172+
LineCells = line,
173+
LineHeader = line,
174+
HeightCells = 20,
175+
FontHeader = font,
176+
FontCells = font,
177+
ColumnWidth = [50;10],
178+
AlignCells = [HorizontalAlign.Right;HorizontalAlign.Center],
179+
ColorCells = cellcolors
180+
)
181+
|> Chart.withSize(chartwidth,nan)
182+
|> Chart.withTitle "Sequence A"
183+
184+
185+
(***do-not-eval***)
186+
table4 |> Chart.Show
187+
188+
189+
(*** include-value:table4 ***)
190+
191+

docsrc/tools/templates/template.cshtml

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -59,6 +59,7 @@
5959
<li><a href="@Root/box-plots.html">Box Plots</a></li>
6060
<li><a href="@Root/violin-plots.html">Violin Plots</a></li>
6161
<li><a href="@Root/bubble-charts.html">Bubble Charts</a></li>
62+
<li><a href="@Root/candlestick.html">Candlestick Plots</a></li>
6263
<li><a href="@Root/contour-plots.html">Contour Plots</a></li>
6364
<li><a href="@Root/heatmaps.html">Heatmaps</a></li>
6465
<li><a href="@Root/histograms.html">Histograms</a></li>
@@ -73,13 +74,16 @@
7374
<li><a href="@Root/candlestick.html">Candlestick Charts</a></li>
7475
<li><a href="@Root/sankey.html">Sankey Diagrams</a></li>
7576
<li><a href="@Root/splom.html">Splom Plots</a></li>
77+
<li><a href="@Root/sankey.html">Sankey Plots</a></li>
7678
<li class="nav-header">Map Charts</li>
7779
<li><a href="@Root/choropleth-map.html">Choropleth</a></li>
7880
<li class="nav-header">Plotly 3d-Charts</li>
7981
<li><a href="@Root/3d-scatter-plots.html">3D Scatter Plots</a></li>
8082
<li><a href="@Root/3d-line-plots.html">3D Line Plots</a></li>
8183
<li><a href="@Root/3d-surface-plots.html">3D Surface Plots</a></li>
8284
<li><a href="@Root/3d-mesh-plots.html">3D Mesh Plots</a></li>
85+
<li class="nav-header">Plotly Tables</li>
86+
<li><a href="@Root/table.html">Table</a></li>
8387
<li class="nav-header">Styling</li>
8488
<li><a href="@Root/multiple-charts.html">Multiple Charts</a></li>
8589
<li><a href="@Root/errorbars.html">Error bars</a></li>

lib/Formatting/FSharp.Plotly.dll

12.5 KB
Binary file not shown.

src/FSharp.Plotly/Chart.fs

Lines changed: 28 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -137,7 +137,7 @@ type Chart =
137137

138138

139139
/// Displays a range of data by plotting two Y values per data point, with each Y value being drawn as a line
140-
static member Range(x, y, upper, lower,?Name,?ShowMarkers,?Showlegend,?Color,?RangeColor,?Labels,?TextPosition,?TextFont) =
140+
static member Range(x, y, upper, lower,mode,?Name,?ShowMarkers,?Showlegend,?Color,?RangeColor,?Labels,?TextPosition,?TextFont) =
141141
// if text position or font is set than show labels (not only when hovering)
142142
let changeMode =
143143
let isShowMarker =
@@ -150,7 +150,7 @@ type Chart =
150150

151151
let trace =
152152
Trace.initScatter (
153-
TraceStyle.Scatter(X = x,Y = y, Mode=changeMode StyleParam.Markers, ?Fillcolor=Color) )
153+
TraceStyle.Scatter(X = x,Y = y, Mode=mode, ?Fillcolor=Color) )
154154
|> TraceStyle.TraceInfo(?Name=Name,?Showlegend=Showlegend)
155155
|> TraceStyle.Line(?Color=Color)
156156
|> TraceStyle.Marker(?Color=Color)
@@ -161,22 +161,22 @@ type Chart =
161161
TraceStyle.Scatter(X = x,Y = lower, Mode=StyleParam.Lines, ?Fillcolor=RangeColor) )
162162
|> TraceStyle.TraceInfo(Showlegend=false)
163163
|> TraceStyle.Line(Width=0)
164-
|> TraceStyle.Marker(Color=if RangeColor.IsSome then RangeColor.Value else "rgba(0,0,,0.5)")
164+
|> TraceStyle.Marker(Color=if RangeColor.IsSome then RangeColor.Value else "rgba(0,0,0,0.5)")
165165

166166
let upper =
167167
Trace.initScatter (
168168
TraceStyle.Scatter(X = x,Y = upper, Mode=StyleParam.Lines, ?Fillcolor=RangeColor, Fill=StyleParam.ToNext_y) )
169169
|> TraceStyle.TraceInfo(Showlegend=false)
170170
|> TraceStyle.Line(Width=0)
171-
|> TraceStyle.Marker(Color=if RangeColor.IsSome then RangeColor.Value else "rgba(0,0,,0.5)")
171+
|> TraceStyle.Marker(Color=if RangeColor.IsSome then RangeColor.Value else "rgba(0,0,0,0.5)")
172172

173173
GenericChart.MultiChart ([lower;upper;trace],Layout(),Config())
174174

175175

176176
/// Displays a range of data by plotting two Y values per data point, with each Y value being drawn as a line
177-
static member Range(xy, upper, lower,?Name,?ShowMarkers,?Showlegend,?Color,?RangeColor,?Labels,?TextPosition,?TextFont) =
177+
static member Range(xy, upper, lower, mode, ?Name,?ShowMarkers,?Showlegend,?Color,?RangeColor,?Labels,?TextPosition,?TextFont) =
178178
let x,y = Seq.unzip xy
179-
Chart.Range(x, y, upper, lower, ?Name=Name,?ShowMarkers=ShowMarkers,?Showlegend=Showlegend,?Color=Color,?RangeColor=RangeColor,?Labels=Labels,?TextPosition=TextPosition,?TextFont=TextFont)
179+
Chart.Range(x, y, upper, lower, mode, ?Name=Name,?ShowMarkers=ShowMarkers,?Showlegend=Showlegend,?Color=Color,?RangeColor=RangeColor,?Labels=Labels,?TextPosition=TextPosition,?TextFont=TextFont)
180180

181181

182182
/// Emphasizes the degree of change over time and shows the relationship of the parts to a whole.
@@ -573,4 +573,25 @@ type Chart =
573573
|> TraceStyle.TextLabel(?Text=Labels,?Textposition=TextPosition,?Textfont=TextFont)
574574
|> GenericChart.ofTraceObject
575575

576-
576+
/// creates table out of header sequence and row sequences
577+
static member Table(headerValues, cellValues, ?AlignHeader, ?AlignCells, ?ColumnWidth, ?ColumnOrder, ?ColorHeader, ?ColorCells, ?FontHeader, ?FontCells, ?HeightHeader, ?HeightCells, ?LineHeader, ?LineCells) =
578+
Trace.initTable (
579+
580+
let CellFilling =
581+
match ColorCells with
582+
| Some color -> Some (CellColor.init (?Color=ColorCells))
583+
| Option.None -> Option.None
584+
585+
let HeaderFilling =
586+
match ColorHeader with
587+
| Some color -> Some (CellColor.init (?Color=ColorHeader))
588+
| Option.None -> Option.None
589+
590+
TraceStyle.Table (
591+
Header = TableHeader.init (headerValues|> Seq.map seq, ?Align=AlignHeader, ?Fill=HeaderFilling, ?Font=FontHeader, ?Height=HeightHeader, ?Line=LineHeader),
592+
Cells = TableCells.init(cellValues |> Seq.transpose, ?Align=AlignCells, ?Fill=CellFilling, ?Font=FontCells, ?Height=HeightCells, ?Line=LineCells),
593+
?ColumnWidth = ColumnWidth,
594+
?ColumnOrder = ColumnOrder
595+
)
596+
)
597+
|> GenericChart.ofTraceObject

src/FSharp.Plotly/FSharp.Plotly.fsproj

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,7 @@
3131
<Compile Include="Scene.fs" />
3232
<Compile Include="Shape.fs" />
3333
<Compile Include="Error.fs" />
34+
<Compile Include="Table.fs" />
3435
<Compile Include="Trace.fs" />
3536
<Compile Include="Trace3d.fs" />
3637
<Compile Include="Layout.fs" />

src/FSharp.Plotly/StyleParams.fs

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -140,7 +140,7 @@ module StyleParam =
140140
| Markers | Markers_Text
141141
| Text
142142
static member toString = function
143-
| None -> "None"
143+
| None -> "none"
144144
| Lines -> "lines"
145145
| Lines_Markers -> "lines+markers"
146146
| Lines_Text -> "lines+text"
@@ -210,12 +210,13 @@ module StyleParam =
210210

211211
/// Names of installed font families
212212
type FontFamily =
213-
| Arial | Balto | Courier_New | Droid_Sans | Droid_Serif | Droid_Sans_Mono | Gravitas_One | Old_Standard_TT | Open_Sans | Overpass | PT_Sans_Narrow | Raleway | Times_New_Roman
213+
| Arial | Balto | Courier_New | Consolas | Droid_Sans | Droid_Serif | Droid_Sans_Mono | Gravitas_One | Old_Standard_TT | Open_Sans | Overpass | PT_Sans_Narrow | Raleway | Times_New_Roman
214214

215215
static member toString = function
216216
| Arial -> "Arial"
217217
| Balto -> "Balto"
218218
| Courier_New -> "Courier New"
219+
| Consolas -> "Consolas"
219220
| Droid_Sans -> "Droid Sans"
220221
| Droid_Serif -> "Droid Serif"
221222
| Droid_Sans_Mono -> "Droid Sans Mono"

0 commit comments

Comments
 (0)