我想使用radioButtons创建一个带有工具提示的shinyBS小部件。我想要实现的是在tooltip中创建一个带有3个具有不同信息的按钮的小部件。基于此solution，它创建了3个具有不同id值的单独单选按钮。
是否有可能做同样的事情，但有一个带3个按钮的无线电小部件（即有一个id值）？
library(shiny)
library(shinyBS)
ui <- shinyUI(
fluidPage(
fluidRow(
column(3,
HTML("<div class='container'><br>
<h1>Test</h1>
<div>
<label id='radio_venue_1'>
<input type='radio' value='1' role='button'> button 1
</label>
</div>
<div>
<label id='radio_venue_2'>
<input type='radio' value='2' role='button'> button 2
</label>
</div>
<div>
<label id='radio_venue_3'>
<input type='radio' value='3' role='button'> button 3
</label>
</div>
</div>")),
bsTooltip(id = "radio_venue_1", title = "Button 1 Explanation", placement = "right", trigger = "hover"),
bsTooltip(id = "radio_venue_2", title = "Button 2 Explanation", placement = "right", trigger = "hover"),
bsTooltip(id = "radio_venue_3", title = "Button 3 Explanation", placement = "right", trigger = "hover"),
column(9,'Plot')
)
)
)
server <- function(input, output, session) {}
shinyApp(ui = ui, server = server)
答案 0 :(得分：5)
迟到的答案，但在这里：
如您所见，shinyBS的工具提示功能仅用于按ID选择。你想要比这更精细的东西，所以我们需要构造一些新函数来取代更粗糙的bsTooltip。
新功能称为radioTooltip，基本上是bsTooltip的一个冲突。需要再提出一个论点，即您希望将工具提示分配给choice的{{1}}。这允许更精细的选择。现在的区别在于在文档上选择元素的方式。在不过多介绍JavaScript细节的情况下，我们选择具有给定Id的元素并按住提供的radioButton radioButton（内部的那个，因此使用choice得到的值）。< / p>
以下代码。我建议你尝试一下。
input$radioButtonId玩得开心！
对于library(shiny)
library(shinyBS)
radioTooltip <- function(id, choice, title, placement = "bottom", trigger = "hover", options = NULL){
options = shinyBS:::buildTooltipOrPopoverOptionsList(title, placement, trigger, options)
options = paste0("{'", paste(names(options), options, sep = "': '", collapse = "', '"), "'}")
bsTag <- shiny::tags$script(shiny::HTML(paste0("
$(document).ready(function() {
setTimeout(function() {
$('input', $('#", id, "')).each(function(){
if(this.getAttribute('value') == '", choice, "') {
opts = $.extend(", options, ", {html: true});
$(this.parentElement).tooltip('destroy');
$(this.parentElement).tooltip(opts);
}
})
}, 500)
});
")))
htmltools::attachDependencies(bsTag, shinyBS:::shinyBSDep)
}
ui <- shinyUI(
fluidPage(
fluidRow(
column(3,
radioButtons("radioSelection", label = "So many options!", choices = c("A", "B", "C"))
),
radioTooltip(id = "radioSelection", choice = "A", title = "Button 1 Explanation", placement = "right", trigger = "hover"),
radioTooltip(id = "radioSelection", choice = "B", title = "Button 2 Explanation", placement = "right", trigger = "hover"),
radioTooltip(id = "radioSelection", choice = "C", title = "Button 3 Explanation", placement = "right", trigger = "hover"),
column(9,'Plot')
)
)
)
server <- function(input, output, session) {}
shinyApp(ui = ui, server = server)
，不能只改变一点，但必须有一个全新的功能。主要有一个原因。虽然selectInput的所有选择都明显可见，但radioButtons移动选择，重新渲染它们，仅在首次显示时呈现它们，依此类推。很多事情都发生了。这就是为什么这个解决方案抓住周围的selectizeInput并不断倾听被添加的div的原因。其余的只是（希望有效）过滤。
以下示例代码：
childNodes请注意，工具提示也会存在library(shiny)
library(shinyBS)
selectizeTooltip <- function(id, choice, title, placement = "bottom", trigger = "hover", options = NULL){
options = shinyBS:::buildTooltipOrPopoverOptionsList(title, placement, trigger, options)
options = paste0("{'", paste(names(options), options, sep = "': '", collapse = "', '"), "'}")
bsTag <- shiny::tags$script(shiny::HTML(paste0("
$(document).ready(function() {
var opts = $.extend(", options, ", {html: true});
var selectizeParent = document.getElementById('", id, "').parentElement;
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation){
$(mutation.addedNodes).filter('div').filter(function(){return(this.getAttribute('data-value') == '", choice, "');}).each(function() {
$(this).tooltip('destroy');
$(this).tooltip(opts);
});
});
});
observer.observe(selectizeParent, { subtree: true, childList: true });
});
")))
htmltools::attachDependencies(bsTag, shinyBS:::shinyBSDep)
}
ui <- shinyUI(
fluidPage(
actionButton("but", "Change choices!"),
selectizeInput(inputId = "lala", label = "Label!", choices = LETTERS),
selectizeTooltip(id = "lala", choice = "c", title = "Tooltip for c", placement = "right"),
selectizeTooltip(id = "lala", choice = "C", title = "Tooltip for C", placement = "right"),
selectizeTooltip(id = "lala", choice = "F", title = "Tooltip for F", placement = "right")
)
)
server <- function(input, output, session){
observeEvent(input$but, {
updateSelectizeInput(session, "lala", choices = c("C", letters))
})
}
shinyApp(ui, server)
，并且可能存在最初不存在的选项的工具提示。
如果有兴趣的话，我可以向有光泽的人发送功能请求，以便将其纳入他们的工作中。