Issue with F# Plotly.NET chart descriptions

Question

I'm trying to plot a line chart with a description, using the first method identified in https://plotly.net/00_2_display-options.html.

While the code runs, and the chart is correctly plotted, I can't see the description.

Here's the code block:

let description1 =
    ChartDescription.create "Cumulative Growth of Market and HmL Factors" ""

Chart.combine(
    [Chart.Line(
        hmlGrowth,
        Name="Hml")
     Chart.Line(
         marketGrowth,
         Name="Mkt")
    |> Chart.withDescription(description1)
    |> Chart.withYAxisStyle (AxisType = StyleParam.AxisType.Log)
    |> Chart.withXAxisStyle("Date")
    ]
)

If I add |> Chart.show I get a compilation error, perhaps because I'm using a Notebook.

Any help is greatly appreciated.

EDIT: managed to get in touch with the authors, should be sorted. https://github.com/plotly/Plotly.NET/issues/281

score 1 · Answer 1 · answered Apr 27 '22 at 10:27

This works if you run code in F# Interactive and display it using Chart.show, but it does not work in .NET Interactive. When using Chart.show, the description is added below the chart as ordinary HTML block, so I suspect the formatter for .NET Interactive just somhow ignores this part. I think this is a bug and it would be good to report & fix this.

As a workaround, it seems that you can post-process the HTML generated for charts and add whatever additional code you need by getting the HTML and then returning it using the HTML helper. For example:

let showWithHeading s c = 
    HTML("<h3>" + s + "</h3>" + Plotly.NET.GenericChart.toChartHTML(c))

Chart.combine(
    [Chart.Line(
        hmlGrowth,
        Name="Hml")
     Chart.Line(
         marketGrowth,
         Name="Mkt")
    |> Chart.withYAxisStyle (AxisType = StyleParam.AxisType.Log)
    |> Chart.withXAxisStyle("Date")
    ]
)
|> showWithHeading "Cumulative Growth of Market and HmL Factors"

Thank you very much. I'll report this and give your suggestion a try. Appreciate the help! — fython, Apr 27 '22 at 12:23

score 1 · Answer 2 · answered Apr 27 '22 at 10:47

I second Tomas's point that it looks like a bug with Plotly.NET's current notebook formatter.

One option is to use Chart.withTitle

#r "nuget:Plotly.NET, 2.0.0-preview.18"
#r "nuget:Plotly.NET.Interactive, 2.0.0-preview.18"

open System
open Plotly.NET

let hmlGrowth = [
    DateTime(2005, 1,1), 1.0
    DateTime(2006,1,1), 2.0 ]

let marketGrowth = hmlGrowth |> List.map (fun (a,b) -> a, b + 1.0)

Chart.combine([
    Chart.Line(
        hmlGrowth,
        Name="Hml")
    Chart.Line(
        marketGrowth,
        Name="Mkt")
    ])
|> Chart.withYAxisStyle (AxisType = StyleParam.AxisType.Log)
|> Chart.withXAxisStyle ("Date")
|> Chart.withTitle("Cumulative Growth of Market and HmL Factors")

Thank you very much. Yes definitely Chart.withTitle is a good workaround - the issue is, of course, space. The idea with Chart.withDescription is that it would allow me to include more info, if needed, as I could continue adding text under the chart. Thank you very much nevertheless!! — fython, Apr 27 '22 at 12:21

score 0 · Answer 3 · answered Apr 28 '22 at 09:10

0

Managed to get in touch with the authors, should be sorted: https://github.com/plotly/Plotly.NET/issues/281

answered Apr 28 '22 at 09:10

fython

11
2

As it’s currently written, your answer is unclear. Please [edit] to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Apr 28 '22 at 12:50

Issue with F# Plotly.NET chart descriptions

3 Answers3