Skip to content

Commit 518c76a

Browse files
committed
#366: Add multicategory docs
1 parent ed2933f commit 518c76a

File tree

2 files changed

+346
-0
lines changed

2 files changed

+346
-0
lines changed

Plotly.NET.sln

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -68,6 +68,7 @@ Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "docs", "docs", "{7B09CC0A-F
6868
docs\02_6_table.fsx = docs\02_6_table.fsx
6969
docs\02_7_heatmaps.fsx = docs\02_7_heatmaps.fsx
7070
docs\02_8_Images.fsx = docs\02_8_Images.fsx
71+
docs\02_9_multicategory.fsx = docs\02_9_multicategory.fsx
7172
docs\03_0_3d-scatter-plots.fsx = docs\03_0_3d-scatter-plots.fsx
7273
docs\03_1_3d-surface-plots.fsx = docs\03_1_3d-surface-plots.fsx
7374
docs\03_2_3d-mesh-plots.fsx = docs\03_2_3d-mesh-plots.fsx

docs/02_9_multicategory.fsx

Lines changed: 345 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,345 @@
1+
(**
2+
---
3+
title: Plotting multicategory data
4+
category: Simple Charts
5+
categoryindex: 3
6+
index: 10
7+
---
8+
*)
9+
10+
(*** hide ***)
11+
12+
(*** condition: prepare ***)
13+
#r "nuget: Newtonsoft.JSON, 13.0.1"
14+
#r "nuget: DynamicObj, 2.0.0"
15+
#r "nuget: Giraffe.ViewEngine, 1.4.0"
16+
#r "../src/Plotly.NET/bin/Release/netstandard2.0/Plotly.NET.dll"
17+
18+
Plotly.NET.Defaults.DefaultDisplayOptions <-
19+
Plotly.NET.DisplayOptions.init (PlotlyJSReference = Plotly.NET.PlotlyJSReference.NoReference)
20+
21+
(*** condition: ipynb ***)
22+
#if IPYNB
23+
#r "nuget: Plotly.NET, {{fsdocs-package-version}}"
24+
#r "nuget: Plotly.NET.Interactive, {{fsdocs-package-version}}"
25+
#endif // IPYNB
26+
27+
(**
28+
# Plotting multicategory data
29+
30+
[![Binder]({{root}}img/badge-binder.svg)](https://mybinder.org/v2/gh/plotly/Plotly.NET/gh-pages?filepath={{fsdocs-source-basename}}.ipynb)&emsp;
31+
[![Notebook]({{root}}img/badge-notebook.svg)]({{root}}{{fsdocs-source-basename}}.ipynb)
32+
33+
*Summary:* This example shows how to plot multicategory data on 2D charts in F#.
34+
35+
Since Plotly.NET v4, multicategory data are supported on the following 2D charts:
36+
37+
- [Chart.Scatter](#Scatter)
38+
- [Chart.Bar and Chart.Column](#Bar-and-Column)
39+
- [Chart.Histogram](#Histogram)
40+
- [Chart.Histogram2D](#Histogram2D)
41+
- [Chart.BoxPlot and Chart.Violin](#BoxPlot-and-Violin)
42+
- [Chart.Histogram2DContour](#Histogram2DContour)
43+
- [Chart.Heatmap and Chart.AnnotatedHeatmap](#Heatmap-and-AnnotatedHeatmap)
44+
- [Chart.Contour](#Contour)
45+
- [Chart.OHLC and Chart.Candlestick](#OHLC-and-Candlestick)
46+
47+
## Scatter
48+
49+
Note that this does not apply to all derived Charts such as `Chart.Point`, `Chart.Line`, `Chart.Bubble`, `Chart.Spline` etc. (to avoid creating dozens ov overloads for scatter derived traces)
50+
51+
You can however design those yourself using Chart.Scatter, here are some examples:
52+
*)
53+
open Plotly.NET
54+
open System
55+
56+
let multicategoryScatterAndDerived =
57+
[
58+
Chart.Scatter(
59+
Name = "Point",
60+
Mode = StyleParam.Mode.Markers, // creates multicategory point chart
61+
MultiX = [["A";"A";"B";"B"];["AA"; "AB"; "BA"; "BB"]],
62+
MultiY = [
63+
["A";"A";"B";"B"] |> Seq.map (fun x -> x :> IConvertible) // you can use different IConvertibles if you cast here
64+
[1; 2; -1; -2] |> Seq.map (fun x -> x :> IConvertible)
65+
]
66+
)
67+
Chart.Scatter(
68+
Name = "Line",
69+
Mode = StyleParam.Mode.Lines, // creates multicategory line chart
70+
MultiX = [["C";"C";"D";"D"];["CA"; "CB"; "DA"; "DB"]],
71+
MultiY = [
72+
["A";"A";"B";"B"] |> Seq.map (fun x -> x :> IConvertible) // you can use different IConvertibles if you cast here
73+
[1; 2; -1; -2] |> Seq.map (fun x -> x :> IConvertible)
74+
]
75+
)
76+
Chart.Scatter(
77+
Name = "SplineArea",
78+
Mode = StyleParam.Mode.Lines, // creates multicategory splinearea chart
79+
MultiX = [["E";"E";"F";"F"];["EA"; "EB"; "FA"; "FB"]],
80+
MultiY = [
81+
["A";"A";"B";"B"] |> Seq.map (fun x -> x :> IConvertible) // you can use different IConvertibles if you cast here
82+
[1; 2; -1; -2] |> Seq.map (fun x -> x :> IConvertible)
83+
],
84+
Line = Line.init(Shape = StyleParam.Shape.Spline),
85+
Fill = StyleParam.Fill.ToZero_y
86+
)
87+
]
88+
|> Chart.combine
89+
|> Chart.withSize(Width = 1000)
90+
91+
(*** condition: ipynb ***)
92+
#if IPYNB
93+
multicategoryScatterAndDerived
94+
#endif // IPYNB
95+
96+
(***hide***)
97+
multicategoryScatterAndDerived |> GenericChart.toChartHTML
98+
(***include-it-raw***)
99+
100+
(**
101+
## Bar and Column
102+
*)
103+
let multiCategoryBarColumn =
104+
[
105+
Chart.Bar(
106+
values = [1; 2; -1; -2],
107+
MultiKeys = [["A";"A";"B";"B"];["AA"; "AB"; "BA"; "BB"]],
108+
Name = "Bar"
109+
)
110+
Chart.Column(
111+
values = [1; 2; -1; -2],
112+
MultiKeys = [["A";"A";"B";"B"];["AA"; "AB"; "BA"; "BB"]],
113+
Name = "Column"
114+
)
115+
]
116+
|> Chart.Grid (nRows = 1, nCols = 2)
117+
|> Chart.withSize(Width = 1000)
118+
119+
(*** condition: ipynb ***)
120+
#if IPYNB
121+
multiCategoryBarColumn
122+
#endif // IPYNB
123+
124+
(***hide***)
125+
multiCategoryBarColumn |> GenericChart.toChartHTML
126+
(***include-it-raw***)
127+
128+
(**
129+
## Histogram
130+
*)
131+
132+
let multicategoryHistogram =
133+
Chart.Histogram(
134+
MultiX = [["A";"A";"A";"B";"B"];["AA"; "AA"; "AB"; "BA"; "BB"]]
135+
)
136+
137+
(*** condition: ipynb ***)
138+
#if IPYNB
139+
multicategoryHistogram
140+
#endif // IPYNB
141+
142+
(***hide***)
143+
multicategoryHistogram |> GenericChart.toChartHTML
144+
(***include-it-raw***)
145+
146+
(**
147+
## Histogram2D
148+
*)
149+
150+
let multicategoryHistogram2D =
151+
Chart.Histogram2D(
152+
MultiX = [["A";"A";"A";"B";"B"];["AA"; "AA"; "AB"; "BA"; "BB"]],
153+
MultiY = [["A";"A";"A";"B";"B"];["AA"; "AA"; "AB"; "BA"; "BB"]]
154+
)
155+
156+
(*** condition: ipynb ***)
157+
#if IPYNB
158+
multicategoryHistogram2D
159+
#endif // IPYNB
160+
161+
(***hide***)
162+
multicategoryHistogram2D |> GenericChart.toChartHTML
163+
(***include-it-raw***)
164+
165+
(**
166+
## BoxPlot and Violin
167+
*)
168+
169+
let multicategoryBoxPlotViolin =
170+
[
171+
[
172+
Chart.BoxPlot(
173+
Name = "BoxPlot 1",
174+
Y = [1;1;2;3;4;3;2],
175+
MultiX = [["A"; "A"; "A"; "A"; "A"; "A"; "A"];["AA"; "AA"; "AA"; "AA"; "AA"; "AA"; "AA"]]
176+
)
177+
Chart.BoxPlot(
178+
Name = "BoxPlot 2",
179+
Y = [1;1;2;3;4;3;2],
180+
MultiX = [["A"; "A"; "A"; "A"; "A"; "A"; "A"];["AB"; "AB"; "AB"; "AB"; "AB"; "AB"; "AB"]]
181+
)
182+
Chart.BoxPlot(
183+
Name = "BoxPlot 3",
184+
Y = [1;1;2;3;4;3;2],
185+
MultiX = [["B"; "B"; "B"; "B"; "B"; "B"; "B"];["BB"; "BB"; "BB"; "BB"; "BB"; "BB"; "BB"]]
186+
)
187+
]
188+
|> Chart.combine
189+
[
190+
Chart.Violin(
191+
Name = "Violin 1",
192+
Y = [1;1;2;3;4;3;2],
193+
MultiX = [["A"; "A"; "A"; "A"; "A"; "A"; "A"];["AA"; "AA"; "AA"; "AA"; "AA"; "AA"; "AA"]]
194+
)
195+
Chart.Violin(
196+
Name = "Violin 2",
197+
Y = [1;1;2;3;4;3;2],
198+
MultiX = [["A"; "A"; "A"; "A"; "A"; "A"; "A"];["AB"; "AB"; "AB"; "AB"; "AB"; "AB"; "AB"]]
199+
)
200+
Chart.Violin(
201+
Name = "Violin 3",
202+
Y = [1;1;2;3;4;3;2],
203+
MultiX = [["B"; "B"; "B"; "B"; "B"; "B"; "B"];["BB"; "BB"; "BB"; "BB"; "BB"; "BB"; "BB"]]
204+
)
205+
]
206+
|> Chart.combine
207+
]
208+
|> Chart.Grid (nRows = 1, nCols = 2)
209+
|> Chart.withSize(Width = 1000)
210+
211+
(*** condition: ipynb ***)
212+
#if IPYNB
213+
multicategoryBoxPlotViolin
214+
#endif // IPYNB
215+
216+
(***hide***)
217+
multicategoryBoxPlotViolin |> GenericChart.toChartHTML
218+
(***include-it-raw***)
219+
220+
(**
221+
## Histogram2DContour
222+
*)
223+
224+
let multicategoryHistogram2DContour =
225+
Chart.Histogram2DContour(
226+
MultiX = [["A";"A";"A";"B";"B"];["AA"; "AA"; "AB"; "BA"; "BB"]],
227+
MultiY = [["A";"A";"A";"B";"B"];["AA"; "AA"; "AB"; "BA"; "BB"]]
228+
)
229+
230+
(*** condition: ipynb ***)
231+
#if IPYNB
232+
multicategoryHistogram2DContour
233+
#endif // IPYNB
234+
235+
(***hide***)
236+
multicategoryHistogram2DContour |> GenericChart.toChartHTML
237+
(***include-it-raw***)
238+
239+
(**
240+
## Heatmap and AnnotatedHeatmap
241+
*)
242+
243+
let multicategoryHeatmap =
244+
Chart.Heatmap(
245+
zData = [
246+
[1;2;3]
247+
[2;3;1]
248+
[3;1;2]
249+
],
250+
MultiX = [["A";"A";"B"];["AA";"AB";"BA"]],
251+
MultiY = [["A";"A";"B"];["AA";"AB";"BA"]]
252+
)
253+
254+
(*** condition: ipynb ***)
255+
#if IPYNB
256+
multicategoryHeatmap
257+
#endif // IPYNB
258+
259+
(***hide***)
260+
multicategoryHeatmap |> GenericChart.toChartHTML
261+
(***include-it-raw***)
262+
263+
let multicategoryAnnotatedHeatmap =
264+
Chart.AnnotatedHeatmap(
265+
zData = [
266+
[1;2;3]
267+
[2;3;1]
268+
[3;1;2]
269+
],
270+
annotationText = [
271+
["A;AA x A;AA";"A;AA x A;AB";"A;AA x B;BA"]
272+
["A;AB x A;AA";"A;AB x A;AB";"A;AB x B;BA"]
273+
["B;BA x A;AA";"B;BA x A;AB";"B;BA x B;BA"]
274+
],
275+
MultiX = [["A";"A";"B"];["AA";"AB";"BA"]],
276+
MultiY = [["A";"A";"B"];["AA";"AB";"BA"]]
277+
)
278+
279+
(*** condition: ipynb ***)
280+
#if IPYNB
281+
multicategoryAnnotatedHeatmap
282+
#endif // IPYNB
283+
284+
(***hide***)
285+
multicategoryAnnotatedHeatmap |> GenericChart.toChartHTML
286+
(***include-it-raw***)
287+
288+
(**
289+
## Contour
290+
*)
291+
292+
let multicategoryContour =
293+
Chart.Contour(
294+
zData = [
295+
[1;2;3]
296+
[2;3;1]
297+
[3;1;2]
298+
],
299+
MultiX = [["A";"A";"B"];["AA";"AB";"BA"]],
300+
MultiY = [["A";"A";"B"];["AA";"AB";"BA"]]
301+
)
302+
303+
(*** condition: ipynb ***)
304+
#if IPYNB
305+
multicategoryContour
306+
#endif // IPYNB
307+
308+
(***hide***)
309+
multicategoryContour |> GenericChart.toChartHTML
310+
(***include-it-raw***)
311+
312+
(**
313+
## OHLC and Candlestick
314+
*)
315+
316+
let multicategoryFinance =
317+
[
318+
Chart.OHLC(
319+
``open`` = [1;2],
320+
high = [3;4],
321+
low = [0;1],
322+
close = [0.5;1.],
323+
MultiX = [["A";"A"];["AA";"AB"]],
324+
Name = "OHLC"
325+
)
326+
Chart.Candlestick(
327+
``open`` = [1;2],
328+
high = [3;4],
329+
low = [0;1],
330+
close = [0.5;1.],
331+
MultiX = [["A";"A"];["AA";"AB"]],
332+
Name = "Candlestick"
333+
)
334+
]
335+
|> Chart.Grid (nRows = 1, nCols = 2)
336+
|> Chart.withSize(Width = 1000)
337+
338+
(*** condition: ipynb ***)
339+
#if IPYNB
340+
multicategoryFinance
341+
#endif // IPYNB
342+
343+
(***hide***)
344+
multicategoryFinance |> GenericChart.toChartHTML
345+
(***include-it-raw***)

0 commit comments

Comments
 (0)