Update plot from interactive table in html - css

What I would like to be able to do is to update the plot based on the output from the (DT-)table after filtering in the html.
For example - here is a screenshot of the table filtered for maz in the html:
I would like the scatter plot to update to only show the values shown in the filtered table.
Is this possible? I know I could achieve something like this using a shiny web app, but is it possible to embed some shiny code into the html to achieve this? (I have very limited experience using shiny/html so would be grateful for any pointers/ideas).
I am using R-markdown (and here is a link to the html produced):
---
title: "Filter interative plots from table results"
date: "`r format(Sys.time(), '%B %e, %Y')`"
output:
html_notebook:
theme: flatly
toc: yes
toc_float: yes
number_sections: true
df_print: paged
html_document:
theme: flatly
toc: yes
toc_float: yes
number_sections: true
df_print: paged
---
```{r setup, include=FALSE, cache=TRUE}
library(DT)
library(plotly)
library(stringr)
data(mtcars)
```
# Clean data
## Car names and models are now a string: "brand_model" in column 'car'
```{r include=FALSE}
mtcars$car <- rownames(mtcars)
mtcars$car <- stringr::str_replace(mtcars$car, ' ', '_')
rownames(mtcars) <- NULL
```
# Interactive table using DT
```{r rows.print=10}
DT::datatable(mtcars,
filter = list(position = "top"),
selection="none", #turn off row selection
options = list(columnDefs = list(list(visible=FALSE, targets=2)),
searchHighlight=TRUE,
pagingType= "simple",
pageLength = 10, #default length of the above options
server = TRUE, #enable server side processing for better performance
processing = FALSE)) %>%
formatStyle(columns = 'qsec',
background = styleColorBar(range(mtcars$qsec), 'lightblue'),
backgroundSize = '98% 88%',
backgroundRepeat = 'no-repeat',
backgroundPosition = 'center')
```
# Plot disp against mpg using plotly
```{r fig.width=8, fig.height=8}
p <- plot_ly(data = mtcars,
x = ~disp,
y = ~mpg,
type = 'scatter',
mode = 'markers',
text = ~paste("Car: ", car, "\n",
"Mpg: ", mpg, "\n"),
color = ~mpg,
colors = "Spectral",
size = ~-disp
)
p
```

Contrary to my first assessment, it is actually possible. There are multiple additions to your code. I will go through them chronologically:
You need to add runtime: shiny in the yaml-header to start shiny in any R-markdown file
Optional: I added some css style in case you need to adjust your shiny application to fit into certain screen sizes
Shiny-documents contain an UI-part, where you configure the user interface. Usually you just use a fluidPage function for that
The next part is the server.r-part where the interesting stuff happens:
We assign, i.e., your DT::datatable to an output-object (usually a list)
For each assignment we need to set a shinyID which we configure in ui.r and then add, i.e, output$mytable
I added an element which shows which rows are selected for debugging
The heart of all the changes is input$mytable_rows_all. All the controls we set up in the ui.r can be called inside the render-functions. In this particular case mytable refers to the shinyID I set for the DT::datatable in the UI-part and rows_all tells shiny to take all the rownumbers inside the shown table.
That way we just subset the data using mtcars[input$mytable_rows_all,]
To learn shiny I recommend Rstudio's tutorial. After learning and forgetting everything again I advise you to use the wonderful cheatsheet provided by Rstudio
The whole modified code looks like this:
---
title: "Filter interative plots from table results"
date: "`r format(Sys.time(), '%B %e, %Y')`"
runtime: shiny
output:
html_document:
theme: flatly
toc: yes
toc_float: yes
number_sections: true
df_print: paged
html_notebook:
theme: flatly
toc: yes
toc_float: yes
number_sections: true
df_print: paged
---
<style>
body .main-container {
max-width: 1600px !important;
margin-left: auto;
margin-right: auto;
}
</style>
```{r setup, include=FALSE, cache=TRUE}
library(stringr)
data(mtcars)
```
# Clean data
## Car names and models are now a string: "brand_model" in column 'car'
```{r include=FALSE}
mtcars$car <- rownames(mtcars)
mtcars$car <- stringr::str_replace(mtcars$car, ' ', '_')
rownames(mtcars) <- NULL
```
# Plot disp against mpg using plotly
```{r}
library(plotly)
library(DT)
## ui.r
motor_attributes=c('Cylinder( shape): V4','Cylinder( shape): V6','Cylinder( shape): V8','Cylinder( shape): 4,Straight Line','Cylinder( shape): 6,Straight Line','Cylinder( shape): 8,Straight Line','Transmission: manual','Transmission: automatic')
fluidPage(# selectizeInput('cyl','Motor characteristics:',motor_attributes,multiple=TRUE,width='600px'),
downloadLink('downloadData', 'Download'),
DT::dataTableOutput('mytable'),
plotlyOutput("myscatter"),
htmlOutput('Selected_ids'))
### server.r
output$mytable<-DT::renderDataTable({
DT::datatable(mtcars,
filter = list(position = "top"),
selection='none', #list(target='row',selected=1:nrow(mtcars)), #turn off row selection
options = list(columnDefs = list(list(visible=FALSE, targets=2)),
searchHighlight=TRUE,
pagingType= "simple",
pageLength = 10, #default length of the above options
server = TRUE, #enable server side processing for better performance
processing = FALSE)) %>%
formatStyle(columns = 'qsec',
background = styleColorBar(range(mtcars$qsec), 'lightblue'),
backgroundSize = '98% 88%',
backgroundRepeat = 'no-repeat',
backgroundPosition = 'center')
})
output$Selected_ids<-renderText({
if(length(input$mytable_rows_all)<1){
return()
}
selected_rows<-as.numeric(input$mytable_rows_all)
paste('<b> #Cars Selected: </b>',length(selected_rows),'</br> <b> Cars Selected: </b>',
paste(paste('<li>',rownames(mtcars)[selected_rows],'</li>'),collapse = ' '))
})
output$myscatter<-renderPlotly({
selected_rows<-as.numeric(input$mytable_rows_all)
subdata<-mtcars[selected_rows,]
p <- plot_ly(data = subdata,
x = ~disp,
y = ~mpg,
type = 'scatter',
mode = 'markers',
text = ~paste("Car: ", car, "\n",
"Mpg: ", mpg, "\n"),
color = ~mpg,
colors = "Spectral",
size = ~-disp
)
p
})
```

Related

Citing inside the cell of flextable

I'm trying to create a table with rmarkdown and flextable where I am citing various works.
my Rmakrdown file:
---
title: "Innovative title"
author: "Vag Vaf"
date: '2021-12-29'
bibliography: references.bib
csl: apa-6th-edition.csl
output:
bookdown::word_document2:
fig_caption: yes
pdf_document:
toc: true
toc_depth: 2
citation_package: natbib
keep_tex: true
extra_dependencies: rotating, bookmark
fontsize: 12pt
geometry: margin=1in
---
```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = FALSE)
knitr::opts_chunk$set(fig.retina = 3, warning = FALSE, message = FALSE)
```
```{r studies-table}
studies.table <- tibble (
Authors = c("#Author1",
"#Author2"),
Area = c("Area1",
"Area2")
)
ft <- flextable(studies.table)
```
in my references.bib:
#article{Author1,
author = {Author, Solo},
journal = {Journal of Reproducible Examples},
pages = {1--18},
title = {{Yet another Test Title}},
volume = {1},
year = {2022}
}
#article{Author2,
author = {Author, Two and Author, Four},
journal = {Journal of Reproducible Examples},
pages = {75--82},
title = {{Awesome title}},
volume = {1},
year = {2022}
}
I am trying with this code, but #Author1 and #Author2 are not converted to the actual citation. They are displayed as #Aurthor1 and #Author2 in the table. Is there any way to indicate that this should be converted to a citation?
The package ftExtra is required for markdown syntaxes work in flextable cells:
```{r setup, include=FALSE}
library(easypackages)
packages(
"tidyverse",
"flextable",
"ftExtra"
)
knitr::opts_chunk$set(echo = FALSE)
knitr::opts_chunk$set(fig.retina = 3, warning = FALSE, message = FALSE)
```
```{r studies-table}
studies.table <- tibble(
Authors = c(
"#Author1",
"#Author2"
),
Area = c(
"Area1",
"Area2"
)
)
flextable(studies.table) %>%
ftExtra::colformat_md()
```

