R Shiny 不显示悬停工具提示的原始 HTML 和 CSS 代码答案

【问题标题】：RShiny not displaying raw HTML and CSS code for hover tooltipR Shiny 不显示悬停工具提示的原始 HTML 和 CSS 代码
【发布时间】：2020-08-04 16:45:54
【问题描述】：

所以基本上我想在我的 RShiny 应用程序中的一些文本上实现一个工具提示，并尝试使用原始 HTML 和 CSS 样式来实现。我对 HTML 尤其是 CSS 没有太多经验，也没有将它们包含在 Shiny 应用程序中，而是使用下面的代码（并尝试将原始 CSS 与在任何 HTML 编辑器中工作的 HTML 粘贴，也尝试 htmlOutput()）那里是没有输出。我想我想知道 RShiny 在包含 HTML 和 CSS 方面有什么限制，并且 CSS 工具提示是它不接受的元素。如果答案没有限制，那么这种方法可能会出错。

library(shiny)

ui <- fluidPage(
  tags$head(
          tags$style(HTML(".tooltip {
                    position: relative;
                    display: inline-block;
                    }

                    .tooltip .tooltiptext {
                    visibility: hidden;
                    width: 120px;
                    background-color: blue;
                    color: #fff;
                    text-align: center;
                    border-radius: 6px;
                    padding: 5px 0;

                    position: absolute;
                    z-index: 1;
                    }

                    .tooltip:hover .tooltiptext {
                    visibility: visible;
                    }")
                     )
          ),
  uiOutput("html")
)

server <- function(input, output) {
   output$html <- renderUI({
     HTML('
          <body style="text-align:center;">
          <p class="tooltip">TEXT
            <span class="tooltiptext">Tooltip text</span>
          </p>
          </body>
          ')
   })
}

shinyApp(ui = ui, server = server)

【问题讨论】：

标签： html css r shiny

【解决方案1】：

这是因为 tooltip 类已经在 Shiny 中定义了。否则，您的代码是正确的。所以使用另一个名字，例如mytooltip。另外，不要在 HTML 中使用body 标签，body 标签已经存在，而且它必须是唯一的。

【讨论】：

【解决方案2】：

通过 shinyBS 包在闪亮中执行工具提示的一种简单方法。

https://ebailey78.github.io/shinyBS/index.html

【讨论】：