Mapbox Maps vs Geo Maps

BinderScriptNotebook

Summary: This introduction shows the differences between Geo and Mapbox based geographical charts.

Plotly and therefore Plotly.NET supports two different kinds of maps:

  • Mapbox maps are tile-based maps. If your figure is created with a Chart.*Mapbox function or otherwise contains one or more traces of type scattermapbox, choroplethmapbox or densitymapbox, the layout.mapbox object in your figure contains configuration information for the map itself.

  • Geo maps are outline-based maps. If your figure is created with a Chart.ScatterGeo,Chart.PointGeo,Chart.LineGeoorChart.Choroplethfunction or otherwise contains one or more traces of typescattergeoorchoropleth`, the layout.geo object in your figure contains configuration information for the map itself.

This page documents Geo outline-based maps, and the [Mapbox Layers documentation](https://plotly.net//060geo-vs-mapbox.html) describes how to configure Mapbox tile-based maps.

Physical Base Maps

Plotly Geo maps have a built-in base map layer composed of "physical" and "cultural" (i.e. administrative border) data from the Natural Earth Dataset. Various lines and area fills can be shown or hidden, and their color and line-widths specified. In the default plotly template, a map frame and physical features such as a coastal outline and filled land areas are shown, at a small-scale 1:110m resolution:

open Plotly.NET

let baseMapOnly = 
    Chart.PointGeo([]) // deliberately empty chart to show the base map only
    |> Chart.withMarginSize(0,0,0,0)

To control the features of the map, a Geo object is used that can be associtaed with a given chart using the Chart.WithGeo function. Here is a map with all physical features enabled and styled, at a larger-scale 1:50m resolution:

open Plotly.NET.LayoutObjects

let myGeo =
    Geo.init(
        Resolution=StyleParam.GeoResolution.R50,
        ShowCoastLines=true, 
        CoastLineColor=Color.fromString "RebeccaPurple",
        ShowLand=true, 
        LandColor=Color.fromString "LightGreen",
        ShowOcean=true, 
        OceanColor=Color.fromString "LightBlue",
        ShowLakes=true, 
        LakeColor=Color.fromString "Blue",
        ShowRivers=true, 
        RiverColor=Color.fromString "Blue"
    )

let moreFeaturesBaseMap =
    Chart.PointGeo([])
    |> Chart.withGeo myGeo
    |> Chart.withMarginSize(0,0,0,0)

Cultural Base Maps

In addition to physical base map features, a "cultural" base map is included which is composed of country borders and selected sub-country borders such as states.

Note and disclaimer: cultural features are by definition subject to change, debate and dispute. Plotly includes data from Natural Earth "as-is" and defers to the Natural Earth policy regarding disputed borders which read:

Natural Earth Vector draws boundaries of countries according to defacto status. We show who actually controls the situation on the ground.

Here is a map with only cultural features enabled and styled, at a 1:50m resolution, which includes only country boundaries. See below for country sub-unit cultural base map features:

let countryGeo =
    Geo.init(
        Visible=false, 
        Resolution=StyleParam.GeoResolution.R50,
        ShowCountries=true, 
        CountryColor=Color.fromString "RebeccaPurple"
    )


let countryBaseMap =
    Chart.PointGeo([])
    |> Chart.withGeo countryGeo
    |> Chart.withMarginSize(0,0,0,0)
namespace Plotly
namespace Plotly.NET
val baseMapOnly : GenericChart.GenericChart
type Chart = static member Area : x:seq<#IConvertible> * y:seq<#IConvertible> * ?Name:string * ?ShowMarkers:bool * ?ShowLegend:bool * ?MarkerSymbol:MarkerSymbol * ?Color:Color * ?Opacity:float * ?Labels:seq<#IConvertible> * ?TextPosition:TextPosition * ?TextFont:Font * ?Dash:DrawingStyle * ?Width:float -> GenericChart + 1 overload static member Bar : values:seq<#IConvertible> * ?Keys:seq<#IConvertible> * ?Name:string * ?ShowLegend:bool * ?Color:Color * ?PatternShape:PatternShape * ?MultiPatternShape:seq<PatternShape> * ?Pattern:Pattern * ?Base:#IConvertible * ?Width:'a3 * ?MultiWidth:seq<'a3> * ?Opacity:float * ?MultiOpacity:seq<float> * ?Text:'a4 * ?MultiText:seq<'a4> * ?TextPosition:TextPosition * ?MultiTextPosition:seq<TextPosition> * ?TextFont:Font * ?Marker:Marker -> GenericChart (requires 'a3 :> IConvertible and 'a4 :> IConvertible) + 1 overload static member BoxPlot : ?x:'a0 * ?y:'a1 * ?Name:string * ?ShowLegend:bool * ?Color:Color * ?Fillcolor:Color * ?Opacity:float * ?Whiskerwidth:'a2 * ?Boxpoints:Boxpoints * ?Boxmean:BoxMean * ?Jitter:'a3 * ?Pointpos:'a4 * ?Orientation:Orientation * ?Marker:Marker * ?Line:Line * ?Alignmentgroup:'a5 * ?Offsetgroup:'a6 * ?Notched:bool * ?NotchWidth:float * ?QuartileMethod:QuartileMethod -> GenericChart + 1 overload static member Bubble : x:seq<#IConvertible> * y:seq<#IConvertible> * sizes:seq<int> * ?Name:string * ?ShowLegend:bool * ?MarkerSymbol:MarkerSymbol * ?Color:Color * ?Opacity:float * ?Labels:seq<#IConvertible> * ?TextPosition:TextPosition * ?TextFont:Font * ?StackGroup:string * ?Orientation:Orientation * ?GroupNorm:GroupNorm * ?UseWebGL:bool -> GenericChart + 1 overload static member Candlestick : open:seq<#IConvertible> * high:seq<#IConvertible> * low:seq<#IConvertible> * close:seq<#IConvertible> * x:seq<#IConvertible> * ?Increasing:Line * ?Decreasing:Line * ?WhiskerWidth:float * ?Line:Line * ?XCalendar:Calendar -> GenericChart + 1 overload static member Column : values:seq<#IConvertible> * ?Keys:seq<#IConvertible> * ?Name:string * ?ShowLegend:bool * ?Color:Color * ?Pattern:Pattern * ?PatternShape:PatternShape * ?MultiPatternShape:seq<PatternShape> * ?Base:#IConvertible * ?Width:'a3 * ?MultiWidth:seq<'a3> * ?Opacity:float * ?MultiOpacity:seq<float> * ?Text:'a4 * ?MultiText:seq<'a4> * ?TextPosition:TextPosition * ?MultiTextPosition:seq<TextPosition> * ?TextFont:Font * ?Marker:Marker -> GenericChart (requires 'a3 :> IConvertible and 'a4 :> IConvertible) + 1 overload static member Contour : data:seq<#seq<'a1>> * ?X:seq<#IConvertible> * ?Y:seq<#IConvertible> * ?Name:string * ?ShowLegend:bool * ?Opacity:float * ?Colorscale:Colorscale * ?Showscale:'a4 * ?zSmooth:SmoothAlg * ?ColorBar:'a5 -> GenericChart (requires 'a1 :> IConvertible) static member Funnel : x:seq<#IConvertible> * y:seq<#IConvertible> * ?Name:string * ?ShowLegend:bool * ?Opacity:float * ?Labels:seq<#IConvertible> * ?TextPosition:TextPosition * ?TextFont:Font * ?Color:Color * ?Line:Line * ?x0:'a3 * ?dX:float * ?y0:'a4 * ?dY:float * ?Width:float * ?Offset:float * ?Orientation:Orientation * ?Alignmentgroup:string * ?Offsetgroup:string * ?Cliponaxis:bool * ?Connector:FunnelConnector * ?Insidetextfont:Font * ?Outsidetextfont:Font -> GenericChart static member Heatmap : data:seq<#seq<'a1>> * ?ColNames:seq<#IConvertible> * ?RowNames:seq<#IConvertible> * ?Name:string * ?ShowLegend:bool * ?Opacity:float * ?Colorscale:Colorscale * ?Showscale:'a4 * ?Xgap:'a5 * ?Ygap:'a6 * ?zSmooth:SmoothAlg * ?ColorBar:'a7 * ?UseWebGL:bool -> GenericChart (requires 'a1 :> IConvertible) static member Histogram : data:seq<#IConvertible> * ?Orientation:Orientation * ?Name:string * ?ShowLegend:bool * ?Opacity:float * ?Color:Color * ?HistNorm:HistNorm * ?HistFunc:HistFunc * ?nBinsx:int * ?nBinsy:int * ?Xbins:Bins * ?Ybins:Bins * ?xError:'a1 * ?yError:'a2 -> GenericChart ...
static member Chart.PointGeo : locations:seq<string> option * ?Name:string * ?ShowLegend:bool * ?MarkerSymbol:StyleParam.MarkerSymbol * ?Color:Color * ?Opacity:float * ?Labels:seq<#System.IConvertible> * ?TextPosition:StyleParam.TextPosition * ?TextFont:Font * ?GeoJson:'a1 * ?FeatureIdKey:string * ?Connectgaps:bool * ?Fill:StyleParam.Fill * ?Fillcolor:Color -> GenericChart.GenericChart
static member Chart.PointGeo : lonlat:seq<#System.IConvertible * #System.IConvertible> * ?Name:string * ?ShowLegend:bool * ?MarkerSymbol:StyleParam.MarkerSymbol * ?Color:Color * ?Opacity:float * ?Labels:seq<#System.IConvertible> * ?TextPosition:StyleParam.TextPosition * ?TextFont:Font * ?GeoJson:'d * ?FeatureIdKey:string * ?Connectgaps:bool * ?Fill:StyleParam.Fill * ?Fillcolor:Color -> GenericChart.GenericChart
static member Chart.PointGeo : longitudes:seq<#System.IConvertible> * latitudes:seq<#System.IConvertible> * ?Name:string * ?ShowLegend:bool * ?MarkerSymbol:StyleParam.MarkerSymbol * ?Color:Color * ?Opacity:float * ?Labels:seq<#System.IConvertible> * ?TextPosition:StyleParam.TextPosition * ?TextFont:Font * ?GeoJson:'a3 * ?FeatureIdKey:string * ?Connectgaps:bool * ?Fill:StyleParam.Fill * ?Fillcolor:Color -> GenericChart.GenericChart
static member Chart.withMarginSize : ?Left:'a * ?Right:'b * ?Top:'c * ?Bottom:'d * ?Pad:'e * ?Autoexpand:'f -> (GenericChart.GenericChart -> GenericChart.GenericChart)
module GenericChart from Plotly.NET
<summary> Module to represent a GenericChart </summary>
val toChartHTML : gChart:GenericChart.GenericChart -> string
<summary> Converts a GenericChart to it HTML representation. The div layer has a default size of 600 if not specified otherwise. </summary>
namespace Plotly.NET.LayoutObjects
val myGeo : Geo
Multiple items
type Geo = inherit DynamicObj new : unit -> Geo static member init : ?FitBounds:GeoFitBounds * ?Resolution:GeoResolution * ?Scope:GeoScope * ?Projection:GeoProjection * ?Center:(float * float) * ?Visible:bool * ?Domain:Domain * ?ShowCoastLines:bool * ?CoastLineColor:Color * ?CoastLineWidth:float * ?ShowLand:bool * ?LandColor:Color * ?ShowOcean:bool * ?OceanColor:Color * ?ShowLakes:bool * ?LakeColor:Color * ?ShowRivers:bool * ?RiverColor:Color * ?RiverWidth:float * ?ShowCountries:bool * ?CountryColor:Color * ?CountryWidth:float * ?ShowSubunits:bool * ?SubunitColor:Color * ?SubunitWidth:float * ?ShowFrame:bool * ?FrameColor:Color * ?FrameWidth:float * ?BgColor:Color * ?LatAxis:LinearAxis * ?LonAxis:LinearAxis -> Geo static member style : ?FitBounds:GeoFitBounds * ?Resolution:GeoResolution * ?Scope:GeoScope * ?Projection:GeoProjection * ?Center:(float * float) * ?Visible:bool * ?Domain:Domain * ?ShowCoastLines:bool * ?CoastLineColor:Color * ?CoastLineWidth:float * ?ShowLand:bool * ?LandColor:Color * ?ShowOcean:bool * ?OceanColor:Color * ?ShowLakes:bool * ?LakeColor:Color * ?ShowRivers:bool * ?RiverColor:Color * ?RiverWidth:float * ?ShowCountries:bool * ?CountryColor:Color * ?CountryWidth:float * ?ShowSubunits:bool * ?SubunitColor:Color * ?SubunitWidth:float * ?ShowFrame:bool * ?FrameColor:Color * ?FrameWidth:float * ?BgColor:Color * ?LatAxis:LinearAxis * ?LonAxis:LinearAxis -> (Geo -> Geo)
<summary>Determines the style of the map shown in geo traces</summary>

--------------------
new : unit -> Geo
static member Geo.init : ?FitBounds:StyleParam.GeoFitBounds * ?Resolution:StyleParam.GeoResolution * ?Scope:StyleParam.GeoScope * ?Projection:GeoProjection * ?Center:(float * float) * ?Visible:bool * ?Domain:Domain * ?ShowCoastLines:bool * ?CoastLineColor:Color * ?CoastLineWidth:float * ?ShowLand:bool * ?LandColor:Color * ?ShowOcean:bool * ?OceanColor:Color * ?ShowLakes:bool * ?LakeColor:Color * ?ShowRivers:bool * ?RiverColor:Color * ?RiverWidth:float * ?ShowCountries:bool * ?CountryColor:Color * ?CountryWidth:float * ?ShowSubunits:bool * ?SubunitColor:Color * ?SubunitWidth:float * ?ShowFrame:bool * ?FrameColor:Color * ?FrameWidth:float * ?BgColor:Color * ?LatAxis:LinearAxis * ?LonAxis:LinearAxis -> Geo
module StyleParam from Plotly.NET
type GeoResolution = | R110 | R50 member Convert : unit -> obj override ToString : unit -> string static member convert : (GeoResolution -> obj) static member toString : (GeoResolution -> string)
<summary> Used for the Layout.geo field. Sets the resolution of the base layers. The values have units of km/mm e.g. 110 corresponds to a scale ratio of 1:110,000,000. </summary>
union case StyleParam.GeoResolution.R50: StyleParam.GeoResolution
Multiple items
module Color from Plotly.NET

--------------------
type Color = private new : obj:obj -> Color override Equals : other:obj -> bool override GetHashCode : unit -> int static member fromARGB : a:int -> r:int -> g:int -> b:int -> Color static member fromColorScaleValues : c:seq<#IConvertible> -> Color static member fromColors : c:seq<Color> -> Color static member fromHex : s:string -> Color static member fromKeyword : c:ColorKeyword -> Color static member fromRGB : r:int -> g:int -> b:int -> Color static member fromString : c:string -> Color ...
<summary> Plotly color can be a single color, a sequence of colors, or a sequence of numeric values referencing the color of the colorscale obj </summary>
static member Color.fromString : c:string -> Color
val moreFeaturesBaseMap : GenericChart.GenericChart
static member Chart.withGeo : map:Geo * ?Id:StyleParam.SubPlotId -> (GenericChart.GenericChart -> GenericChart.GenericChart)
val countryGeo : Geo
val countryBaseMap : GenericChart.GenericChart