/
6_1_mapbox-plots.fsx
127 lines (107 loc) · 3.49 KB
/
6_1_mapbox-plots.fsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
(**
---
title: Scatter and line plots on Mapbox maps
category: Mapbox map charts
categoryindex: 7
index: 2
---
*)
(*** hide ***)
(*** condition: prepare ***)
#r "nuget: Newtonsoft.JSON, 12.0.3"
#r "nuget: DynamicObj"
#r "../bin/Plotly.NET/netstandard2.0/Plotly.NET.dll"
(*** condition: ipynb ***)
#if IPYNB
#r "nuget: Plotly.NET, {{fsdocs-package-version}}"
#r "nuget: Plotly.NET.Interactive, {{fsdocs-package-version}}"
#endif // IPYNB
(**
# Scatter and line plots on Mapbox maps
[](https://mybinder.org/v2/gh/plotly/Plotly.NET/gh-pages?filepath={{fsdocs-source-basename}}.ipynb) 
[]({{root}}{{fsdocs-source-basename}}.fsx) 
[]({{root}}{{fsdocs-source-basename}}.ipynb)
*Summary:* This example shows how to create Point and Line charts on Mapbox maps in F#.
let's first create some data for the purpose of creating example charts:
*)
open Plotly.NET
let cityNames = [
"Montreal"; "Toronto"; "Vancouver"; "Calgary"; "Edmonton";
"Ottawa"; "Halifax"; "Victoria"; "Winnepeg"; "Regina"
]
let lon = [
-73.57; -79.24; -123.06; -114.1; -113.28;
-75.43; -63.57; -123.21; -97.13; -104.6
]
let lat = [
45.5; 43.4; 49.13; 51.1; 53.34; 45.24;
44.64; 48.25; 49.89; 50.45
]
(**
The simplest type of geographic plot using Mapbox is plotting the (lon,lat) pairs of a location via `Chart.PointMapbox`.
Here is an example using the location of Canadian cities:
*)
open Plotly.NET.LayoutObjects
let pointMapbox =
Chart.PointMapbox(
lon,lat,
Labels = cityNames,
TextPosition = StyleParam.TextPosition.TopCenter
)
|> Chart.withMapbox(
Mapbox.init(
Style=StyleParam.MapboxStyle.OpenStreetMap,
Center=(-104.6,50.45)
)
)
(*** condition: ipynb ***)
#if IPYNB
pointMapbox
#endif // IPYNB
(***hide***)
pointMapbox |> GenericChart.toChartHTML
(***include-it-raw***)
(**
To connect the given (lon,lat) pairs via straight lines, use `Chart.LineGeo`.
Below is an example that pulls external data as a Deedle data
frame containing the source and target locations of American Airlines flights from Feb. 2011:
*)
#r "nuget: Deedle"
#r "nuget: FSharp.Data"
open Deedle
open FSharp.Data
open System.IO
open System.Text
let data =
Http.RequestString "https://raw.githubusercontent.com/plotly/datasets/c34aaa0b1b3cddad335173cb7bc0181897201ee6/2011_february_aa_flight_paths.csv"
|> fun csv -> Frame.ReadCsvString(csv,true,separators=",")
let opacityVals : float [] = data.["cnt"] |> Series.values |> fun s -> s |> Seq.map (fun v -> v/(Seq.max s)) |> Array.ofSeq
let startCoords = Series.zipInner data.["start_lon"] data.["start_lat"]
let endCoords = Series.zipInner data.["end_lon"] data.["end_lat"]
let coords = Series.zipInner startCoords endCoords |> Series.values
let flights =
coords
|> Seq.mapi (fun i (startCoords,endCoords) ->
Chart.LineMapbox(
[startCoords; endCoords],
Opacity = opacityVals.[i],
Color = Color.fromString "red"
)
)
|> Chart.combine
|> Chart.withLegend(false)
|> Chart.withMapbox(
Mapbox.init(
Style=StyleParam.MapboxStyle.OpenStreetMap,
Center=(-97.0372,32.8959)
)
)
|> Chart.withMarginSize(0,0,50,0)
|> Chart.withTitle "Feb. 2011 American Airline flights"
(*** condition: ipynb ***)
#if IPYNB
flights
#endif // IPYNB
(***hide***)
flights |> GenericChart.toChartHTML
(***include-it-raw***)