Text Not Appearing in Rmarkdown?
I created an html file called "widgets_t.html" (several plotly plots combined together). Using this tutorial (https://beta.rstudioconnect.com/jjallaire/htmlwidgets-showcase-storyboard/htmlwidgets-showcase-storyboard.html) as a demo as well as the answer provided here (How to create a dropdown menu in flexdashboard?), I tried to create a Rmarkdown/Flexdashboard document. Here is the code that I am using (for this example, I just used the same html input and the same text for brevity purposes ):
---
title: "maps"
output:
flexdashboard::flex_dashboard:
storyboard: true
social: menu
source: embed
---
```{r setup, include=FALSE}
library(flexdashboard)
```
```{css}
.storyboard-nav .sbframelist ul li {
height: auto;
}
```
Page 1
=====================================
Column {.tabset}
-------------------------------------
### Title 1
<object type="text/html" width="1500" height="1500" data="widgets_t.html"></object>
https://rstudio.github.io/leaflet/
- Interactive panning/zooming
- Compose maps using arbitrary combinations of map tiles, markers, polygons, lines, popups, and GeoJSON.
- Create maps right from the R console or RStudio
- Embed maps in knitr/R Markdown documents and Shiny apps
- Easily render Spatial objects from the sp package, or data frames with latitude/longitude columns
- Use map bounds and mouse events to drive Shiny logic
### Title 2 {.tabset .tabset-dropdown}
<object type="text/html" width="1500" height="1500" data="widgets_t.html"></object>
https://rstudio.github.io/leaflet/
- Interactive panning/zooming
- Compose maps using arbitrary combinations of map tiles, markers, polygons, lines, popups, and GeoJSON.
- Create maps right from the R console or RStudio
- Embed maps in knitr/R Markdown documents and Shiny apps
- Easily render Spatial objects from the sp package, or data frames with latitude/longitude columns
- Use map bounds and mouse events to drive Shiny logic
Page 2
=====================================
<object type="text/html" width="1500" height="1500" data="widgets_t.html"></object>
- Interactive panning/zooming
- Compose maps using arbitrary combinations of map tiles, markers, polygons, lines, popups, and GeoJSON.
- Create maps right from the R console or RStudio
- Embed maps in knitr/R Markdown documents and Shiny apps
- Easily render Spatial objects from the sp package, or data frames with latitude/longitude columns
- Use map bounds and mouse events to drive Shiny logic
Page 3
=====================================
<object type="text/html" width="1500" height="1500" data="widgets_t.html"></object>
- Interactive panning/zooming
- Compose maps using arbitrary combinations of map tiles, markers, polygons, lines, popups, and GeoJSON.
- Create maps right from the R console or RStudio
- Embed maps in knitr/R Markdown documents and Shiny apps
- Easily render Spatial objects from the sp package, or data frames with latitude/longitude columns
- Use map bounds and mouse events to drive Shiny logic
The above code runs successfully and renders an output in the format I was expecting, but the text (e.g. "Compose maps using arbitrary combinations of map tiles, markers, polygons, lines, popups, and GeoJSON." ) is not appearing.
- Does anyone know how I can fix this problem?
Thank you!
PS: Here is an example of "widgets_t.html":
library(plotly)
libtary(htmltools)
library(htmlwidgets)
fig <- plot_ly(data = iris, x = ~Sepal.Length, y = ~Petal.Length)
doc <- htmltools::tagList(
div(fig, style = "float:left;width:50%;")
)
htmltools::save_html(html = doc, file = "widgets_t.html")
I'm not sure that I entirely understand what you're looking for. You mentioned a tutorial, but the link brings me to a dashboard, not a tutorial. That being said, I'm going to provide my answer and explanation. You'll just have to let me know if this is what you were looking for.
Alright, I'm guessing it is just a typo in your question (I've got plenty of those!) However, the call for the library htmltools, library is spelled wrong. I would hate for that to be the source of your problems. Although, you indicated it was rendering the graph, so I'm guessing that's not the problem.
I think you want to render this with tab sets, instead of a storyboard.
To simplify things for the sake of this answer, I didn't create an external HTML file. Instead of the height and width you currently have, you're going to use percentages. This will maximize the use of space within the parent div.
So instead of your current setup for <object>, you can use this.
<object type="text/html" data="widgets_t.html" style="width:100%; height:100%;" />
I'm not sure why you chose to go with embedding HTML instead of rendering it directly. If there is a problem, that's a likely source of contention. For example, widgets have a default of 100% width and 400px height...Yuck! When you render them inline, they just seem to 'listen' better. (Just my opinion!)
I added styling you don't need, in addition to styling you do need. Things like border, padding, background color, and line height can all be dropped without any consequences to the organization. I just thought it improved the appearance.
You should also notice that I gave 70% of the width to the plot and 30% to the text column. You can definitely adjust these values, but they should total 100% between the two.
<style>
.pics {
float:left;
width:70%;
height:90vh;
}
.words {
float:right;
width:30%;
height:90vh;
padding: 10px;
border-style: outset;
border-width: 1px;
background-color: #fdfdfd;
line-height: 2em; /* this is double-spacing lines of text the html way */
}
</style>
Before each set of object tags, you'll include <div><div class="pics">. For example, the first one will look like this:
Page 1
=====================================
Column {.tabset}
-------------------------------------
### Title 1
<div>
<div class="pics">
Between your object calls and the bullets, you'll use </div><div class="words">. The first placement looks like this:
</div>
<div class="words">
https://rstudio.github.io/leaflet/
- Interactive panning/zooming
- Compose maps using arbitrary combinations of map tiles, markers, polygons, lines, popups, and GeoJSON.
- Create maps right from the R console or RStudio
After the bullet points, you have to close out the div tags. That's going to look like this.
- Embed maps in knitr/R Markdown documents and Shiny apps
- Easily render Spatial objects from the sp package, or data frames with latitude/longitude columns
- Use map bounds and mouse events to drive Shiny logic
</div></div>
