Legend doesn't load correctly in static RMarkdown document - html

I am trying to create a static html document with RMarkdown that contains a bunch of tables and graphs. A problem I am running into right now is that the legend doesn't load correctly unless it is on the landing page. I render my graphs using the billboarder package. I added an example:
Here's a reproducible example:
---
title: "Untitled"
output:
flexdashboard::flex_dashboard:
orientation: columns
vertical_layout: fill
---
```{r setup, include=FALSE}
library(flexdashboard)
library(billboarder)
library(data.table)
```
Column {.tabset}
-----------------------------------------------------------------------
### Dummy tab
### Chart A
```{r}
billboarder() %>%
bb_linechart(melt(data.table(rock, keep.rownames = TRUE)[, area := as.numeric(area)], id.vars = "rn", measure.vars = c("area", "peri")), bbaes(rn, value, variable))
```

Related

Rmarkdown 'saving' an exact place of the html page

I've created two Rmarkdown pages that are linked together. I'd like to know if there is a way to code that the links direct to a specific spot on each page.
---
title: "Page 1"
author: "--"
date: "22 9 2020"
output: html_document
---
```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = TRUE)
```
### Header
example text.
#### example plot 1.
```{r cars}
plot(cars)
```
more example text
#### example plot 2.
```{r pressure, echo=FALSE}
plot(pressure)
```
link to [Page 2](./Page-2.html)
And Page 2:
---
title: "Page 2"
author: "--"
date: "22 9 2020"
output: html_document
---
```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = TRUE)
```
### Header
example text.
#### example plot 1.
```{r cars}
plot(cars)
```
more example text
#### example plot 2.
```{r pressure, echo=FALSE}
plot(pressure)
```
[Page 1](./Page-1.html)
For example, I'd like the page 2 link to redirect straight to the second graph. Moreso, when clicking back to page 1 - is there a way for it to save the spot I was currently looking at?
Thanks.
This feature is not provided for HTML output of rmarkdown/knitr. However, you can easily implement this using javaScript (jquery):
The idea is to include a small script that saves the last scroll position in a variable (I've called it ScrPos below) in local memory and restores the scroll position when the page is (re)loaded.
header.html
<script type="text/javascript">
// check if ScrPos is available. If so, scroll to ScrPos
$(function() {
if (localStorage.ScrPos) {
$(window).scrollTop(localStorage.ScrPos);
}
});
// save last scroll position to ScrPos before page unload
$(window).on("beforeunload", function() {
var ScrPos = $(window).scrollTop();
localStorage.setItem("ScrPos", ScrPos);
});
</script>
You may include header.html in the YAML header (of both) .rmd files like this:
output:
html_document:
include:
in_header: header.html
Note that header.html needs to be in the same directory as the .Rmd.
for the linking to the second graph part it can be easily achieved by using the div id that's used for the second graph, either by explicitly assigning it or by using transforming the spaced section title to a dash separated one `example plot 2.` => id = `example-plot-2.` i.e:
New code for page 2
#### example plot 2.{#second_graph}
```{r pressure, echo=FALSE}
plot(pressure)
```
[Page 1](./Page-1.html)
and then in page one simply add the id to the link i.e:
link to [pressure graph](./Page-2.html#second_graph)

Displaying html file using htmltools::tags$iframe in shiny is not working with renderUI()

This is my first question in StackOverflow. Please forgive me if the question is not represented in the proper format.
I have a saved html widget, generated using flowmapblue.R that I want to display in a Markdown Shiny Document.
I am using htmltools::tags$iframe to include the HTML file in the Shiny app. The file is kept under the www directory. For your kind reference, I am sharing the HTML file in the following LINK.
The code that is working and giving desired result is:
---
title: "Flow Map"
author: "xyz"
date: "8/14/2020"
output: html_document
runtime: shiny
---
```{r flowmap, echo=FALSE, message=FALSE, warning=FALSE}
titlePanel("Mobility Flow Map")
mainPanel (htmltools::tags$iframe(src ="June_Spain.html", seamless="seamless", height=600, width="100%"))
```
I am getting this result Result without using renderUI.
But actually my Markdown Shiny document will be responsive where the user can select zones and desired months. Based on those names the relevant HTML file will be selected. That's why I need to use the next following code snippet:
---
title: "Flow Map"
author: "xyz"
date: "8/14/2020"
output: html_document
runtime: shiny
---
```{r flowmap, echo=FALSE, message=FALSE, warning=FALSE}
titlePanel("Mobility Flow Map")
mainPanel(
htmlOutput("display_map")
)
output$display_map <- renderUI({
my_test <- htmltools::tags$iframe(src="June_Spain.html", seamless="seamless", height=600, width="100%")
my_test
})
```
In this case the HTML File is not Found as shown in Result using renderUI.
I checked few similar problems with renderUI() and htmlOutput() but I couldn't make out where it is going wrong. I desperately need your help in this regard. Thanks in advance.
Strange. As a workaround you can encode the HTML to a base64 string:
b64 <- base64enc::dataURI(file = "www/June_Spain.html", mime = "text/html")
output$display_map <- renderUI({
htmltools::tags$iframe(src=b64, height=600, width="100%")
})

Links in RMarkdown Datatable

I'm trying to create active links in an RMarkdown document. In the code below, the basic kable table is perfect, but the datatable version turns the links into text
---
title: "Example"
output: html_document
---
```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = TRUE)
library(knitr)
library(DT)
example.df <- data.frame("link"=c("[Tokyo](https://en.wikipedia.org/wiki/Tokyo)","[Paris](https://en.wikipedia.org/wiki/Paris)"), "country"=c("Japan","France"))
kable(example.df)
datatable(example.df)
Whoops, here's the answer: format the links as raw HTML not as RMarkdown syntax http://blogs.oregonstate.edu/cgrb/2019/08/06/r-tips-a-table-makeover-with-dt/
There are 2 changes needed to it to work with datatable.
Format the links as raw HTML, not Markdown
Include relevant escape arguments as to NOT escape the link column. For simplicity in this example, we use escape=FALSE
Here is a full reprex answer.
---
title: "Example"
output: html_document
---
```{r setup, include=TRUE}
knitr::opts_chunk$set(echo = TRUE)
library(knitr)
library(DT)
example.df.kable <- data.frame("link"=c("[Tokyo](https://en.wikipedia.org/wiki/Tokyo)","[Paris](https://en.wikipedia.org/wiki/Paris)"), "country"=c("Japan","France"))
example.df.datatable <- data.frame("link"=c(
'Tokyo',
'Paris'),
"country"=c("Japan","France"))
kable(example.df.kable)
datatable(example.df.kable) # This does NOT show the links
datatable(example.df.datatable) # This does NOT show the links
datatable(example.df.datatable, escape=FALSE) # This does show the links

Icons do not show up at all in R flexdashboard

Im creating a flexdashboard which displays a table. In the last column icons are included but they are not displayed at all because of flexdashboard. That works normally in shinydashboard. Any workaround?
---
title: "Single Column (Fill)"
output:
flexdashboard::flex_dashboard:
vertical_layout: fill
---
```{r global, include=FALSE}
library(shiny)
library(shinydashboard)
FCB<-c(5,6,4,6,8)
TWI<-c(3,5,2,3,5)
IN<-c(2,1,1,1,1)
DF1<-data.frame(FCB,TWI,IN)
FCB<-c(0,0,1,2,4)
TWI<-c(1,2,3,4,5)
IN<-c(1,3,4,5,6)
DF2<-data.frame(FCB,TWI,IN)
DF1$direction <- ifelse(
DF1$FCB < DF2$FCB,
as.character(icon("angle-up")),
as.character(icon("angle-down"))
)
```
### Chart 1
```{r}
renderTable(DF1, sanitize.text.function = function(x) x)
```
You are using Shiny content rendered to a static file.
I added runtime: shiny to the YAML header.
If you just need arrows would using simpe UTF-8 arrows like these be okay?
If you want to render HTML in a table in flexdashboard you should use a datatable from the DT package. Note that the rendering of the HTML is escaped by default. To render the HTML in your table you have to set escape = FALSE.
Here is an option:
---
title: "Single Column (Fill)"
output:
flexdashboard::flex_dashboard:
vertical_layout: fill
runtime: shiny
---
```{r global, include=FALSE}
library(DT)
library(shiny)
library(shinydashboard)
FCB<-c(5,6,4,6,8)
TWI<-c(3,5,2,3,5)
IN<-c(2,1,1,1,1)
DF1<-data.frame(FCB,TWI,IN)
FCB<-c(0,0,1,2,4)
TWI<-c(1,2,3,4,5)
IN<-c(1,3,4,5,6)
DF2<-data.frame(FCB,TWI,IN)
DF1$direction <- ifelse(
DF1$FCB < DF2$FCB,
"<p>↑</p>",
"<p>↓</p>"
)
DF1.table <- datatable(DF1, escape = FALSE)
```
### Chart 1
```{r}
DT::renderDataTable(DF1.table)
```

Can you assign id to tabs in r shiny flexdashboard?

I'm wondering if you can assign id to tabs (and other elements more generally) in r flexdashboard.
I'd like to do this so I can create conditional panels based on which tab is clicked.
I have a very limited knowledge of html.
below is an example code.
---
title: "Example"
output:
flexdashboard::flex_dashboard:
theme: simplex
orientation: rows
vertical_layout: fill
social: menu
source_code: embed
runtime: shiny
---
```{r setup, include=FALSE}
options(xtable.include.rownames=F)
library(flexdashboard)
```
Column
-------------------------------------
### Chart 1
```{r}
```
Column {.tabset}
-------------------------------------
### Chart 2
```{r}
```
### Chart 3
```{r}
```
For me, it works like this:
You attribute a 'name' to your column, for example:
Column 1 or Column mycolumn
You refer this column somewhere else in the flexdashboard, with:
[This is a column](#column-1) or
[Show me the column](#column-mycolumn)
Then, by clicking on whatever is inside the "[ ]", you'll be redirected to whats referenced in the "( )".