2

I've tried Chart.WithSize and displayZoomButtons = true in the FSLab tutorial, but nothing seems to change the output.

Same thing in other projects using XPlot.GoogleCharts directly.

enter image description here

Am I missing something?

Rei Miyasaka
  • 7,007
  • 6
  • 42
  • 69

2 Answers2

1

Download Plotly 1.4.2 from nuget and replace the dlls in the FSLab packages directory for XPlotly (see Plotting with Xplotly Q). Then you can use Xplotly's controls to zoom in and out, save the chart, etc. For example:

#load @"..\..\FSLAB\packages\FsLab\FsLab.fsx"
open XPlot.Plotly
open XPlot.Plotly.Graph
open XPlot.Plotly.Html
//open XPlot.GoogleCharts

let layout = Layout(title = "Basic Bar Chart")
["giraffes", 20; "orangutans", 14; "monkeys", 23]
    |> Chart.Bar
    |> Chart.WithLayout layout
    |> Chart.WithHeight 400
    |> Chart.WithWidth 700
    |> Chart.Show

enter image description here

Community
  • 1
  • 1
s952163
  • 6,276
  • 4
  • 23
  • 47
  • 1
    Looks like there are a lot of charts that aren't exposed through `XPlot.Plotly`... notably, candlesticks, pies and calendars are missing :/ – Rei Miyasaka Oct 13 '16 at 05:15
  • 1
    @ReiMiyasaka Yes, I noticed. I'm not very familiar with GoogleCharts in Xplot but I had the same problem, could not resize the chart. You might want to file an issue on github. – s952163 Oct 13 '16 at 05:26
  • 1
    I've decided to try implementing my own html/javascript charting proxy. Shouldn't be too hard with an embedded ASP.Net Core server, and it'll give me access to all the free javascript visualization libraries. – Rei Miyasaka Oct 14 '16 at 00:24
  • @ReiMiyasaka would be nice to see it on github. :) – s952163 Oct 14 '16 at 00:27
  • 1
    Maybe! It won't be very much code, since I don't intend to make it nearly as composable or configurable as XPlot -- just going to hard-code most of the generated html/js in an .fsx file so I can mess with it directly. It's probably more suited for a blog entry -- except I don't have a blog right now. I'll figure something out. – Rei Miyasaka Oct 14 '16 at 00:35
  • Actually, I just realized -- it's not necessary to use a web server for this; just generate an .html file, save it in the temp folder, and `Process.Start()` it. Derp. – Rei Miyasaka Oct 30 '16 at 22:37
0

Very barebones charting solution using Plotly (and it works):

open Newtonsoft.Json

let html = """<head>
  <script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
</head>
<body>
  <div id="myDiv" style="width: 100%; height: 100%;"></div>
  <script>
    var data = __DATA__;
    var layout = __LAYOUT__;
    Plotly.newPlot('myDiv', data, layout);
  </script>
</body>"""

let (=>) k v = k, (v:>obj)

let doPlot data layout =
    let data = JsonConvert.SerializeObject data
    let layout = JsonConvert.SerializeObject layout
    let path = Path.GetTempPath() + DateTime.Now.Ticks.ToString() + ".html"
    File.WriteAllText(path, html.Replace("__DATA__", data).Replace("__LAYOUT__", layout))
    System.Diagnostics.Process.Start(path)

let layout =
    [ "title" => "Plot"
      "xaxis" => dict [
        "title" => "Ticks"
        "showgrid" => false
        "zeroline" => false
      ]
      "yaxis" => dict [
        "title" => "Price"
        "showline" => false
      ]
    ] |> dict

let data = [
    dict [ "x" => [1999; 2000; 2001; 2002]
           "y" => [16; 5; 11; 9]
         ]
    ]

doPlot data layout
Rei Miyasaka
  • 7,007
  • 6
  • 42
  • 69