Question

所以我正在努力研究R Shiny的一个方面，我希望你能提供帮助。基本上，作为我正在构建的应用程序的一部分，我在某些摘要框中添加了一个onclick()函数，用于更改下面显示的表格。但是，用户不能明白您可以单击这些框。我想理想地在可点击区域上方时改变光标到手（如R Shiny用于下拉菜单等）。我试过实现这里找到的答案：

Change mouse pointer to hand in R Shiny

Cursor change while hovering over shiny widget

然而，第一个涉及一个表，我无法弄清楚如何为一个盒子重写它。第二个链接更有前途，但每当我实现它时，我似乎只能使整个页面变成一个不同的游标。我只希望特定的框显示可点击的光标。

我提供了我正在使用的代码部分的摘录（其中各个位在不同的脚本上）。我把盒子的实际内容留空了，因为它并不重要，但它可能是平均值，中位数等等。

tabItems(
  tabItem(tabName = "summaryStatistics",
    uiOutput('summary_stats')
)

output$summary_stats = renderUI({
  div(
    fluidRow(
      valueBoxOutput("W", width = 3),
      valueBoxOutput("X", width = 3),
      valueBoxOutput("Y", width = 3),
      valueBoxOutput("Z", width = 3)
    )
})

output$X = renderValueBox({
})

我希望我能在这里得到一切相关的东西;如果我错过任何事情，我会道歉。任何和所有的建议将不胜感激！

Answer 1

您可以使用此CSS选择所有框：

.small-box {cursor: pointer;}

或仅包含具有指定ID的框（在CSS中使用#选中）：

#W .small-box, #X .small-box, #Y .small-box, #Z .small-box {cursor: pointer;}

光标的可用选项列在here。

使用您的应用，它会给出：

library("shiny")
library("shinydashboard")

ui <- dashboardPage(
  dashboardHeader(),
  dashboardSidebar(),
  dashboardBody(
    # All box with cursor = pointer
    # tags$style(".small-box {cursor: pointer;}"),
    # Only box with IDs X, Y, Z, W
    tags$style("#W .small-box, #X .small-box, #Y .small-box, #Z .small-box {cursor: pointer;}"),
    uiOutput('summary_stats')
  ),
  title = "Dashboard example"
)

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

  output$summary_stats <- renderUI({
    div(
      fluidRow(
        valueBoxOutput("W", width = 3),
        valueBoxOutput("X", width = 3),
        valueBoxOutput("Y", width = 3),
        valueBoxOutput("Z", width = 3)
      )
    )
  })

  output$X <- renderValueBox({
    valueBox(value = 1, subtitle = "X")
  })
  output$Y <- renderValueBox({
    valueBox(value = 1, subtitle = "Y")
  })
  output$Z <- renderValueBox({
    valueBox(value = 1, subtitle = "Z")
  })
  output$W <- renderValueBox({
    valueBox(value = 1, subtitle = "W")
  })

}

shinyApp(ui = ui, server = server)

值框游标更改

1 个答案: