XPlot


XPlot - F# Data Visualization Package

XPlot is a cross-platform data visualization package for the F# programming language powered by popular JavaScript charting libraries Google Charts and Plotly. The library provides a complete mapping for the configuration options of the underlying libraries and so you get a nice F# interface that gives you access to the full power of Google Charts and Plotly. The XPlot library can be used interactively from F# Interactive, but charts can equally easy be embedded in F# applications and in HTML reports.

The next two demos show some of the more complex and advanced charts that can be created using XPlot. If you're getting started with XPlot, see the other documentation pages for simpler charts.

Google Charts example

The following example uses the Google Charts library to create a combo chart showing coffee production in Bolivia, Ecuador and Madagascar (as bar plots), together with the average visualized as a line chart:

 1: 
 2: 
 3: 
 4: 
 5: 
 6: 
 7: 
 8: 
 9: 
10: 
11: 
12: 
let series = [ "bars"; "bars"; "bars"; "lines" ]
let inputs = [ Bolivia; Ecuador; Madagascar; Average ]

inputs
|> Chart.Combo
|> Chart.WithOptions 
     (Options(title = "Coffee Production", series = 
        [| for typ in series -> Series(typ) |]))
|> Chart.WithLabels 
     ["Bolivia"; "Ecuador"; "Madagascar"; "Average"]
|> Chart.WithLegend true
|> Chart.WithSize (600, 250)

The XPlot library uses the F# |> operator to configure charts. In the above example, we use Chart.Combo to create a basic chart and then we set a number of properties - Chart.WithOptions specifies how the chart looks, Chart.WithLabels and Chart.WithLegend adds the legend that annotates the individual chart series.

Plotly example

The following example uses the Plotly online data analytics and visualization tool. It creates a scatter plot, rendered on a polar chart with different marker color for each of the trials stored in the HobbsPearson data set:

 1: 
 2: 
 3: 
 4: 
 5: 
 6: 
 7: 
 8: 
 9: 
10: 
11: 
12: 
let traces =
  [ for trial in HobbsPearson ->
    Scatter(r = trial.Radial, t = trial.Angular, 
      mode = "markers", marker = Marker(color=trial.Color))]

let layout =
  Layout(title = "Hobbs-Pearson Trials", showlegend = false,
    plot_bgcolor = "rgb(223,223,223)")

traces
|> Chart.Plot
|> Chart.WithLayout layout

The code snippet creates one Scatter data series for each of the trials in the input. It sets the r and t properties to two lists of input values. If we wanted to produce an ordinary rectangular scatter plot, we could instead set the x and y properties.

How to get XPlot

XPlot as part of FsLab

If you want to get XPlot as part of larger package of F# and .NET tools for doing data science, then check out the FsLab web site. This gives you a nice cross-platform environment where you can access data using F# Data type providers, analyze the data using Deedle data frames and series and then visualize data using XPlot.

Stand alone XPlot packages

Alternatively, you can reference XPlot via a NuGet package.

Documentation

The documentation for the library is automatically generated from F# script files that you can find in the docs/content folder on GitHub. The links in the right panel point to a number of tutorials that demonstrate some common scenarios. You can also copy the source code from GitHub.

Additionally, the library also comes with an API reference that is generated from code comments. This is work in progress, so please help us & contribute comments and documentation! The most important types are:

  • Google Chart type contains methods for creating charts like Chart.Line and for configuring charts like Chart.WithOptions.

  • Google Options type contains parameters for charts that are specified using Chart.WithOptions.

  • Google Configuration module contains other types that are used as parameters to Chart.WithOptions.

  • Plotly Graph module contains methods for creating various kinds of charts such as Scatter used above.

  • Plotly Layout type specifies common properties of Plotly charts like title and color.

namespace XPlot
namespace XPlot.GoogleCharts
val Bolivia : (string * float) list

Full name: Index.Bolivia
val Ecuador : (string * float) list

Full name: Index.Ecuador
val Madagascar : (string * float) list

Full name: Index.Madagascar
val Average : (string * float) list

Full name: Index.Average
type HobbsPearsonTrial =
  {Radial: float list;
   Angular: obj list;
   Color: string;}

Full name: Index.HobbsPearsonTrial
HobbsPearsonTrial.Radial: float list
Multiple items
val float : value:'T -> float (requires member op_Explicit)

Full name: Microsoft.FSharp.Core.Operators.float

--------------------
type float = System.Double

