XPlot


Google Geo charts

This example shows how to create geo charts and line charts using the XPlot.GoogleCharts library.

To create a geo chart, use the Chart.Geo function. As usual, you can specify additional options of the chart using Chart.WithOptions including properties such as title, legend and so on. More interestingly, this also lets you specify color axis (for filling countries with a range of colors) and it lets you provide the region parameter for displaying only a part of the world.

A simple geo chart

The following example calls Chart.Geo with a list of key value pairs. Google Charts automatically recognize country names and country codes, so the following readable code works just fine:

1: 
2: 
3: 
4: 
5: 
let pop =
  [ "Germany", 200; "United States", 300
    "Brazil", 400;  "Canada", 500
    "France", 600;  "RU", 700 ]
Chart.Geo(pop, Labels=["Name"; "Popularity"])

A regional geo chart

The following example is different in two ways:

  • It plots data for a specified region, which is specified using the region property of Options
  • It uses two different values - the first is used to determine the color of the circle and the second one specifies its size.

As before, we can specify the cities using just names. The Chart.Geo method is overloaded and takes a series of either two-element (as above) or three-element (as below) tuples:

 1: 
 2: 
 3: 
 4: 
 5: 
 6: 
 7: 
 8: 
 9: 
10: 
11: 
12: 
13: 
14: 
15: 
16: 
let data =
  [ ("Rome", 2761477, 1285.31); ("Milan", 1324110, 181.76);
    ("Naples", 959574, 117.27); ("Turin", 907563, 130.17);
    ("Palermo", 655875, 158.9); ("Genoa", 607906, 243.60);
    ("Bologna", 380181, 140.7); ("Florence", 371282, 102.41);
    ("Anzio", 52192, 43.43);    ("Ciampino", 38262, 11.) ]
 
let options =
  Options
    ( region = "IT", displayMode = "markers",
      colorAxis = ColorAxis(colors = [|"green"; "blue"|]) ) 
 
data
|> Chart.Geo
|> Chart.WithLabels ["Population"; "Area"]
|> Chart.WithOptions options
namespace XPlot
module GoogleCharts

from XPlot
val pop : (string * int) list

Full name: Google-geo-chart.pop
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 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 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
  static member Bubble : data:seq<string * #value * #value> * ?Labels:seq<string> * ?Options:Options -> GoogleChart
  static member Calendar : data:seq<DateTime * #value> * ?Labels:seq<string> * ?Options:Options -> GoogleChart
  ...

Full name: XPlot.GoogleCharts.Chart
static member Chart.Geo : data:seq<string * #value * #value> * ?Labels:seq<string> * ?Options:Options -> GoogleChart
static member Chart.Geo : data:seq<string * #value> * ?Labels:seq<string> * ?Options:Options -> GoogleChart
val data : (string * int * float) list

Full name: Google-geo-chart.data
val options : Options

Full name: Google-geo-chart.options
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
Multiple items
type ColorAxis =
  new : unit -> ColorAxis
  member ShouldSerializecolors : unit -> bool
  member ShouldSerializelegend : unit -> bool
  member ShouldSerializemaxValue : unit -> bool
  member ShouldSerializeminValue : unit -> bool
  member ShouldSerializevalues : unit -> bool
  member colors : string []
  member legend : Legend
  member maxValue : int
  member minValue : int
  ...

Full name: XPlot.GoogleCharts.Configuration.ColorAxis

--------------------
new : unit -> ColorAxis
static member Chart.WithLabels : labels:seq<string> -> chart:GoogleChart -> GoogleChart
static member Chart.WithOptions : options:Options -> chart:GoogleChart -> GoogleChart
Fork me on GitHub