Refactor FinanceChart tests

Author: kMutagene

tests/Common/FSharpTestBase/TestCharts/Chart2DTestCharts.fs

@@ -135,7 +135,22 @@ module StackedArea =
         ]
         |> Chart.combine
 
-module Funnel = ()
+module Funnel = 
+
+    let ``Simple funnel chart`` =
+        let y = [|"Sales person A"; "Sales person B"; "Sales person C"; "Sales person D"; "Sales person E"|]
+        let x = [|1200.; 909.4; 600.6; 300.; 80.|]
+
+        // Customize the connector lines used to connect the funnel bars
+        let connectorLine = Line.init (Color=Color.fromString "royalblue", Dash=StyleParam.DrawingStyle.Dot, Width=3.)
+        let connector = FunnelConnector.init(Line=connectorLine)
+    
+        // Customize the outline of the funnel bars
+        let line = Line.init(Width=2.,Color=Color.fromString "3E4E88")
+    
+        Chart.Funnel (x = x, y = y,MarkerColor=Color.fromString "59D4E8", MarkerOutline=line, Connector=connector, UseDefaults = false)
+        |> Chart.withMarginSize(Left=100)
+
 
 module StackedFunnel = ()
 
@@ -398,9 +413,33 @@ module Contour =
         Chart.Contour(zData = z, UseDefaults = false)
         |> Chart.withSize(600.,600.)
 
-module OHLC = ()
+module OHLC = 
+    
+    let internal candles =
+        [|("2020-01-17T13:40:00", 0.68888, 0.68888, 0.68879, 0.6888);
+          ("2020-01-17T13:41:00", 0.68883, 0.68884, 0.68875, 0.68877);
+          ("2020-01-17T13:42:00", 0.68878, 0.68889, 0.68878, 0.68886);
+          ("2020-01-17T13:43:00", 0.68886, 0.68886, 0.68876, 0.68879);
+          ("2020-01-17T13:44:00", 0.68879, 0.68879, 0.68873, 0.68874);
+          ("2020-01-17T13:45:00", 0.68875, 0.68877, 0.68867, 0.68868);
+          ("2020-01-17T13:46:00", 0.68869, 0.68887, 0.68869, 0.68883);
+          ("2020-01-17T13:47:00", 0.68883, 0.68899, 0.68883, 0.68899);
+          ("2020-01-17T13:48:00", 0.68898, 0.689, 0.68885, 0.68889);
+          ("2020-01-17T13:49:00", 0.68889, 0.68893, 0.68881, 0.68893);
+          ("2020-01-17T13:50:00", 0.68891, 0.68896, 0.68886, 0.68891);
+        |]
+        |> Array.map (fun (d,o,h,l,c)->System.DateTime.Parse d, StockData.Create(o,h,l,c))
+
+    let ``Simple OHLC chart`` = Chart.OHLC(stockTimeSeries = candles, UseDefaults = false)
+
+    let ``Simple OHLC chart without range slider`` = Chart.OHLC(stockTimeSeries = candles, ShowXAxisRangeSlider = false, UseDefaults = false)
+
+module Candlestick = 
+
+    let ``Simple candlestick chart`` = Chart.Candlestick(stockTimeSeries = OHLC.candles, UseDefaults = false)
+
+    let ``Simple candlestick chart without range slider`` = Chart.Candlestick(stockTimeSeries = OHLC.candles, ShowXAxisRangeSlider = false, UseDefaults = false)
 
-module Candlestick = ()
 
 module Splom = 
 

tests/Common/FSharpTestBase/TestCharts/ChartDomainTestCharts.fs

@@ -52,7 +52,35 @@ module Doughnut =
             UseDefaults = false
         )
 
-module FunnelArea = ()
+module FunnelArea = 
+
+    let ``Simple funnelarea chart`` = 
+        let values = [|5; 4; 3; 2; 1|]
+        let text = [|"The 1st"; "The 2nd"; "The 3rd"; "The 4th"; "The 5th"|]
+        let line = Line.init (Color=Color.fromString "purple", Width=3.)
+        Chart.FunnelArea(values=values, MultiText=text, SectionOutline=line, UseDefaults = false)
+
+
+    
+    let ``Styled funnelarea chart`` =
+        let values = [|5; 4; 3|]
+        let labels = [|"The 1st"; "The 2nd"; "The 3rd"|]
+
+        Chart.FunnelArea(
+            values = values,
+            Labels = labels,
+            MultiText = labels,
+            SectionColors = [
+                Color.fromKeyword Aqua
+                Color.fromKeyword Salmon
+                Color.fromKeyword Tan
+            ],
+            SectionOutlineColor = Color.fromKeyword Black,
+            SectionOutlineWidth = 2.,
+            AspectRatio = 0.75,
+            BaseRatio = 0.1,
+            UseDefaults = false
+        )
 
 module Sunburst = ()
 
