Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Replicating leafletjs interactive choropleth map example using leaflet package in R #55

hmaeda opened this issue Apr 14, 2015 · 8 comments


Copy link

@hmaeda hmaeda commented Apr 14, 2015

This is a cross post from SO

I would like to be able to replicate the Interactive Chroropleth Map example from leafletjs using R's leaflet package, which has an intro here

However, I seem to be struggling even at the first few hurdles...

Below is what I have done so far:

# Download js file
# Generate base map (but not sure how to add the js file data)...
m = leaflet() %>% addTiles() %>% setView(-96,37.8,zoom=4)

If possible, I think that this would be quite a good example to come with the package....

Copy link

@jcheng5 jcheng5 commented Apr 14, 2015

You need to edit the .js file, it's not JSON; specifically, you need to remove the "var statesData = " at the beginning, and then ";" at the end. Save that as "us-states.json" and then take a look at this:

The interactive hover-over is not possible to do with GeoJSON right now, but it will soon be possible if you use Shiny with leaflet. (As a proof of concept you can see how I previously implemented this example with the legacy jcheng5/leaflet-shiny package, here.)

An alternative is to transform the GeoJSON into sp's SpatialPolygonDataFrame, then you can use addPolygons() which has a popup argument that will at least let you show "State: Density" info when a state is clicked. I made an example of this but ran into a lot of hassle because us-states.json puts Alaska's Attu Island at less than -180 degrees, which rgdal doesn't like. If you go into the GeoJSON and add 360 degrees to all of those by hand (or just remove the Attu islands), you end up with something like this:

Unfortunately the Attu islands appear at the far-right of the map, and my sp-fu is not strong enough to move them back to -188 degrees or whatever.

Copy link

@hmaeda hmaeda commented Apr 15, 2015

Thank you for detailed response. I seem to having some issues with the adjustment of the .js file to a .json file, as when I read the file it seems to get different results from you, as shown below:

> us.states <- readOGR("us-states.json", "OGRGeoJSON")
OGR data source with driver: GeoJSON 
Source: "us-states.json", layer: "OGRGeoJSON"
with 1 features
It has 2 fields

Furthermore, eventually I would like to use topojson files that have been converted from .shp files as suggested here...The example uses rMaps, but I would prefer to use rstudio's leaflet package as it has greater flexibility...Do you have any suggestions on how to read it in so that leaflet can read the (potentially manipulated) topojson file... there any way to integrate the functions from your legacy jcheng5/leaflet-shiny package to get the final hover?

Copy link

@jcheng5 jcheng5 commented Apr 16, 2015

You don't need topojson, you can just read the shp file into R and manipulate it as a SpatialPolygonsDataFrame or whatever--leaflet can handle those directly.

I'll be working on bringing back the legacy interactivity next week.

Copy link

@hmaeda hmaeda commented Apr 16, 2015

Thank you for letting me know that you are going to be bringing in the legacy interactivity next week. It will make the leaflet packing pretty cool once in I think!

The reason for the topojson file is that it helps reduce the size of the files, as the .shp files can be in the region of several hundred MB, but topojson files help reduce the file size to something more manageable for web plotting.

Copy link

@smartinsightsfromdata smartinsightsfromdata commented Apr 19, 2015

@jcheng5 👍 for adding the legacy interactivity (hover-over and mouse-click? ability to display pop-up boxes?) on custom geojson-based maps; i.e. outside of US :)

While it is possible to reduce the size of a geojson shape to 10% of original size using simplify geometry in QGIS or equivalent in other tools, topojson goes one step further in reduction and it would be a nice to have.

Copy link

@jcheng5 jcheng5 commented Apr 20, 2015

OK. FYI, topojson or not, if you have several hundred MB shapefiles I think you'll want to do simplification regardless--the transmission size will be smaller with topojson but you may still overwhelm the browser with so much shape data, and topojson won't help with that (since once in the browser it's basically just converted to the same objects as the geojson).

(That said, I've never actually done shapefile simplification in R. Can anyone with experience tell me how well it works, or do you have to use tools like QGIS?)

Copy link

@smartinsightsfromdata smartinsightsfromdata commented Apr 20, 2015

@jcheng5 The code below gives what you want in R.
Playing with the tolerance will give you different degree of simplification. The tolerance 0.00001 gives values comparable to a standard simplification in QGIS, around 10% of original size.

The result should be broadly equivalent to QGIS as the underlying method should use the same Ramer–Douglas–Peucker algorithm.


fooGd <- readOGR(dsn="foo.geojson", layer="OGRGeoJSON",  stringsAsFactors=FALSE)

# gSimplify strips the data portion away - it needs to be saved and re-attached
df <- fooGd@data

fooSimp <- gSimplify(fooGd, 0.00001, topologyPreserve=TRUE)
spDf <- SpatialPolygonsDataFrame(fooSimp,data=df) 
writeOGR(spDf,'fooSimp.geojson','spDf', driver='GeoJSON',check_exists = FALSE)

A small note on topojson: geojson and topojson are different: the creation of a topojson file (using topojson from npm) reduces further the file, simply (but brilliantly) recognising that two contiguous polygons will have a side in common, hence the side only needs to be coded once.

Copy link

@jcheng5 jcheng5 commented Jun 19, 2015

TopoJSON now supported directly:

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
None yet
None yet

No branches or pull requests

3 participants