Problems embedding a leaflet map in a xaringan slide

Question

I am trying to include a leaflet map in a xaringan presentation. There are several examples of this online, including in this presentation.

When my colleague tests the minimal example below they get an interactive map on slide 2, as expected. But when I run this I don't see the map but just see a slider box with html code.

This works on my colleague's machine:

---
title: "Testing leaflet"
output:
  xaringan::moon_reader:
    lib_dir: libs
    nature:
      highlightStyle: github
      highlightLines: true
      countIncrementalSlides: false
---

```{r setup, include=FALSE}
knitr::opts_chunk$set(message = FALSE, warning = FALSE)
```

```{r out.width='100%', fig.height=6}
library(leaflet)
library(dplyr)
leaflet() %>% addTiles() %>% setView(lat = 30.2621, lng = -97.7382, zoom = 17)
```

Here is a screenshot of what I see on my xaringan slide:

Here is a screenshot of what I see on my xaringan slide

And this is the actual html code that appears in the box on the slide:

<div id="htmlwidget-627abe20cf1eb0297594" style="width:100%;height:432px;" class="leaflet html-widget"></div>
<script type="application/json" data-for="htmlwidget-627abe20cf1eb0297594">{"x":{"options":{"crs":{"crsClass":"L.CRS.EPSG3857","code":null,"proj4def":null,"projectedBounds":null,"options":{}}},"calls":[{"method":"addTiles","args":["//{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",null,null,{"minZoom":0,"maxZoom":18,"tileSize":256,"subdomains":"abc","errorTileUrl":"","tms":false,"noWrap":false,"zoomOffset":0,"zoomReverse":false,"opacity":1,"zIndex":1,"detectRetina":false,"attribution":"&copy; <a href=\"http://openstreetmap.org\">OpenStreetMap<\/a> contributors, <a href=\"http://creativecommons.org/licenses/by-sa/2.0/\">CC-BY-SA<\/a>"}]}],"setView":[[30.2621,-97.7382],17,[]]},"evals":[],"jsHooks":[]}</script>

Because this works on someone else's machine I assume the issue must be something to do with my set up. I've tried restarting RStudio and reinstalling xaringan, but after that I am out of ideas for what to check. Any suggestions would be greatly appreciated!

Here is my session info, in case that might help diagnose the issue:

> sessionInfo()
R version 4.0.3 (2020-10-10)
Platform: x86_64-apple-darwin17.0 (64-bit)
Running under: macOS Catalina 10.15.7

Matrix products: default
BLAS:   /System/Library/Frameworks/Accelerate.framework/Versions/A/Frameworks/vecLib.framework/Versions/A/libBLAS.dylib
LAPACK: /Library/Frameworks/R.framework/Versions/4.0/Resources/lib/libRlapack.dylib

locale:
[1] en_AU.UTF-8/en_AU.UTF-8/en_AU.UTF-8/C/en_AU.UTF-8/en_AU.UTF-8

attached base packages:
[1] stats     graphics  grDevices utils     datasets  methods   base     

loaded via a namespace (and not attached):
 [1] compiler_4.0.3    rsconnect_0.8.16  htmltools_0.5.1.1 tools_4.0.3       xaringan_0.19     yaml_2.2.1       
 [7] rmarkdown_2.6     knitr_1.30        xfun_0.20         digest_0.6.27     rlang_0.4.10      evaluate_0.14

I see the same thing as you, and I can't spot the cause. I suspect it's a bug introduced in some package update: I'd compare package versions between your system and your colleagues to see what is different, and try installing old versions (using `remotes::install_version()` ) to see if you can locate which package causes the issue. (It might be best to run `sessionInfo()` in the document itself, in case it is picking up different packages.) — user2554330, Mar 02 '21 at 11:10
Thank you for this suggestion @user2554330! You were right: my colleague had `rmarkdown_2.5` whereas I had `rmarkdown_2.6`. Installing v2.5 fixed the problem! — mark, Mar 03 '21 at 02:08

score 1 · Answer 1 · answered Mar 03 '21 at 14:18

This is an incompatibility between a recent change to rmarkdown and xaringan. The current Github version of xaringan, available as

remotes::install_github("yihui/xaringan")

fixes it: the discussion is here: https://github.com/yihui/xaringan/issues/293 . It includes a workaround if you don't want to install the unreleased xaringan.

Problems embedding a leaflet map in a xaringan slide

1 Answers1