Full name: Microsoft.FSharp.Core.float

--------------------
type float<'Measure> = float

Full name: Microsoft.FSharp.Core.float<_>
type 'T list = List<'T>

Full name: Microsoft.FSharp.Collections.list<_>
HobbsPearsonTrial.Angular: obj list
type obj = System.Object

Full name: Microsoft.FSharp.Core.obj
Multiple items
HobbsPearsonTrial.Color: string

--------------------
type Color =
  new : unit -> Color
  member ShouldSerializefill : unit -> bool
  member ShouldSerializefillOpacity : unit -> bool
  member ShouldSerializestroke : unit -> bool
  member ShouldSerializestrokeWidth : unit -> bool
  member fill : string
  member fillOpacity : float
  member stroke : string
  member strokeWidth : int
  member fill : string with set
  ...

Full name: XPlot.GoogleCharts.Configuration.Color

--------------------
new : unit -> Color
Multiple items
val string : value:'T -> string

Full name: Microsoft.FSharp.Core.Operators.string

--------------------
type string = System.String

Full name: Microsoft.FSharp.Core.string
val HobbsPearson : HobbsPearsonTrial list

Full name: Index.HobbsPearson
Multiple items
type Color =
  new : unit -> Color
  member ShouldSerializefill : unit -> bool
  member ShouldSerializefillOpacity : unit -> bool
  member ShouldSerializestroke : unit -> bool
  member ShouldSerializestrokeWidth : unit -> bool
  member fill : string
  member fillOpacity : float
  member stroke : string
  member strokeWidth : int
  member fill : string with set
  ...

Full name: XPlot.GoogleCharts.Configuration.Color

--------------------
new : unit -> Color
val series : string list

Full name: Index.series
val inputs : (string * float) list list

Full name: Index.inputs
type Chart =
  static member Annotation : data:seq<#seq<DateTime * 'V * string * string>> * ?Labels:seq<string> * ?Options:Options -> GoogleChart (requires 'V :> value)
  static member Annotation : data:seq<DateTime * #value * string * string> * ?Labels:seq<string> * ?Options:Options -> GoogleChart
  static member Area : data:seq<#seq<'K * 'V>> * ?Labels:seq<string> * ?Options:Options -> GoogleChart (requires 'K :> key and 'V :> value)
  static member Area : data:seq<#key * #value> * ?Labels:seq<string> * ?Options:Options -> GoogleChart
  static member Area : data:seq<#value> * ?Labels:seq<string> * ?Options:Options -> GoogleChart
  static member Bar : data:seq<#seq<'K * 'V>> * ?Labels:seq<string> * ?Options:Options -> GoogleChart (requires 'K :> key and 'V :> value)
  static member Bar : data:seq<#key * #value> * ?Labels:seq<string> * ?Options:Options -> GoogleChart
  static member Bar : data:seq<#value> * ?Labels:seq<string> * ?Options:Options -> GoogleChart
  static member Bubble : data:seq<string * #value * #value * #value * #value> * ?Labels:seq<string> * ?Options:Options -> GoogleChart
  static member Bubble : data:seq<string * #value * #value * #value> * ?Labels:seq<string> * ?Options:Options -> GoogleChart
  ...

Full name: XPlot.GoogleCharts.Chart
static member Chart.Combo : data:seq<#seq<'K * 'V>> * ?Labels:seq<string> * ?Options:Options -> GoogleChart (requires 'K :> key and 'V :> value)
static member Chart.WithOptions : options:Options -> chart:GoogleChart -> GoogleChart
Multiple items
type Options =
  new : unit -> Options
  member ShouldSerializeaggregationTarget : unit -> bool
  member ShouldSerializeallValuesSuffix : unit -> bool
  member ShouldSerializeallowHtml : unit -> bool
  member ShouldSerializealternatingRowStyle : unit -> bool
  member ShouldSerializeanimation : unit -> bool
  member ShouldSerializeannotations : unit -> bool
  member ShouldSerializeannotationsWidth : unit -> bool
  member ShouldSerializeareaOpacity : unit -> bool
  member ShouldSerializeavoidOverlappingGridLines : unit -> bool
  ...

Full name: XPlot.GoogleCharts.Configuration.Options