@@ -203,6 +231,50 @@ module Table =
         |> Chart.withSize(Width=chartwidth)
         |> Chart.withTitle "Sequence A"
 
-module Indicator = ()
+module Indicator = 
+    
+    open Plotly.NET.TraceObjects
+    open Plotly.NET.LayoutObjects
+
+    let ``Angular gauge indicator`` =
+        ChartDomain.Chart.Indicator(
+            value = 200., 
+            mode = StyleParam.IndicatorMode.NumberDeltaGauge,
+            Delta   = IndicatorDelta.init(Reference=160),
+            Range   = StyleParam.Range.MinMax(0., 250.),
+            Domain  = Domain.init(Row = 0, Column = 0), 
+            UseDefaults = false
+        )
+
+    let ``Bullet gauge indicator`` =
+        Chart.Indicator(
+            value = 120, 
+            mode = StyleParam.IndicatorMode.NumberDeltaGauge,
+            DeltaReference = 90,
+            Range = StyleParam.Range.MinMax(-200., 200.),
+            GaugeShape = StyleParam.IndicatorGaugeShape.Bullet,
+            ShowGaugeAxis = false,
+            Domain  = Domain.init(Row = 0, Column = 1), 
+            UseDefaults = false
+        )
+
+    let ``Delta indicator with reference`` =
+        Chart.Indicator(
+            value = "300", 
+            mode = StyleParam.IndicatorMode.NumberDelta,
+            DeltaReference = 90.,
+            Domain  = Domain.init(Row = 1, Column = 0), 
+            UseDefaults = false
+        )
+
+    let ``Delta indicator`` =
+        Chart.Indicator(
+            value = 40., 
+            mode = StyleParam.IndicatorMode.Delta,
+            DeltaReference = 90.,
+            Domain  = Domain.init(Row = 1, Column = 1), 
+            UseDefaults = false
+        )
+
 
 module Icicle = ()

tests/CoreTests/CoreTests/CoreTests.fsproj

@@ -30,7 +30,6 @@
     <Compile Include="Traces\TraceID.fs" />
     <Compile Include="HtmlCodegen\SimpleTests.fs" />
     <Compile Include="HtmlCodegen\ChartLayout.fs" />
-    <Compile Include="HtmlCodegen\FinanceCharts.fs" />
     <Compile Include="HtmlCodegen\PolarCharts.fs" />
     <Compile Include="HtmlCodegen\TernaryCharts.fs" />
     <Compile Include="HtmlCodegen\CarpetCharts.fs" />

tests/CoreTests/CoreTests/HTMLCodegen/Chart2D.fs

@@ -149,6 +149,14 @@ module Funnel =
     let ``Funnel chart HTML codegeneration tests`` =
         testList "HTMLCodegen.Chart2D" [
             testList "Funnel" [
+                testCase "Funnel data" ( fun () ->
+                    """var data = [{"type":"funnel","x":[1200.0,909.4,600.6,300.0,80.0],"y":["Sales person A","Sales person B","Sales person C","Sales person D","Sales person E"],"marker":{"color":"59D4E8","line":{"color":"3E4E88","width":2.0}},"connector":{"line":{"color":"royalblue","width":3.0,"dash":"dot"}}}];"""
+                    |> chartGeneratedContains Funnel.``Simple funnel chart``
+                );
+                testCase "Funnel layout" ( fun () ->
+                    "var layout = {\"margin\":{\"l\":100}};"
+                    |> chartGeneratedContains Funnel.``Simple funnel chart``
+                );
             ]
         ]
 
