In [1]:

#r "nuget: Plotly.NET,2.0.0-preview.8"
#r "nuget: Plotly.NET.Interactive,2.0.0-preview.8"
#r "nuget: FSharp.Data"

Installed Packages

FSharp.Data, 4.2.4
Plotly.NET, 2.0.0-preview.8
Plotly.NET.Interactive, 2.0.0-preview.8

Loading extensions from Plotly.NET.Interactive.dll

Added Kernel Extension including formatters for Plotly.NET charts.

Mapbox Access Token and Base Map Configuration¶

To plot on Mapbox maps with Plotly you may need a Mapbox account and a public Mapbox Access Token.

Lines on Mapbox maps¶

In [2]:

open Plotly.NET
open FSharp.Data
open Plotly.NET.TraceObjects
open Plotly.NET.LayoutObjects

let data = CsvFile.Load("https://raw.githubusercontent.com/plotly/datasets/master/us-cities-top-1k.csv")

let getData state = data.Rows 
                        |> Seq.filter (fun row -> row.GetColumn("State") = state)
                        |> Seq.map (fun row -> row.GetColumn("lon"),row.GetColumn("lat"))

let newyorkData = getData "New York"
let ohioData = getData "Ohio"

[
    Chart.LineMapbox(newyorkData,Name="New York")
    Chart.LineMapbox(ohioData,Name="Ohio")
]
|> Chart.combine
|> Chart.withMapbox(mapBox = Mapbox.init(Style=StyleParam.MapboxStyle.StamenTerrain,Center=(-80.,41.),Zoom=3.))
|> Chart.withMarginSize(Left=0,Right=0,Top=0,Bottom=0)

Out[2]:

Lines on Mapbox maps using ScatterMapbox traces¶

This example uses Chart.ScatterMapbox and sets the mode attribute to a combination of markers and line.

In [3]:

[ 
    Chart.ScatterMapbox(longitudes = [ 10; 20; 30 ], latitudes = [ 10; 20; 30 ], mode = StyleParam.Mode.Lines_Markers)
    Chart.ScatterMapbox(longitudes = [ -50; -60; 40 ], latitudes = [ 30; 10; -20 ], mode = StyleParam.Mode.Lines_Markers) 
]

|> Chart.combine
|> Chart.withMarkerStyle (Size = 10)
|> Chart.withMarginSize (Left = 0, Right = 0, Top = 0, Bottom = 0)
|> Chart.withMapbox (Mapbox.init (Center = (10., 10.), Style = StyleParam.MapboxStyle.StamenTerrain, Zoom = 1.))

Out[3]: