Repository navigation
[Question] Custom maps / geojson (Choropleth maps) #86
Description
Activity
Hi @luisquintanilla , thanks for the question, it sent me down quite some rabbit hole 😄
It took me quite a while, mainly due to not knowing what geojson exactly is, but i made the python example you linked work in F#. As always with un-wrapped features, you currently have to access some low level properties though.
The following things are needed:
-
A key in the geojson features that can be used as lookup. In the example data, that key is simply "id"
-
a data array, containing pairs of those keys and the z data that will be the color on the plot. In the example it is this table:
with the keys being the fips codes, and the data the "unemp" column.
Here is a snippet.
locationsare the fips codeszcontains the unemp data- geojson is the geojson object
- it is now important to set the following properties on the choropleth trace:
locationmodeto"geojson-id"to trigger the lookup instead of just usinglocationsas data sourcefeatureidkeyto set the feature that is used as lookup
#r "nuget: FSharp.Data" #r "nuget: Deedle" #r "nuget: Newtonsoft.Json" #r "nuget: Plotly.NET, 2.0.0-preview.3" open Plotly.NET open GenericChart open FSharp.Data open Newtonsoft.Json open System.Text open System.IO open Deedle let geoJson = Http.RequestString "https://raw.githubusercontent.com/plotly/datasets/master/geojson-counties-fips.json" |> JsonConvert.DeserializeObject let data = let dataString = Http.RequestString "https://raw.githubusercontent.com/plotly/datasets/master/fips-unemp-16.csv" let byteArray = Encoding.UTF8.GetBytes(dataString) use stream = new MemoryStream(byteArray) Frame.ReadCsv(stream,true,separators=",",schema="fips=string,unemp=float") let locations: string [] = data |> Frame.getCol "fips" |> Series.values |> Array.ofSeq let z: int [] = data |> Frame.getCol "unemp" |> Series.values |> Array.ofSeq Trace.initChoroplethMap(id) |> fun t -> t?z <- z t?locations <- locations t?geojson <- geoJson t?featureidkey <- "id" t?locationmode <- "geojson-id" t |> GenericChart.ofTraceObject |> Chart.withMap( Geo.init( Scope=StyleParam.GeoScope.Usa ) ) |> Chart.Show
To add this to Plotly.NET, basically only the featureidkey, locationmode and geojson options are missing, so this can be implemented very easily. I will add it in the next prerelease.
Reacted by Luis Quintanilla and Caroline Ott-
Wow! Thanks @kMutagene. I was expecting a yes / no answer but you went above and beyond! Thanks so much! 😃
Reacted by Kevin Schneider- added a commit that references this issue
on Jun 22, 2021 @luisquintanilla glad you liked it! It was a possibility to learn something new for me, so it was cool going down that rabbit hole. I released a new preview package that contains the relevant changes to use this with the high level abstractions contained in
Chart.Choropleth. The respective docs are here: https://plotly.net/5_0_choropleth-map.html#Using-GeoJSONReacted by Luis Quintanilla
Is there a way to provide or use custom geojson with Plotly.NET?
https://plotly.com/python/choropleth-maps/#choropleth-map-using-geojson
I'm looking to focus on a specific US city / state as opposed to using the USA_States or CountryNames built in LocationFormat