I’m having a very specific problem with a plotly heatmap object inserted in a two tabbed flexdashboard rmarkdown. The MRE below, when rendered, displays an uncaught axis resizing javascript error. The error causes the datatable and heatmap to not render. However, if the heatmap is moved to the same tab both will render without a problem. The craziest part is that a hard refresh of the html document (ctrl+f5 in browser) with the second tab open causes the javascript error to disappear and everything renders just fine. I am having a very difficult time isolating this issue to the plotly R API, or the R package htmlwidgets. Any ideas?
---
title: "`r paste0('Test')`"
date: "`r Sys.Date()`"
output:
flexdashboard::flex_dashboard:
vertical_layout: scroll
orientation: rows
self_contained: false
---
```{r setup, include=FALSE}
library(flexdashboard)
library(reshape2)
library(dplyr)
library(ggplot2)
library(plotly)
```
Tab1
===================================================
Row
-----------------------------------------------------------------------
### A scatter
```{r fig1}
df = data.frame(x = 1:5, y = 1:5, z = 1:5)
plot_ly(df, x = ~x, y = ~y, type = "scatter")
```
Row
-----------------------------------------------------------------------
### A table
```{r table1}
DT::datatable(df,
filter="top",extensions = 'Buttons',
options = list(
dom = 'Bfrtip',
buttons = c('copy', 'csv', 'excel'),
pagelength=50,
autoWidth=T,
deferRender = T
)
)
```
Tab2
===================================================
Row
-----------------------------------------------------------------------
### A heatmap
```{r fig2}
plot_ly(df, x = ~x, y = ~y, z = ~z, type = "heatmap")
```