Git Product home page Git Product logo

shinytreeview's Introduction

shinytreeview

Hierarchical tree structures input for Shiny applications. Interface for bootstrap-treeview JS library.

Lifecycle: experimental R build status

Installation

Install the development version from GitHub with:

remotes::install_github("dreamRs/shinytreeview")

Example

treeviewInput() allow to select a value (or several) in a hierarchical structure :

Code for this example:

library(shiny)
library(shinytreeview)

data("cities")

ui <- fluidPage(
  tags$h3("treeviewInput cities example"),
  treeviewInput(
    inputId = "tree",
    label = "Choose a city:",
    choices = make_tree(
      cities, c("continent", "country", "city")
    ),
    multiple = FALSE,
    prevent_unselect = TRUE,
    width = "100%"
  ),
  verbatimTextOutput(outputId = "result")
)

server <- function(input, output, session) {
  output$result <- renderPrint({
    input$tree
  })
}

if (interactive())
  shinyApp(ui, server)

treecheckInput() allow to check a value (or several) in a hierarchical structure :

Code for this example:

library(shiny)
library(shinytreeview)

data("cities")

ui <- fluidPage(
  tags$h3("treeviewInput cities example"),
  treecheckInput(
    inputId = "tree",
    label = "Choose a city:",
    choices = make_tree(
      cities, c("continent", "country", "city")
    ),
    width = "100%"
  ),
  verbatimTextOutput(outputId = "result")
)

server <- function(input, output, session) {
  output$result <- renderPrint({
    input$tree
  })
}

if (interactive())
  shinyApp(ui, server)

Development

This package use {packer} to manage JavaScript assets, see packer's documentation for more.

Install nodes modules with:

packer::npm_install()

Modify srcjs/inputs/treeview.js, then run:

packer::bundle()

Re-install R package and try demo applications in examples/.

shinytreeview's People

Contributors

pvictor avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar

shinytreeview's Issues

Scrollable input

My list is very long, especially when certain categories are expanded. Is there some way to make it scrollable?

Update selection in server.R (shiny)

Hi,

Is there a way to change the value of the tree input on the client? Something like what updateCheckboxGroupInput does for checkboxGroupInput. What I would like to include in my app is a "Reset selection" button, which reverts the selection of the nodes in the tree to the default one.

hierarchical argument with default selected is not working

library(shiny)
library(shinytreeview)
library(shinyWidgets)
library(dplyr)

x <- mutate(cities, all = "All")

ui <- fluidPage(
tags$h3("treeviewInput cities example"),

convert to combo box list

dropdownButton(circle = FALSE, label = "Show Tree",
treecheckInput(
inputId = "tree",
label = NULL,

is not selecting all levels below it

selected = "All", 
choices = make_tree(
  x, c("all", "continent", "country", "city")
),
borders = FALSE, 
width = "100%"

)
)
,
verbatimTextOutput(outputId = "result")
)

server <- function(input, output, session) {
output$result <- renderPrint({
input$tree
})
}

if (interactive())
shinyApp(ui, server)

Collapsing tree when search is used

I am using treecheckInput and searchTreeview. When I open my app, the whole tree is expanded and all the items are in red. Is there a way to stop the tree from expanding before any value is typed into the search? collapse_before = TRUE works after something is typed into the search box but I would like the whole list to be collapsed before I do any search.

Make parent nodes un-selectable

I want to avoid that users can select parent nodes as input.

Is there a way to make parent nodes (i.e., continent or country in the cities dataset) un-selectable?

Example for expand/collapse is broken

Hello,

In the docs there is an example for expand/collapse.
I justed wanted to let you know that the actionButton "expandWAfrica" cannot work, because nodes_input = TRUE isn't set in treeviewInput.

Further I do not know if it is the intented behaviour that then the countrys of level 3 are then displayed directly under level 1. I would assume level 2 (e.g. western africa) is still displayed (but now expanded).

Is there a way in which the menu can automatically collapse back once a country is selected?

Hi @pvictor ,

Thank you so much for this package.

Is there a way in which the menu can automatically collapse back once a country is selected?

`
library(shiny)
library(shinytreeview)

data("cities")

ui <- fluidPage(
tags$h3("treeviewInput cities example"),
treeviewInput(
inputId = "tree",
label = "Choose a city:",
choices = make_tree(
cities, c("continent", "country", "city")
),
multiple = FALSE,
prevent_unselect = TRUE,
width = "100%"
),
verbatimTextOutput(outputId = "result")
)

server <- function(input, output, session) {
output$result <- renderPrint({
input$tree
})
}

if (interactive())
shinyApp(ui, server)
`

Styling

Hello,

First, thanks for the package.

Can you tell me what's the easiest way of changing the style of the ui elements? For example, I want to change the blue background of the selected row. Or smaller margins/paddings?

plus/minus icons missing?

Hello,

It's just now that I realized that my shinytreeviews (when using your examples) miss something your screenshots show: the "plus" (resp. "minus") in front of the lines that indicate whether this line is open or closed.

Is this intended?

Default selection does not work with treecheckInput

Hi,

Thank you for this package, it's very useful.

I do not manage to select nodes by default when using treecheckInput. When running the code below, no nodes get selected in my shiny app. If I use treeviewInput instead, with the same code, all main nodes get selected.

Any idea?

library(shiny)
library(shinytreeview)

data("cities")

ui <- fluidPage(
  treecheckInput(
    inputId = "tree",
    choices = make_tree(
      cities, 
      c("continent", "country", "city"),
      selected = cities$continent
    )
  ),
  verbatimTextOutput(outputId = "result")
)

server <- function(input, output, session) {
  output$result <- renderPrint({
    input$tree
  })
}

if (interactive())
  shinyApp(ui, server)

Order of variables

Is there any way in which I can control the order in which the levels appears in treecheckInput in my app? E.g. in the example you show with continent -> country -> city, the continents appear in this order: America, Africa, Europe, Antarctica.
How is it currently determined? In my app 'Other' comes first which is unfortunate and I would like to change it.

also, is there an equivalent of searchtreeview for treecheckInput?

Same-named parent & child nodes: Parent node still selectable / not unselectable after setting selectable = FALSE and multiple = TRUE

          I now experienced another issue and created a reproducible example (see below) using the cities dataset. 

After making the first two nodes (continent & country) unselectable, they are now still selected and in the app, I can not unselect them.

What can I do so that in the example below, again only the cities are selectable?

Thank you in advance!

library(shiny)
library(shinytreeview)

my_cities <- rbind(
  shinytreeview::cities, 
  data.frame(continent = "Luxemburg", 
             country = "Luxemburg",
             city = "Luxemburg")
)

args <- list(
  data = my_cities, 
  levels = c("continent", "country", "city")
)

args[names(my_cities)[1:2]] <- list(list(selectable = FALSE))
tree <- do.call(make_tree, args)

ui <- fluidPage(
  treeviewInput(inputId = "tree", label = "Tree", 
                choices = tree, selected = "Luxemburg", 
                multiple = T),
  verbatimTextOutput("tree_output")
)

server <- function(input, output, session) {
  
  output$tree_output <- renderText({
    input$tree
  })
  
}

shinyApp(ui, server)

Originally posted by @philiph99 in #11 (comment)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.