Render SVG as interactive figures to display contextual information, with selectable and clickable user interface elements. These figures can be seamlessly integrated into ‘rmarkdown’ and ‘Quarto’ documents, as well as ‘shiny’ applications, allowing manipulation of elements and reporting actions performed on them. Additional features include pan, zoom in/out functionality, and the ability to export the figures in SVG or PNG formats.
install.packages("bscui")The following R packages available on CRAN are required:
- htmlwidgets: HTML Widgets for R
- webshot2: Take Screenshots of Web Pages
And those are suggested for building the vignettes and running some examples:
- knitr: A General-Purpose Package for Dynamic Report Generation in R
- rmarkdown: Dynamic Documents for R
- here: A Simpler Way to Find Your Files
- xml2: Parse XML
- dplyr: A Grammar of Data Manipulation
- readr: Read Rectangular Text Data
- stringr: Simple, Consistent Wrappers for Common String Operations
- glue: Interpreted String Literals
- scales: Scale Functions for Visualization
- shiny: Web Application Framework for R
- reactable: Interactive Data Tables for R
- reactable.extras: Extra Features for ‘reactable’ Package
devtools::install_github("patzaw/bscui")- Introduction to bscui; this introduction vignette is also included in the package:
vignette("bscui")This example relies on a figure of animal cells taken from SwissBioPics.
##################################@
### Preparing data ----
library(bscui)
library(xml2)
library(readr)
library(dplyr)
svg <- xml2::read_xml(system.file(
"examples", "Animal_cells.svg.gz",
package="bscui"
))
info <- readr::read_tsv(system.file(
"examples", "uniprot_cellular_locations.txt.gz",
package="bscui"
), col_types=strrep("c", 6)) |>
mutate(id = sub("-", "", `Subcellular location ID`))
##################################@
### Building the figure ----
figure <- bscui(svg) |>
set_bscui_ui_elements(
info |>
mutate(
ui_type = "selectable",
title = Name
) |>
select(id, ui_type, title)
) |>
set_bscui_styles(
info |>
filter(Name == "Cytosol") |>
mutate(fill = "#FF7F7F") |>
select(id, fill)
) |>
set_bscui_attributes(
info |>
filter(Name == "Cytoskeleton") |>
mutate(display = "none") |>
select(id, display)
) |>
set_bscui_selection("SL0188") |>
set_bscui_options(zoom_min=1, clip=TRUE)
figure
##################################@
### Saving the figure ----
if(interactive()){
## Temporary directory to save example file
tdir <- tempdir()
## Interactive html file
f_path <- file.path(tdir, "figure.html")
figure |> htmlwidgets::saveWidget(file=f_path)
cat(f_path)
## PNG image
f_path <- file.path(tdir, "figure.png")
figure |>
set_bscui_options(show_menu = FALSE) |>
export_bscui_to_image(file=f_path, zoom=2)
cat(f_path)
}The following ‘shiny’ application relies on human female anatomical diagram taken from the EBI gene expression group.
shiny::runApp(system.file("examples", "shiny-anatomogram", package = "bscui"))
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent