jsTree htmlwidget

October 23, 2017
By

(This article was first published on Rstats on Reproducible Random Thoughts, and kindly contributed to R-bloggers)




jsTree is a R package that is a standalone htmlwidget for the jsTree JavaScript library. It can be run from the R console directly into the Rstudio Viewer, be used in a Shiny application or be part of an Rmarkdown html output.

Installation

#CRAN
install.packages('jsTree')

#Github
devtools::install_github('metrumresearchgroup/jsTree')

The motivation for the package came from the shinyTree by Jeff Allen, which has an early version of the JavaScript library hardcoded into a Shiny application.

The input for the htmlwidget is a character vector and the heirarchy is set by the ‘/’, as to mimic the delimiter of a file path.

The main purpose of this package is vizualize folder hierarchy, much like in the Files tab in RStudio. But, instead of looking in local directories it will be used for remote repositories, such as github, bitbucket and svn repositories. This is implemented in the vcs package and a future post will show utility that package gives.

To show the basic functionality of jsTree we will use a dataset that contains all superfund sites from the EPA. You can access the tibble here. The data

library(htmlTable)
library(jsTree)
library(widgetframe)
# Read in the data
superfundsite <- readRDS('../../data/superfundsite.Rds')

htmlTable::htmlTable(head(superfundsite),rnames=FALSE)
Region State City County Zip Code Site Name
01 Massachusetts ACTON MIDDLESEX 01720 W.R. GRACE & CO., INC. (ACTON PLANT)
01 Massachusetts AMESBURY ESSEX 01913 MICROFAB INC (FORMER)
01 Massachusetts ASHLAND MIDDLESEX 01721 NYANZA CHEMICAL WASTE DUMP
01 Massachusetts ATTLEBORO BRISTOL 02703 WALTON & LONSBURY INC.
01 Maine AUGUSTA KENNEBEC 04330 O’CONNOR CO.
01 Connecticut BARKHAMSTED LITCHFIELD 06063 BARKHAMSTED-NEW HARTFORD LANDFILL

Basic Usage

# collapse columns to be delimited by '/'
myx <- apply(superfundsite,1,function(x) paste(x,collapse = '/'))

# call jsTree
j0 <- jsTree(obj = myx)

# place widget in iframe to use in blog post 
# (not needed in regular usage)
frameWidget(j0)

Initialize tree with checked boxes

nodestate1 <- superfundsite$State=='California'

j1 <- jsTree(myx,nodestate=nodestate1)

frameWidget(j1)

Tooltips

# Use the zipcode as a tooltip on the county name

myx2 <- apply(superfundsite[,-c(5)],1,paste,collapse='/')

zipcode_label <- superfundsite$`Zip Code`
names(zipcode_label) <- superfundsite$County

j2 <- jsTree(myx2,tooltips = zipcode_label)

frameWidget(j2)

Shiny

jsTree can be used in Shiny applications and supplies observers so the Shiny can react to the tree.

ui <- shiny::fluidPage(
  
  shiny::column(width=4,jsTree::jsTreeOutput('tree')),
  
  shiny::column(width=8,shiny::uiOutput('chosen'))
  
)

server <- function(input, output,session) {
  
  network <- shiny::reactiveValues()
  
  shiny::observeEvent(input$tree_update,{
    
    current_selection <- input$tree_update$.current_tree
    if(!is.null(current_selection)) 
      network$tree <- jsonlite::fromJSON(current_selection)
    
  })
  
  shiny::observeEvent(network$tree,{
    
    output$results <- shiny::renderPrint({
      
      str.out <- ''
      
      if(length(network$tree)>0)
        str.out=network$tree
      
      return(str.out)
    })    
  })
  
  output$chosen <- shiny::renderUI({
    
    list(shiny::h3('Selected Items'),
         
    shiny::verbatimTextOutput(outputId = "results"))
    
  })
  
  output$tree <- jsTree::renderJsTree({
    
    nested_string <- myx
    
    jsTree(nested_string)
    
  })
  
}

shinyApp(ui, server)

To leave a comment for the author, please follow the link and comment on their blog: Rstats on Reproducible Random Thoughts.

R-bloggers.com offers daily e-mail updates about R news and tutorials on topics such as: Data science, Big Data, R jobs, visualization (ggplot2, Boxplots, maps, animation), programming (RStudio, Sweave, LaTeX, SQL, Eclipse, git, hadoop, Web Scraping) statistics (regression, PCA, time series, trading) and more...



If you got this far, why not subscribe for updates from the site? Choose your flavor: e-mail, twitter, RSS, or facebook...

Comments are closed.

Search R-bloggers

Sponsors

Never miss an update!
Subscribe to R-bloggers to receive
e-mails with the latest R posts.
(You will not see this message again.)

Click here to close (This popup will not appear again)