javascript R闪亮DT悬停显示详细表格

ryoqjall  于 2022-12-17  发布在  Java
关注(0)|答案(1)|浏览(123)

我正在尝试开发一个R shiny应用程序,希望在顶部显示一个合并表,当用户将鼠标悬停在任何行项目上时,它将显示该表的详细信息部分。下面是第一个表的代码

library(ggplot2)

ui <- fluidPage(
  titlePanel("Basic DataTable"),

  # Create a new row for the table.
  DT::dataTableOutput("table")
)
server <- function(input, output) {
  data <- mpg

  data <-data %>% group_by(manufacturer,year) %>% 
    summarise(cty = round(mean(cty),2),hwy = round(2,mean(hwy)))

  # Filter data based on selections
  output$table <- DT::renderDataTable(DT::datatable({

    data
  }))

}

shinyApp(ui,server)

现在,当用户悬停在Audi上时,例如,它应该显示Audi的详细版本,如下表所示。这可以在悬停或单击DT时在shiny中完成吗?

7z5jn7bk

7z5jn7bk1#

这里有一个方法,如果你更喜欢在点击时显示子表而不是悬停时显示子表,那么用"table.on('click', 'td', function(){"替换"table.on('mouseover', 'td', function(){"

library(shiny)
library(DT)

data(mpg, package = "ggplot2")

callback <- c(
  "table.on('mouseover', 'td', function(){",
  "  var index = table.cell(this).index();",
  "  Shiny.setInputValue('cell', index, {priority: 'event'});",
  "});"
)

ui <- fluidPage(
  br(),
  DTOutput("tbl")
)

server <- function(input, output, session){

  dat <- mpg

  output[["tbl"]] <- renderDT({
    datatable(
      dat,
      callback = JS(callback)
    )
  })

  filteredData <- eventReactive(input[["cell"]], {
    i <- input[["cell"]]$row + 1
    j <- input[["cell"]]$column
    if(j > 0){
      dat[dat[[j]] == dat[i,j], , drop = FALSE]
    }else{
      NULL
    }
  })

  output[["tblfiltered"]] <- renderDT({
    datatable(
      filteredData(),
      fillContainer = TRUE, 
      options = list(
        pageLength = 5
      )
    )
  })

  observeEvent(filteredData(), {
    showModal(
      modalDialog(
        DTOutput("tblfiltered"), 
        size = "l", 
        easyClose = TRUE
      )
    )
  })

}

shinyApp(ui, server)

相关问题