rshinydtflexdashboard

How do I get data to display in a DT when using runtime: shiny in the YAML header of my flexdashboard document?


I have a flexdashboard document. In one section I wish to display a DT data table. I hope to use the DT in a reactive context where clicking on a row returns the value of one of the columns for use in another shiny component.

The problem I have is that no rows of data appear in the DT. Below is a screen shot demonstrating the problem. As you can see on the right, there is data to be displayed.

Can someone tell me where I've gone wrong?

If my YAML header looks like this:

---
title: "Emerald Gardens"
output: 
  flexdashboard::flex_dashboard:
    orientation: columns
    vertical_layout: fill
    css: "../05_css/eg.css"
    runtime: shiny
---

I get that output.

DT and associated data

On the other hand, if I change my YAML header to look like this:

---
title: "Emerald Gardens"
output: 
  flexdashboard::flex_dashboard:
    orientation: columns
    vertical_layout: fill
    css: "../05_css/eg.css"
---

I get the expected output:

Expected output

The two code chunks are these:

    # Data
    eg_plotting_tbl <- read_rds("../02_processed_data/eg_plotting_tbl.rds")

    data <- eg_plotting_tbl %>% 
        select(c(situs_address, 
                 lot_sq_ft, 
                 bulding_area, 
                 bedrooms, 
                 baths, 
                 pool, 
                 waterfront, 
                 eff_yr_built, 
                 account))
    
    data <- data %>% 
        mutate(lot_sq_ft = format(lot_sq_ft, big.mark = ",", scientific = FALSE)) %>% 
        mutate(bulding_area = format(bulding_area, big.mark = ",", scientific = FALSE)) %>% 
        mutate(bedrooms = as.factor(bedrooms)) %>% 
        mutate(baths = as.factor(baths))
   

and

        datatable(data,
                  elementId = "property_characteristics_table",
                  rownames = FALSE,
                  colnames = c("Address",
                               "Lot Size (sq.ft.)",
                               "Building Size (sq.ft.)",
                               "Bedrooms",
                               "Baths",
                               "Pool",
                               "Waterfront",
                               "Effective Year Built",
                               "account"),
                  filter = "top",
                  options = list(scrollX = TRUE,
                                 autoWidth = TRUE,
                                 columnDefs = list(list(width = "105px", targets = 0),
                                                   list(width = "30px", targets = c(3,6)),
                                                   list(className = "dt-right", targets = c(1,2,3,4)),
                                                   list(className = "dt-center",
                                                        width = "30px",
                                                        targets = c(5,6,7)),
                                                   list(visible = FALSE, targets = 8))
                  )
                )

Here's an R script containing a shiny app. It displays the table as described earlier and exhibits the interactivity I wanted. What I'm looking for is a way to incorporate this, with whatever necessary changes, into a tab on a flexdashboard page:

library(DT)
library(shiny)

eg_plotting_tbl <- read_rds("../02_processed_data/eg_plotting_tbl.rds")

data_table <- eg_plotting_tbl %>% 
    select(c(situs_address, 
             lot_sq_ft, 
             bulding_area, 
             bedrooms, 
             baths, 
             pool, 
             waterfront, 
             eff_yr_built, 
             account))

data_table <- data_table %>% 
    mutate(lot_sq_ft = format(lot_sq_ft, big.mark = ",", scientific = FALSE)) %>% 
    mutate(bulding_area = format(bulding_area, big.mark = ",", scientific = FALSE)) %>% 
    mutate(bedrooms = as.factor(bedrooms)) %>% 
    mutate(baths = as.factor(baths))


ui <- fluidPage(
    fluidRow(
        column(8, DTOutput("myTable")),
        column(
            4,
            h4("Account for selected row"), 
            verbatimTextOutput("selected")
        )
    )
)

server <- function(input, output) {
    
    output$myTable <- renderDT({
        datatable(data_table,
                  selection = "single",
                  rownames = FALSE,
                  colnames = c("Address", 
                               "Lot Size (sq.ft.)", 
                               "Building Size (sq.ft.)", 
                               "Bedrooms", 
                               "Baths", 
                               "Pool", 
                               "Waterfront", 
                               "Effective Year Built",
                               "account"),
                  filter = "top",
                  options = list(scrollX = TRUE,
                                 autoWidth = TRUE,
                                 columnDefs = list(list(width = "115px", targets = 0),
                                                   list(width = "30px", targets = c(3,6)),
                                                   list(className = "dt-right", targets = c(1,2,3,4)),
                                                   list(className = "dt-center", 
                                                        width = "30px", 
                                                        targets = c(5,6,7)),
                                                   list(visible = FALSE, targets = 8))
                  ))
    })
    
    output$selected <- renderPrint({
        selected_row <- input$myTable_rows_selected
        if (length(selected_row) > 0) {
            selected_value <- data_table[selected_row, 9, drop = TRUE]
            print(selected_value)
        } else {
            "No row selected"
        }
        
    })
    
}

shinyApp(ui, server)

Solution

  • I believe this is the same issue I faced here. Try getting rid of the indent before runtime: shiny in your YAML