Tooltip zu Tabs in Shiny hinzufügen

Question

Ich versuche, Tooltips/Popovers mit dem shinyBS-Paket für eine Shiny-Anwendung hinzuzufügen, habe aber ein Problem aufgrund von Tabs ohne Eingabe/IDs. Dies verhindert, dass der Tooltip ausgelöst wird. Irgendwelche Gedanken?

library(shiny) 
library(shinyBS) 

    shinyApp(
     ui = tagList(
     navbarPage(
      theme = "cerulean", # <--- To use a theme, uncomment this 
      "shinythemes", 
      tabPanel(id="test","Navbar 1", 
        bsTooltip("test", title="Test Title", trigger = "hover"), 
        sidebarPanel(
        fileInput("file", "File input:"), 
        textInput("txt", "Text input:", "general"), 
        sliderInput("slider", "Slider input:", 1, 100, 30), 
        tags$h5("Deafult actionButton:"), 
        actionButton("action", "Search"), 

        tags$h5("actionButton with CSS class:"), 
        actionButton("action2", "Action button", class = "btn-primary") 
        ), 
        mainPanel(
        tabsetPanel(
         tabPanel("Tab 1", 
           bsTooltip("Tab 1", title="Test Title"), 
           h4("Table"), 
           tableOutput("table"), 
           h4("Verbatim text output"), 
           verbatimTextOutput("txtout"), 
           h1("Header 1"), 
           h2("Header 2"), 
           h3("Header 3"), 
           h4("Header 4"), 
           h5("Header 5") 
         ), 
         tabPanel("Tab 2"), 
         tabPanel("Tab 3") 
        ) 
        ) 
     ), 
      tabPanel("Navbar 2"), 
      tabPanel("Navbar 3") 
     ) 
    ), 
     server = function(input, output) { 
     output$txtout <- renderText({ 
      paste(input$txt, input$slider, format(input$date), sep = ", ") 
     }) 
     output$table <- renderTable({ 
      head(cars, 4) 
     }) 
     } 
    ) 

Angeschlossen ist eine Testanwendung mit TabPanels und Tabset Panels zum Testen.

Answer 1

hier ein minimales Beispiel ist die

library(shiny) 
library(shinyBS) 

shinyApp(
    ui = tagList(
    navbarPage(
     theme = "cerulean", # <--- To use a theme, uncomment this 
     "shinythemes", 
     tabPanel(id="test","Navbar 1", 
       bsTooltip("test", title="Test Title", trigger = "hover"), 
       sidebarPanel(
       fileInput("file", "File input:"), 
       textInput("txt", "Text input:", "general"), 
       sliderInput("slider", "Slider input:", 1, 100, 30), 
       tags$h5("Deafult actionButton:"), 
       actionButton("action", "Search"), 

       tags$h5("actionButton with CSS class:"), 
       actionButton("action2", "Action button", class = "btn-primary") 
       ), 
       mainPanel(
       tabsetPanel(
        tabPanel("Tab 1", 
          bsTooltip("Tab 1", title="Test Title"), 
          div(id = "my_id",      #changed 
           h4("Table"), 
           tableOutput("table"), 
           h4("Verbatim text output"), 
           verbatimTextOutput("txtout"), 
           h1("Header 1"), 
           h2("Header 2"), 
           h3("Header 3"), 
           h4("Header 4"), 
           h5("Header 5") 
          ),          # changed 
          bsTooltip('my_id','some text...')  # changed 
        ), 
        tabPanel("Tab 2"), 
        tabPanel("Tab 3") 
       ) 
       ) 
    ), 
     tabPanel("Navbar 2"), 
     tabPanel("Navbar 3") 
    ) 
), 
    server = function(input, output) { 
    output$txtout <- renderText({ 
     paste(input$txt, input$slider, format(input$date), sep = ", ") 
    }) 
    output$table <- renderTable({ 
     head(cars, 4) 
    }) 
    } 
) 

Wie Sie sehen einen Tooltip zu forst Registerkarte fügt haben, änderte ich nur 3 Zeilen

• Die erste und die zweite Zeile umgebrochen wird, den Inhalt der erste Tab in einem div. Die div eine ID hat my_id die
• Die dritte Zeile fügt den Tooltip später verwendet wird, um die div id

Basycally durch verwenden, sollten Sie in der Lage zu wickeln, was Inhalt, den Sie in ein div wollen, geben Sie ihm eine id und dann ein Popover hinzufügen. Wenn Sie Probleme mit diesem Ansatz haben, lassen Sie es mich bitte wissen.

Answer 2

können Sie HTML verwenden, wenn Sie den Titel der Tabs übergeben. In diesem Fall habe ich einfach den Titel in einen Bereich eingefügt und den Attributtitel hinzugefügt. Dies ist das Attribut HTML, das standardmäßig für Mauszeiger verwendet wird. Für mich ist das viel einfacher, es über shinyBS hinzuzufügen.

library(shiny) 
library(shinyBS) 

shinyApp(
    ui = tagList(
    navbarPage(
     theme = "cerulean", # <--- To use a theme, uncomment this 
     "shinythemes", 
     tabPanel(id="test",span("Navbar 1",title="Test Title"), 
       sidebarPanel(
       fileInput("file", "File input:"), 
       textInput("txt", "Text input:", "general"), 
       sliderInput("slider", "Slider input:", 1, 100, 30), 
       tags$h5("Deafult actionButton:"), 
       actionButton("action", "Search"), 

       tags$h5("actionButton with CSS class:"), 
       actionButton("action2", "Action button", class = "btn-primary") 
       ), 
       mainPanel(
       tabsetPanel(
        tabPanel(span("Tab 1", title="Test Title"), 
          h4("Table"), 
          tableOutput("table"), 
          h4("Verbatim text output"), 
          verbatimTextOutput("txtout"), 
          h1("Header 1"), 
          h2("Header 2"), 
          h3("Header 3"), 
          h4("Header 4"), 
          h5("Header 5") 
        ), 
        tabPanel("Tab 2"), 
        tabPanel("Tab 3") 
       ) 
       ) 
    ), 
     tabPanel("Navbar 2"), 
     tabPanel("Navbar 3") 
    ) 
), 
    server = function(input, output) { 
    output$txtout <- renderText({ 
     paste(input$txt, input$slider, format(input$date), sep = ", ") 
    }) 
    output$table <- renderTable({ 
     head(cars, 4) 
    }) 
    } 
)