仅在悬停时显示文本

时间:2018-06-06 15:09:47

标签: javascript r shiny hover

我正在制作一个闪亮的应用程序,我只希望在悬停或鼠标悬停动作时输入textouput

我尝试添加操作按钮

UI:

fluidRow(box (title = p("Rates by Gender and Race", actionButton("titleBtId", "", icon=icon('question-circle'),class = "btn-xs", title = "Info"),textOutput("text_id"),hover=T), width = 15, status = 'primary', solidHeader = TRUE,tabPanel('',plotlyOutput("racegender",height = "100%"))%>% withSpinner(color="#0dc5c1")))

服务器:

output$text_id <- renderText({
  paste0("hi")
})

我不确定如何将其编辑为仅在悬停

上显示文字

2 个答案:

答案 0 :(得分:0)

使用ModalDialog

工作

UI

fluidRow(
box (title = p("Rates by Gender and Race",  tags$head(                                     tags$style(HTML('#titleBtId{background-color:black}'))), actionButton("titleBtId", "", icon=icon('question-circle'),class = "btn-xs", title = "Info"),hover=T), width = 15, status = 'primary', solidHeader = TRUE,                                     tabPanel('',plotlyOutput("racegender",height = "100%"))%>% withSpinner(color="#0dc5c1")))

服务器:

  observeEvent(input$titleBtId, {
    showModal(modalDialog(
      title = "Note",
      "This chart if independent of Date-range and Age-range selections",
      easyClose = TRUE
    ))
  })

答案 1 :(得分:0)

模式弹出窗口的替代方案,取决于您想要的用户体验,是使用shinyBS包中的工具提示,该工具包具有微妙但有效的弹出窗口和工具提示的功能。下面是悬停或单击的不同功能的示例,并将工具提示放在UI或服务器中,具有相同的体验。请注意,从理论上讲,您可以使用tipify()在UI中放置悬停工具提示,但出于某种原因,这似乎并不适用于actionButtons,尽管它继续适用于其他输入元素。

library(shiny)
library(shinyBS)

ui <- fluidPage(
   titlePanel("ShinyBS tooltips"),
   actionButton("btn", "On hover"),
   tipify(actionButton("btn2", "On click"), "Hello again! This is a click-able pop-up", placement="bottom", trigger = "click")
  )

server <- function(input, output, session) {
  addTooltip(session=session,id="btn",title="Hello! This is a hover pop-up. You'll have to click to see the next one.")
}

shinyApp(ui, server)