@@ -442,6 +450,22 @@ module OHLC =
     let ``OHLC chart HTML codegeneration tests`` =
         testList "HTMLCodegen.Chart2D" [
             testList "OHLC" [
+                testCase "simple OHLC data" ( fun () ->
+                    """var data = [{"type":"ohlc","x":["2020-01-17T13:40:00","2020-01-17T13:41:00","2020-01-17T13:42:00","2020-01-17T13:43:00","2020-01-17T13:44:00","2020-01-17T13:45:00","2020-01-17T13:46:00","2020-01-17T13:47:00","2020-01-17T13:48:00","2020-01-17T13:49:00","2020-01-17T13:50:00"],"close":[0.6888,0.68877,0.68886,0.68879,0.68874,0.68868,0.68883,0.68899,0.68889,0.68893,0.68891],"open":[0.68888,0.68883,0.68878,0.68886,0.68879,0.68875,0.68869,0.68883,0.68898,0.68889,0.68891],"high":[0.68888,0.68884,0.68889,0.68886,0.68879,0.68877,0.68887,0.68899,0.689,0.68893,0.68896],"low":[0.68879,0.68875,0.68878,0.68876,0.68873,0.68867,0.68869,0.68883,0.68885,0.68881,0.68886],"increasing":{"line":{}},"decreasing":{"line":{}}}];"""
+                    |> chartGeneratedContains OHLC.``Simple OHLC chart``
+                );
+                testCase "simple OHLC layout" ( fun () ->
+                    """var layout = {"xaxis":{"rangeslider":{"yaxis":{}}}};"""
+                    |> chartGeneratedContains OHLC.``Simple OHLC chart``
+                );
+                testCase "OHLC no range slider data" ( fun () ->
+                    """var data = [{"type":"ohlc","x":["2020-01-17T13:40:00","2020-01-17T13:41:00","2020-01-17T13:42:00","2020-01-17T13:43:00","2020-01-17T13:44:00","2020-01-17T13:45:00","2020-01-17T13:46:00","2020-01-17T13:47:00","2020-01-17T13:48:00","2020-01-17T13:49:00","2020-01-17T13:50:00"],"close":[0.6888,0.68877,0.68886,0.68879,0.68874,0.68868,0.68883,0.68899,0.68889,0.68893,0.68891],"open":[0.68888,0.68883,0.68878,0.68886,0.68879,0.68875,0.68869,0.68883,0.68898,0.68889,0.68891],"high":[0.68888,0.68884,0.68889,0.68886,0.68879,0.68877,0.68887,0.68899,0.689,0.68893,0.68896],"low":[0.68879,0.68875,0.68878,0.68876,0.68873,0.68867,0.68869,0.68883,0.68885,0.68881,0.68886],"increasing":{"line":{}},"decreasing":{"line":{}}}];"""
+                    |> chartGeneratedContains OHLC.``Simple OHLC chart without range slider``
+                );
+                testCase "OHLC no range slider layout" ( fun () ->
+                    """var layout = {"xaxis":{"rangeslider":{"visible":false,"yaxis":{}}}};"""
+                    |> chartGeneratedContains OHLC.``Simple OHLC chart without range slider``
+                );
             ]
         ]
 
@@ -450,6 +474,22 @@ module Candlestick =
     let ``Candlestick chart HTML codegeneration tests`` =
         testList "HTMLCodegen.Chart2D" [
             testList "Candlestick" [
+                testCase "simple Candlestick data" ( fun () ->
+                    """var data = [{"type":"candlestick","x":["2020-01-17T13:40:00","2020-01-17T13:41:00","2020-01-17T13:42:00","2020-01-17T13:43:00","2020-01-17T13:44:00","2020-01-17T13:45:00","2020-01-17T13:46:00","2020-01-17T13:47:00","2020-01-17T13:48:00","2020-01-17T13:49:00","2020-01-17T13:50:00"],"close":[0.6888,0.68877,0.68886,0.68879,0.68874,0.68868,0.68883,0.68899,0.68889,0.68893,0.68891],"open":[0.68888,0.68883,0.68878,0.68886,0.68879,0.68875,0.68869,0.68883,0.68898,0.68889,0.68891],"high":[0.68888,0.68884,0.68889,0.68886,0.68879,0.68877,0.68887,0.68899,0.689,0.68893,0.68896],"low":[0.68879,0.68875,0.68878,0.68876,0.68873,0.68867,0.68869,0.68883,0.68885,0.68881,0.68886],"increasing":{"line":{}},"decreasing":{"line":{}}}];"""
+                    |> chartGeneratedContains Candlestick.``Simple candlestick chart``
+                );
+                testCase "simple Candlestick layout" ( fun () ->
+                    """var layout = {"xaxis":{"rangeslider":{"yaxis":{}}}};"""
+                    |> chartGeneratedContains Candlestick.``Simple candlestick chart``
+                );
+                testCase "Candlestick no range slider data" ( fun () ->
+                    """var data = [{"type":"candlestick","x":["2020-01-17T13:40:00","2020-01-17T13:41:00","2020-01-17T13:42:00","2020-01-17T13:43:00","2020-01-17T13:44:00","2020-01-17T13:45:00","2020-01-17T13:46:00","2020-01-17T13:47:00","2020-01-17T13:48:00","2020-01-17T13:49:00","2020-01-17T13:50:00"],"close":[0.6888,0.68877,0.68886,0.68879,0.68874,0.68868,0.68883,0.68899,0.68889,0.68893,0.68891],"open":[0.68888,0.68883,0.68878,0.68886,0.68879,0.68875,0.68869,0.68883,0.68898,0.68889,0.68891],"high":[0.68888,0.68884,0.68889,0.68886,0.68879,0.68877,0.68887,0.68899,0.689,0.68893,0.68896],"low":[0.68879,0.68875,0.68878,0.68876,0.68873,0.68867,0.68869,0.68883,0.68885,0.68881,0.68886],"increasing":{"line":{}},"decreasing":{"line":{}}}];"""
+                    |> chartGeneratedContains Candlestick.``Simple candlestick chart without range slider``
+                );
+                testCase "Candlestick no range slider layout" ( fun () ->
+                    """var layout = {"xaxis":{"rangeslider":{"visible":false,"yaxis":{}}}};"""
+                    |> chartGeneratedContains Candlestick.``Simple candlestick chart without range slider``
+                );
             ]
         ]
 

