widgetframe in Xaringan

class: center, middle, inverse, title-slide

# <code>widgetframe</code> in Xaringan
### Bhaskar Karambelkar
### 2017/01/13

---

# `widgfetframe` in Xaringan

This is just a small demo of using `widgetframe` package to wrap `htmlwidgets` inside a `xaringan` presentation in responsive iframes.

---

# Leaflet

```r
library(leaflet)
suppressPackageStartupMessages(library(widgetframe))
l <- leaflet() %>% addTiles() %>% setView(0,0,2)
frameWidget(l, height = '300')
```

<div id="htmlwidget-d2cb7bc7a61253a8b30d" style="width:100%;height:300px;" class="widgetframe html-widget"></div>
<script type="application/json" data-for="htmlwidget-d2cb7bc7a61253a8b30d">{"x":{"url":"widgetframe_files/figure-html//widgets/widget_leaflet-01.html","options":{"xdomain":"*","allowfullscreen":false,"lazyload":false}},"evals":[],"jsHooks":[]}</script>

---

# Dygraph

```r
library(dygraphs)
ts <- dygraph(nhtemp, main = "New Haven Temperatures")
frameWidget(ts, height = 300, width = '95%')
```

<div id="htmlwidget-97b4fbef21497017cb46" style="width:95%;height:300px;" class="widgetframe html-widget"></div>
<script type="application/json" data-for="htmlwidget-97b4fbef21497017cb46">{"x":{"url":"widgetframe_files/figure-html//widgets/widget_dygraph-01.html","options":{"xdomain":"*","allowfullscreen":false,"lazyload":false}},"evals":[],"jsHooks":[]}</script>

---

# DT

```r
library(DT)
dt <-  datatable(
  head(iris, 20), 
  options = list(
     columnDefs = list(list(className = 'dt-center', targets = 5)),
     pageLength = 5, lengthMenu = c(5, 10, 15, 20)),
  fillContainer = T)

frameWidget(dt, height = 350, width = '95%')
```

<div id="htmlwidget-09555340ce1fa9c387c7" style="width:95%;height:350px;" class="widgetframe html-widget"></div>
<script type="application/json" data-for="htmlwidget-09555340ce1fa9c387c7">{"x":{"url":"widgetframe_files/figure-html//widgets/widget_dt-01.html","options":{"xdomain":"*","allowfullscreen":false,"lazyload":false}},"evals":[],"jsHooks":[]}</script>