In [1]:

#r "nuget: Newtonsoft.Json, 12.0.3"
#r "nuget: Plotly.NET,  2.0.0-preview.10"
#r "nuget: Plotly.NET.Interactive,  2.0.0-preview.10"
#r "nuget:Deedle"
#r "nuget: FSharp.Data"

Installed Packages

Deedle, 2.4.3
FSharp.Data, 4.2.4
Newtonsoft.Json, 12.0.3
Plotly.NET, 2.0.0-preview.10
Plotly.NET.Interactive, 2.0.0-preview.10

Loading extensions from Plotly.NET.Interactive.dll

Added Kernel Extension including formatters for Plotly.NET charts.

The candlestick chart is a style of financial chart describing open, high, low and close for a given x coordinate (most likely time). The boxes represent the spread between the open and close values and the lines represent the spread between the low and high values. Sample points where the close value is higher (lower) then the open value are called increasing (decreasing). By default, increasing candles are drawn in green whereas decreasing are drawn in red.

Simple Candlestick¶

In [2]:

open Deedle
open FSharp.Data
open Plotly.NET
open System.Globalization
open Plotly.NET.TraceObjects

let dataset =
    Http.RequestString "https://raw.githubusercontent.com/plotly/datasets/master/finance-charts-apple.csv"
    |> fun csv -> Frame.ReadCsvString(csv, true, separators = ",")

let getColumn column =
    dataset
    |> Frame.getCol column
    |> Series.values
    |> Array.ofSeq

let format = "MM/dd/yyyy hh:mm:ss"
let provider = CultureInfo.InvariantCulture

let getDateTime d =
    DateTime.ParseExact(string (d), format, provider)

let stockData =
    dataset
    |> Frame.mapRows
        (fun k v ->
            (v.Get("Date") |> getDateTime,
             StockData.Create(v?``AAPL.Open``, v?``AAPL.High``, v?``AAPL.Low``, v?``AAPL.Close``)))
    |> Series.values
    |> Array.ofSeq

Chart.Candlestick(stockData)

Out[2]:

Candlestick without Rangeslider¶

In [3]:

open Plotly.NET.LayoutObjects

Chart.Candlestick(stockData)
|> Chart.withXAxisRangeSlider(RangeSlider.init(Visible=false))

Out[3]:

Adding Customized Text and Annotations¶

In [4]:

let annotation =
    Annotation.init (
        X = "2016-12-09",
        Y = 0.05,
        Text = "Increase Period Begins",
        XRef = "x",
        YRef = "paper",
        ShowArrow = false
    )

let line =
    Shape.init (
        StyleParam.ShapeType.Line,
        X0 = "2016-12-09",
        X1 = "2016-12-09",
        Y0 = 0,
        Y1 = 1,
        Xref = "x",
        Yref = "paper",
        Line = Line.init (Width = 1.5)
    )

Chart.Candlestick(stockData)
|> Chart.withTitle (title = "The Great Recession")
|> Chart.withAnnotations ([ annotation ])
|> Chart.withShapes ([ line ])
|> Chart.withLayout (Layout.init (PlotBGColor = Color.fromString "#e5ecf6", Width = 800))
|> Chart.withXAxisRangeSlider (RangeSlider.init (Visible = false))

Out[4]:

Custom Candlestick Colors (Not Working)¶

In [5]:

Chart.Candlestick(
    stockData,
    Increasing = Line.init (Color = Color.fromString "cyan"),
    Decreasing = Line.init (Color = Color.fromString "gray")
)

Out[5]:

Simple Example¶

In [6]:

let dates =
    [ for i in 1 .. 5 -> DateTime.Now.AddDays(float i) ]

let open_price = [ 10.0; 5.0; 7.0; 12.0; 10.0 ]
let close = [ 20.0; 3.0; 12.0; 21.0; 5.0 ]
let low = [ 5.0; 1.0; 5.0; 12.0; 3.0 ]
let high = [ 25.0; 10.0; 15.0; 27.0; 15.0 ]

let stock_data =
    [ for i in 0 .. 4 -> (dates.[i], StockData.Create(o = open_price.[i], h = high.[i], l = low.[i], c = close.[i])) ]

Chart.Candlestick(stock_data)

Out[6]: