Skip to content

Commit 4f8f45c

Browse files
kMutagenekMutagene
committed
add ohlc docs
1 parent 5dc4c93 commit 4f8f45c

File tree

7 files changed

+159
-26
lines changed

7 files changed

+159
-26
lines changed

‎Plotly.NET.sln‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -82,11 +82,12 @@ Project("{2150E333-8FDC-42A3-9474-1A3956D46DE8}") = "docs", "docs", "{7B09CC0A-F
8282
docs\06_1_mapbox-plots.fsx = docs\06_1_mapbox-plots.fsx
8383
docs\06_2_choropleth-mapbox.fsx = docs\06_2_choropleth-mapbox.fsx
8484
docs\06_3_density-mapbox.fsx = docs\06_3_density-mapbox.fsx
85-
docs\07_0_candlestick.fsx = docs\07_0_candlestick.fsx
86-
docs\07_1_funnel.fsx = docs\07_1_funnel.fsx
87-
docs\07_2_funnel_area.fsx = docs\07_2_funnel_area.fsx
88-
docs\07_3_indicator.fsx = docs\07_3_indicator.fsx
89-
docs\07_4_waterfall.fsx = docs\07_4_waterfall.fsx
85+
docs\07_0_ohlc.fsx = docs\07_0_ohlc.fsx
86+
docs\07_1_candlestick.fsx = docs\07_1_candlestick.fsx
87+
docs\07_2_funnel.fsx = docs\07_2_funnel.fsx
88+
docs\07_3_funnel_area.fsx = docs\07_3_funnel_area.fsx
89+
docs\07_4_indicator.fsx = docs\07_4_indicator.fsx
90+
docs\07_5_waterfall.fsx = docs\07_5_waterfall.fsx
9091
docs\08_0_polar_line-scatter-plots.fsx = docs\08_0_polar_line-scatter-plots.fsx
9192
docs\08_1_polar_bar_charts.fsx = docs\08_1_polar_bar_charts.fsx
9293
docs\08_2_styling_polar_layouts.fsx = docs\08_2_styling_polar_layouts.fsx

‎docs/07_0_ohlc.fsx‎

Lines changed: 125 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,125 @@
1+
(**
2+
---
3+
title: Candlestick Charts
4+
category: Finance Charts
5+
categoryindex: 8
6+
index: 1
7+
---
8+
*)
9+
10+
(*** hide ***)
11+
12+
(*** condition: prepare ***)
13+
#r "nuget: Newtonsoft.JSON, 12.0.3"
14+
#r "nuget: DynamicObj"
15+
#r "../bin/Plotly.NET/netstandard2.0/Plotly.NET.dll"
16+
17+
(*** condition: ipynb ***)
18+
#if IPYNB
19+
#r "nuget: Plotly.NET, {{fsdocs-package-version}}"
20+
#r "nuget: Plotly.NET.Interactive, {{fsdocs-package-version}}"
21+
#endif // IPYNB
22+
23+
(**
24+
# Candlestick Charts
25+
26+
[![Binder]({{root}}img/badge-binder.svg)](https://mybinder.org/v2/gh/plotly/Plotly.NET/gh-pages?filepath={{fsdocs-source-basename}}.ipynb) 
27+
[![Script]({{root}}img/badge-script.svg)]({{root}}{{fsdocs-source-basename}}.fsx) 
28+
[![Notebook]({{root}}img/badge-notebook.svg)]({{root}}{{fsdocs-source-basename}}.ipynb)
29+
30+
*Summary:* This example shows how to create candlestick charts in F#.
31+
32+
let's first create some data for the purpose of creating example charts:
33+
*)
34+
#r "nuget: FSharp.Data"
35+
#r "nuget: Deedle"
36+
37+
open FSharp.Data
38+
open Deedle
39+
40+
let data =
41+
Http.RequestString @"https://raw.githubusercontent.com/plotly/datasets/master/finance-charts-apple.csv"
42+
|> fun csv -> Frame.ReadCsvString(csv,true,separators=",")
43+
44+
let openData : seq<float> = data.["AAPL.Open"] |> Series.values
45+
let highData : seq<float> = data.["AAPL.High"] |> Series.values
46+
let lowData : seq<float> = data.["AAPL.Low"] |> Series.values
47+
let closeData : seq<float> = data.["AAPL.Close"] |> Series.values
48+
let dateData = data |> Frame.getCol "Date" |> Series.values |> Seq.map System.DateTime.Parse
49+
50+
(**
51+
An open-high-low-close chart (also OHLC) is a type of chart typically used to illustrate movements in the price of a financial instrument over time.
52+
Each vertical line on the chart shows the price range (the highest and lowest prices) over one unit of time.
53+
Tick marks project from each side of the line indicating the opening price (e.g., for a daily bar chart this would be the starting price for that day) on the left, and the closing price for that time period on the right.
54+
The bars may be shown in different hues depending on whether prices rose or fell in that period.
55+
56+
You can create an OHLC chart using `Chart.OHLC`:
57+
*)
58+
59+
open Plotly.NET
60+
open Plotly.NET.TraceObjects
61+
62+
let ohlc1 =
63+
Chart.OHLC(
64+
openData |> Seq.take 30,
65+
highData |> Seq.take 30,
66+
lowData |> Seq.take 30,
67+
closeData |> Seq.take 30,
68+
dateData |> Seq.take 30
69+
)
70+
71+
(*** condition: ipynb ***)
72+
#if IPYNB
73+
ohlc1
74+
#endif // IPYNB
75+
76+
(***hide***)
77+
ohlc1 |> GenericChart.toChartHTML
78+
(***include-it-raw***)
79+
80+
(**
81+
## Changing the increasing/decresing colors
82+
*)
83+
84+
let ohlc2=
85+
Chart.OHLC(
86+
openData,
87+
highData,
88+
lowData,
89+
closeData,
90+
dateData,
91+
IncreasingColor = Color.fromKeyword Cyan,
92+
DecreasingColor = Color.fromKeyword Gray
93+
)
94+
95+
(*** condition: ipynb ***)
96+
#if IPYNB
97+
ohlc2
98+
#endif // IPYNB
99+
100+
(***hide***)
101+
ohlc2 |> GenericChart.toChartHTML
102+
(***include-it-raw***)
103+
104+
(**
105+
## Removing the rangeslider
106+
107+
If you want to hide the rangeslider, use `withXAxisRangeSlider` and hide it:
108+
*)
109+
open Plotly.NET.LayoutObjects
110+
111+
let rangeslider = RangeSlider.init(Visible=false)
112+
113+
let ohlc3 =
114+
ohlc2
115+
|> Chart.withXAxisRangeSlider rangeslider
116+
117+
(*** condition: ipynb ***)
118+
#if IPYNB
119+
ohlc3
120+
#endif // IPYNB
121+
122+
(***hide***)
123+
ohlc3 |> GenericChart.toChartHTML
124+
(***include-it-raw***)
125+

docs/07_0_candlestick.fsx renamed to docs/07_1_candlestick.fsx

Lines changed: 24 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,11 @@
1+
2+
13
(**
24
---
35
title: Candlestick Charts
46
category: Finance Charts
57
categoryindex: 8
6-
index: 1
8+
index: 2
79
---
810
*)
911

@@ -32,24 +34,26 @@ index: 1
3234
let's first create some data for the purpose of creating example charts:
3335
*)
3436