Adding icons to text unstable

I would like do add an icon to the text in one of the slides.
I've tried a few things but the end result is unstable. The icon are being printed in the html file, but If I add a slide or some text the the icons dissapear. Even if I revert what I've done with Ctrl+Z to previous working code the icons don't get printed...
I might be missing something, but the bookdown documentation didn't have anything on the subject...
---
title: 'Title'
author: "Author"
date: '`r format(Sys.time(), "%d %B, %Y")`'
output:
ioslides_presentation:
self_contained: true
incremental: false
---
```{r knitr_init, echo=FALSE, message=FALSE, warning=FALSE, cache=FALSE}
## Global options
library(knitr)
library(shiny)
opts_chunk$set(
cache = FALSE,
prompt = FALSE,
tidy = FALSE,
comment = NA,
message = FALSE,
warning = FALSE
)
library(tidyverse)
library(plotly)
```
## S1
`r shiny::tags$i(class = "fa fa-arrow-down",style = "color: rgb(0,166,90)")`
item 3
`r shiny::tags$i(class = "fa fa-arrow-down",style = "color: rgb(0,166,90)")`
item 2
## S2
```{r, echo=F}
data.frame(a=1:10, b=1:10) %>%
plot_ly(x=~a,y=~b)
```
Writing the icons as <i class="fa fa-arrow-down" style="color: rgb(0,166,90)"></i> didn't seem to work either.
One option is to use the package icon (more information here).
---
title: 'Title'
author: "Author"
date: '`r format(Sys.time(), "%d %B, %Y")`'
output:
ioslides_presentation:
self_contained: true
incremental: false
---
```{r knitr_init, echo=FALSE, message=FALSE, warning=FALSE, cache=FALSE}
## Global options
library(knitr)
library(shiny)
opts_chunk$set(
cache = FALSE,
prompt = FALSE,
tidy = FALSE,
comment = NA,
message = FALSE,
warning = FALSE,
echo=FALSE
)
library(tidyverse)
library(plotly)
library(icon)
```
## S1
```{r icon-style1}
icon_style(fontawesome("arrow-down", style = "solid"), scale = 2, fill = "#00A65A")
```
item 3
```{r icon-style2}
icon_style(fontawesome("arrow-down", style = "solid"), scale = 2, fill = "#00A65A")
```
item 2
## S2
```{r, echo=F}
data.frame(a=1:10, b=1:10) %>%
plot_ly(x=~a,y=~b)
```
-output
I just added two code chunks, one for each icon. Additionally, in your first r chunk, I added echo=FALSE to the opts_chunk$set and library(icon). In order to achieve the RGB color you chose, the HEX code was needed (#00A65A).

Programmatically create tab and plot in markdown

I'm trying to create a dynamic number of tabs in my rmd with some content inside.
This one doesn't help.
Something like this:
---
title: "1"
output: html_document
---
```{r }
library(highcharter)
library(tidyverse)
iris %>%
dplyr::group_split(Species) %>%
purrr::map(.,~{
# create tabset for each group
..1 %>%
hchart("scatter", hcaes(x = Sepal.Length, y = Sepal.Width))
})
```
You can set results = 'asis' knitr option to generate the tabs in the map function using cat.
Getting Highcharter to work with asis was trickier :
Highchart needs to be called once before the asis chunck, probably to initialize properly, hence the first empty chart.
to print the chart in the asis chunck, the HTML output is sent in character format to cat
Try this:
---
title: "Test tabs"
output: html_document
---
`r knitr::opts_chunk$set(echo = FALSE, warning = FALSE, message = FALSE, cache = F)`
```{r}
library(highcharter)
library(tidyverse)
# This empty chart is necessary to initialize Highcharter in the tabs
highchart(height = 1)
```
```{r, results = 'asis'}
cat('## Tabs panel {.tabset} \n')
invisible(
iris %>%
dplyr::group_split(Species) %>%
purrr::imap(.,~{
# create tabset for each group
cat('### Tab',.y,' \n')
cat('\n')
p <- hchart(.x,"scatter", hcaes(x = Sepal.Length, y = Sepal.Width))
cat(as.character(htmltools::tagList(p)))
})
)
```
Note that while this solution works well, it goes beyond the original use for asis

Add marker on leaflet when selecting from filter in flexdashboard for R

I am quit new to R and trying to develop an dashboard with Flexdashboard based on this example:
https://matt-dray.github.io/earl18-crosstalk/04_leaflet-flexdash-dt-crosstalk.html
I get it to work, but what I am trying to accomplish is that I don't want all my points to show on at the start.
When a user selects a filter I want to add a marker to the map and zoom to this point. I am not using the datatables element
The code I have so far
---
title: "Leaflet + Flexdashboard + DT + Crosstalk"
author: "Matt Dray"
output:
flexdashboard::flex_dashboard:
theme: paper
favicon: img/ios7-location-outline.png
source_code: embed
---
```{r setup, include=FALSE}
# prep workspace
library(dplyr) # tidy data manipulation
library(leaflet) # interative mapping
library(DT) # interactive tables
library(crosstalk) # inter-widget interactivity
library(varhandle) # change column type
sch <- readRDS("data/gias_sample.RDS")
#sch <- readRDS("data/grafinformatie.rds")
#sch <- as.data.frame(sch)
#sch <- unfactor(sch) # change column type
sd <- SharedData$new(sch)
```
Interactives {data-icon="ion-stats-bars"}
=====================================
Column {data-width=400}
-------------------------------------
### Filters
```{r filters}
filter_select(
id = "geo_la",
label = "NAME",
sharedData = sd,
group = ~geo_la
)
```
Column {data-width=600}
-------------------------------------
### Interactive map
```{r map}
sd %>%
leaflet::leaflet() %>%
leaflet::addProviderTiles(providers$OpenStreetMap)
# leaflet::addAwesomeMarkers(
# icon = awesomeIcons(
# library = "ion",
# iconColor = "white"
# )
# ) %>% # end addAwesomeMarkers()
#leaflet::addMeasure()
```
$(document).ready(function () {
FlexDashboard.init({
theme: "paper",
fillPage: true,
orientation: "columns",
storyboard: false,
defaultFigWidth: 576,
defaultFigHeight: 460,
defaultFigWidthMobile: 360,
defaultFigHeightMobile: 460
});
});
Hope someone can help! Thanks

Adding background image to R Markdown (.rmd) file for PDF document?

I have seen this post to include a background image to an R markdown report.
I have created a Shiny app to generate a pdf report:
shinyApp(
ui = fluidPage(
sliderInput("slider", "Slider", 1, 10, 5),
downloadButton("report", "Generate report")
),
server = function(input, output) {
test1 <- reactive({
n = input$slider
df=matrix(1:n^2,n,n)
df = as.data.frame(df)
result <- list(df=df,n=n)
return(result)
})
output$report <- downloadHandler(
# For PDF output, change this to "report.pdf"
filename = "report.pdf",
content = function(file) {
# Copy the report file to a temporary directory before processing it, in
# case we don't have write permissions to the current working dir (which
# can happen when deployed).
tempReport <- file.path(tempdir(), "report.Rmd")
file.copy("report.Rmd", tempReport, overwrite = TRUE)
# Set up parameters to pass to Rmd document
params <- list(n = test1()$n,
df = test1()$df)
# Knit the document, passing in the `params` list, and eval it in a
# child of the global environment (this isolates the code in the document
# from the code in this app).
rmarkdown::render(tempReport, output_file = file,
params = params,
envir = new.env(parent = globalenv())
)
}
)
}
)
And here is my .rmd file :
---
title: "Title"
author: "Name"
date: "`r Sys.Date()`"
output:
pdf_document :
fig_caption: yes
keep_tex: yes
number_sections: yes
header-includes:
\usepackage{booktabs}
\usepackage{longtable}
\usepackage{array}
\usepackage{multirow}
\usepackage{wrapfig}
\usepackage{float}
\usepackage{colortbl}
\usepackage{pdflscape}
\usepackage{tabu}
\usepackage{threeparttable}
\usepackage{threeparttablex}
\usepackage[normalem]{ulem}
\usepackage{makecell}
\usepackage{background}
\backgroundsetup{
scale=1,
color=black,
opacity=0.4,
angle=0,
pages=all,
contents={
\includegraphics[width=\paperwidth,height=\paperheight]{C:/Users/path_to_image/image.jpg}
}
}
params:
n: NA
df: NA
---
```{r}
# The `params` object is available in the document.
params$n
```
A plot of `params$n` random points.
```{r}
plot(rnorm(params$n), rnorm(params$n))
```
```{r}
params$df %>%
mutate_if(is.numeric, function(x) {
cell_spec(x, "latex", bold = T, color = spec_color(x, end = 0.85),
font_size = spec_font_size(x))
}) %>%
kable("latex", escape = F, booktabs = T, linesep = "", align = "c")%>%
kable_styling(latex_options = c("striped", "scale_down"))
```
The error that I'm getting is :
! Undefined control sequence.
l.171 \centering\rowcolors
{2}{gray!6}{white}
Here is how much of TeX's memory you used:
24161 strings out of 492990
415742 string characters out of 6136334
504502 words of memory out of 5000000
27291 multiletter control sequences out of 15000+600000
19644 words of font info for 30 fonts, out of 8000000 for 9000
1141 hyphenation exceptions out of 8191
62i,4n,56p,577b,315s stack positions out of 5000i,500n,10000p,200000b,80000s
[1]: http
Which in tex community they referring to forgetting something like \end{document}. I should mention that if I use the .rmd file alone and replace the last part with :
{r}
library(kableExtra)
library(dplyr)
iris[1:10, ] %>%
mutate_if(is.numeric, function(x) {
cell_spec(x, "latex", bold = T, color = spec_color(x, end = 0.9),
font_size = spec_font_size(x))
}) %>%
mutate(Species = cell_spec(
Species, "latex", color = "white", bold = T,
background = spec_color(1:10, end = 0.9, option = "A", direction = -1)
)) %>%
kable("latex", escape = F, booktabs = T, linesep = "", align = "c")
I will be able to compile it with that background image, the current shiny app is also generating the report if I exclude the part that related to the background image setting.
That's because xcolor must be loaded before background. Do:
---
title: "Title"
author: "Name"
date: "`r Sys.Date()`"
output:
pdf_document :
fig_caption: yes
keep_tex: yes
number_sections: yes
header-includes:
\usepackage{background}
\usepackage{float}
\backgroundsetup{
scale=1,
color=black,
opacity=0.4,
angle=0,
pages=all,
contents={
\includegraphics[width=\paperwidth,height=\paperheight]{C:/Users/path_to_image/image.jpg}
}
}
---
Note that your "header-includes" is useless because all these packages are automatically included.

Resources