--------------------
new : unit -> Options
val typ : string
Multiple items
type Series =
  new : ?type:string -> Series
  member ShouldSerializeannotations : unit -> bool
  member ShouldSerializeareaOpacity : unit -> bool
  member ShouldSerializecolor : unit -> bool
  member ShouldSerializecurveType : unit -> bool
  member ShouldSerializefallingColor : unit -> bool
  member ShouldSerializelineWidth : unit -> bool
  member ShouldSerializepointShape : unit -> bool
  member ShouldSerializepointSize : unit -> bool
  member ShouldSerializerisingColor : unit -> bool
  ...

Full name: XPlot.GoogleCharts.Configuration.Series

--------------------
new : ?type:string -> Series
static member Chart.WithLabels : labels:seq<string> -> chart:GoogleChart -> GoogleChart
static member Chart.WithLegend : enabled:bool -> chart:GoogleChart -> GoogleChart
static member Chart.WithSize : size:(int * int) -> chart:GoogleChart -> GoogleChart
namespace XPlot.Plotly
val traces : Scatter list

Full name: Index.traces
val trial : HobbsPearsonTrial
Multiple items
type Scatter =
  inherit Trace
  new : unit -> Scatter
  member ShouldSerializeconnectgaps : unit -> bool
  member ShouldSerializedx : unit -> bool
  member ShouldSerializedy : unit -> bool
  member ShouldSerializeerror_x : unit -> bool
  member ShouldSerializeerror_y : unit -> bool
  member ShouldSerializefill : unit -> bool
  member ShouldSerializefillcolor : unit -> bool
  member ShouldSerializehoverinfo : unit -> bool
  ...

Full name: XPlot.Plotly.Graph.Scatter

--------------------
new : unit -> Scatter
property Scatter.r: obj
property Scatter.t: obj
Multiple items
type Marker =
  new : unit -> Marker
  member ShouldSerializeautocolorscale : unit -> bool
  member ShouldSerializecauto : unit -> bool
  member ShouldSerializecmax : unit -> bool
  member ShouldSerializecmin : unit -> bool
  member ShouldSerializecolor : unit -> bool
  member ShouldSerializecolorbar : unit -> bool
  member ShouldSerializecolors : unit -> bool
  member ShouldSerializecolorscale : unit -> bool
  member ShouldSerializecolorsrc : unit -> bool
  ...

Full name: XPlot.Plotly.Graph.Marker

--------------------
new : unit -> Marker
HobbsPearsonTrial.Color: string
val layout : Layout

Full name: Index.layout
Multiple items
module Layout

from XPlot.Plotly

--------------------
type Layout =
  new : unit -> Layout
  member ShouldSerializeangularaxis : unit -> bool
  member ShouldSerializeannotations : unit -> bool
  member ShouldSerializeautosize : unit -> bool
  member ShouldSerializebargap : unit -> bool
  member ShouldSerializebargroupgap : unit -> bool
  member ShouldSerializebarmode : unit -> bool
  member ShouldSerializeboxmode : unit -> bool
  member ShouldSerializedirection : unit -> bool
  member ShouldSerializedragmode : unit -> bool
  ...

Full name: XPlot.Plotly.Layout.Layout

--------------------
new : unit -> Layout
type Chart =
  static member Area : data:seq<#seq<'a1 * 'a2>> -> PlotlyChart (requires 'a1 :> key and 'a2 :> value)
  static member Area : data:seq<#key * #value> -> PlotlyChart
  static member Area : data:seq<#value> -> PlotlyChart
  static member Bar : data:seq<#seq<'a1 * 'a2>> -> PlotlyChart (requires 'a1 :> key and 'a2 :> value)
  static member Bar : data:seq<#key * #value> -> PlotlyChart
  static member Bar : data:seq<#value> -> PlotlyChart
  static member Bubble : data:seq<#key * #value * #value> -> PlotlyChart
  static member Column : data:seq<#seq<'a1 * 'a2>> -> PlotlyChart (requires 'a1 :> key and 'a2 :> value)
  static member Column : data:seq<#key * #value> -> PlotlyChart
  static member Column : data:seq<#value> -> PlotlyChart
  ...

Full name: XPlot.Plotly.Chart
static member Chart.Plot : data:seq<#Trace> -> PlotlyChart
static member Chart.Plot : data:Trace -> PlotlyChart
static member Chart.Plot : data:seq<#Trace> * layout:Layout -> PlotlyChart
static member Chart.Plot : data:Trace * layout:Layout -> PlotlyChart
static member Chart.WithLayout : layout:Layout -> chart:PlotlyChart -> PlotlyChart
Fork me on GitHub