35-
open Plotly.NET
36-
open Plotly.NET.LayoutObjects
37+
#r "nuget: FSharp.Data"
38+
#r "nuget: Deedle"
39+
40+
open FSharp.Data
41+
open Deedle
42+
43+
open Plotly.NET
3744
open Plotly.NET.TraceObjects
3845

39-
let candles =
40-
[|("2020-01-17T13:40:00", 0.68888, 0.68888, 0.68879, 0.6888);
41-
("2020-01-17T13:41:00", 0.68883, 0.68884, 0.68875, 0.68877);
42-
("2020-01-17T13:42:00", 0.68878, 0.68889, 0.68878, 0.68886);
43-
("2020-01-17T13:43:00", 0.68886, 0.68886, 0.68876, 0.68879);
44-
("2020-01-17T13:44:00", 0.68879, 0.68879, 0.68873, 0.68874);
45-
("2020-01-17T13:45:00", 0.68875, 0.68877, 0.68867, 0.68868);
46-
("2020-01-17T13:46:00", 0.68869, 0.68887, 0.68869, 0.68883);
47-
("2020-01-17T13:47:00", 0.68883, 0.68899, 0.68883, 0.68899);
48-
("2020-01-17T13:48:00", 0.68898, 0.689, 0.68885, 0.68889);
49-
("2020-01-17T13:49:00", 0.68889, 0.68893, 0.68881, 0.68893);
50-
("2020-01-17T13:50:00", 0.68891, 0.68896, 0.68886, 0.68891);
51-
|]
52-
|> Array.map (fun (d,o,h,l,c)->System.DateTime.Parse d, StockData.Create(o,h,l,c))
46+
let data =
47+
Http.RequestString @"https://raw.githubusercontent.com/plotly/datasets/master/finance-charts-apple.csv"
48+
|> fun csv -> Frame.ReadCsvString(csv,true,separators=",")
49+
50+
let openData = data.["AAPL.Open"] |> Series.values |> Array.ofSeq
51+
let highData = data.["AAPL.High"] |> Series.values |> Array.ofSeq
52+
let lowData = data.["AAPL.Low"] |> Series.values |> Array.ofSeq
53+
let closeData = data.["AAPL.Close"] |> Series.values |> Array.ofSeq
54+
let dateData = data |> Frame.getCol "Date" |> Series.values |> Seq.map System.DateTime.Parse |> Array.ofSeq
55+
56+
let candles = [for i in 0 .. 29 -> dateData.[i], StockData.create openData.[i] highData.[i] lowData.[i] closeData.[i]]
5357
(**
5458
A candlestick chart is useful for plotting stock prices over time. A candle
5559
is a group of high, open, close and low values over a period of time, e.g. 1 minute, 5 minute, hour, day, etc..
@@ -70,6 +74,9 @@ candles1 |> GenericChart.toChartHTML
7074
(**
7175
If you want to hide the rangeslider, use `withXAxisRangeSlider` and hide it:
7276
*)
77+
78+
open Plotly.NET.LayoutObjects
79+
7380
let rangeslider = RangeSlider.init(Visible=false)
7481

7582
let candles2 =

docs/07_1_funnel.fsx renamed to docs/07_2_funnel.fsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
title: Funnel Charts
44
category: Finance Charts
55
categoryindex: 7
6-
index: 2
6+
index: 3
77
---
88
*)
99

docs/07_2_funnel_area.fsx renamed to docs/07_3_funnel_area.fsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
title: FunnelArea Charts
44
category: Finance Charts
55
categoryindex: 7
6-
index: 3
6+
index: 4
77
---
88
*)
99

docs/07_3_indicator.fsx renamed to docs/07_4_indicator.fsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
title: Indicator Charts
44
category: Finance Charts
55
categoryindex: 7
6-
index: 4
6+
index: 5
77
---
88
*)
99

docs/07_4_waterfall.fsx renamed to docs/07_5_waterfall.fsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
title: Waterfall Charts
44
category: Finance Charts
55
categoryindex: 7
6-
index: 5
6+
index: 6
77
---
88
*)
99

0 commit comments

Comments
 (0)