tests/CoreTests/CoreTests/HTMLCodegen/ChartDomain.fs

@@ -51,6 +51,20 @@ module FunnelArea =
     let ``FunnelArea chart HTML codegeneration tests`` =
         testList "HTMLCodegen.ChartDomain" [
             testList "FunnelArea" [
+                testCase "Funnel area data" ( fun () ->
+                """var data = [{"type":"funnelarea","values":[5,4,3,2,1],"text":["The 1st","The 2nd","The 3rd","The 4th","The 5th"],"marker":{"line":{"color":"purple","width":3.0}}}];"""
+                |> chartGeneratedContains FunnelArea.``Simple funnelarea chart``
+                );
+                testCase "Funnel area layout" ( fun () ->
+                    emptyLayout FunnelArea.``Simple funnelarea chart``
+                );        
+                testCase "Funnel area styled data" ( fun () ->
+                    """var data = [{"type":"funnelarea","values":[5,4,3],"labels":["The 1st","The 2nd","The 3rd"],"text":["The 1st","The 2nd","The 3rd"],"marker":{"colors":["rgba(0, 255, 255, 1.0)","rgba(250, 128, 114, 1.0)","rgba(210, 180, 140, 1.0)"],"line":{"color":"rgba(0, 0, 0, 1.0)","width":2.0}},"aspectratio":0.75,"baseratio":0.1}];"""
+                    |> chartGeneratedContains FunnelArea.``Styled funnelarea chart``
+                );
+                testCase "Funnel area styled layout" ( fun () ->
+                    emptyLayout FunnelArea.``Styled funnelarea chart``
+                );
             ]
         ]
 
@@ -136,6 +150,34 @@ module Indicator =
     let ``Indicator chart HTML codegeneration tests`` =
         testList "HTMLCodegen.ChartDomain" [
             testList "Indicator" [
+                testCase "Angular gauge indicator data" ( fun () ->
+                    """var data = [{"type":"indicator","mode":"number+delta+gauge","value":200.0,"domain":{"row":0,"column":0},"delta":{"reference":160},"gauge":{"axis":{"range":[0.0,250.0]}}}];"""
+                    |> chartGeneratedContains Indicator.``Angular gauge indicator``
+                );
+                testCase "Angular gauge indicator layout" ( fun () ->
+                    emptyLayout Indicator.``Angular gauge indicator``
+                );
+                testCase "Bullet gauge indicator data" ( fun () ->
+                    """var data = [{"type":"indicator","mode":"number+delta+gauge","value":120,"domain":{"row":0,"column":1},"delta":{"reference":90},"gauge":{"axis":{"visible":false,"range":[-200.0,200.0]},"shape":"bullet"}}];"""
+                    |> chartGeneratedContains Indicator.``Bullet gauge indicator``
+                );
+                testCase "Bullet gauge indicator layout" ( fun () ->
+                    emptyLayout Indicator.``Bullet gauge indicator``
+                );
+                testCase "Delta indicator with reference data" ( fun () ->
+                    """var data = [{"type":"indicator","mode":"number+delta","value":"300","domain":{"row":1,"column":0},"delta":{"reference":90.0},"gauge":{"axis":{}}}];"""
+                    |> chartGeneratedContains Indicator.``Delta indicator with reference``
+                );
+                testCase "Delta indicator with reference layout" ( fun () ->
+                    emptyLayout Indicator.``Delta indicator with reference``
+                );
+                testCase "Delta indicator data" ( fun () ->
+                    """var data = [{"type":"indicator","mode":"delta","value":40.0,"domain":{"row":1,"column":1},"delta":{"reference":90.0},"gauge":{"axis":{}}}];"""
+                    |> chartGeneratedContains Indicator.``Delta indicator``
+                );
+                testCase "Delta indicator layout" ( fun () ->
+                    emptyLayout Indicator.``Delta indicator``
+                );
             ]
         ]