[英]R shiny: Add weblink to actionButton
I have a box in my shiny application that has a button included within a shiny dashboard box like this:我的 shiny 应用程序中有一个框,其中包含一个包含在 shiny 仪表板框内的按钮,如下所示:
shiny::fluidRow(
shinydashboard::box(title = "Intro Page", "Some description...",
shiny::actionButton(inputId='ab1', label="Learn More", icon = icon("th"))
)
)
I want to include a weblink in the button such that when I click on it, it should open the corresponding webpage in a new tab.我想在按钮中包含一个网络链接,这样当我点击它时,它应该在新选项卡中打开相应的网页。
I know that I can do this instead:我知道我可以这样做:
# this does not create a submit button though, it just creates a link.
tags$div(class = "submit",
tags$a(href = "www.google.com",
"Learn More",
target="_blank")
)
But with actionButton, there is a nice button and I can add an icon to it which looks aesthetically better.但是对于 actionButton,有一个漂亮的按钮,我可以向它添加一个看起来更美观的图标。
How do I add a link to actionButton in shiny?如何在 shiny 中添加指向 actionButton 的链接?
You can add the parameter您可以添加参数
onclick ="location.href='http://google.com';"
To the action button and clicking it will take you to google.com in the current window or you can add到操作按钮并单击它会将您带到当前窗口中的 google.com 或者您可以添加
onclick ="window.open('http://google.com', '_blank')"
and you will be taken to Google in a new tab您将在新标签页中转到 Google
That is那就是
shiny::fluidRow(
shinydashboard::box(title = "Intro Page", "Some description...",
shiny::actionButton(inputId='ab1', label="Learn More",
icon = icon("th"),
onclick ="window.open('http://google.com', '_blank')")
)
)
The onclick
method is simple but it rely javascript. onclick
方法很简单,但它依赖于 javascript。 More importantly, it'll be awkward if you want to generate the link dynamically.更重要的是,如果你想动态生成链接会很尴尬。 I want to have a link in my app that open specific page according to user input, and I found you can just dress a link as a button.我想在我的应用程序中有一个根据用户输入打开特定页面的链接,我发现您可以将链接装扮成一个按钮。
First I deal with the dynamical part with uiOutput
and renderUI
, because the link can only be generated in server part.首先我用uiOutput
和renderUI
处理动态部分,因为链接只能在服务器部分生成。 The simple link will be简单的链接将是
a(h4("Open Link"), target = "_blank", href = paste0("http://www.somesite/", some_link))
Just run this line in R we get只需在 R 中运行这一行,我们就会得到
<a target="_blank" href="http://www.somesite/somelink">
<h4>Open Link</h4>
</a>
To create a button we can look at what an action button look like.要创建按钮,我们可以查看操作按钮的外观。
> actionButton("download", "Download Selected",
icon = icon("cloud-download"))
<button id="download" type="button" class="btn btn-default action-button">
<i class="fa fa-cloud-download"></i>
Download Selected
</button>
Then we can do this然后我们可以这样做
shiny::a(h4("Open Link", class = "btn btn-default action-button" ,
style = "fontweight:600"), target = "_blank",
href = paste0("http://www.somesite/", some_link))
to get得到
<a target="_blank" href="http://www.somesite/some_link">
<h4 class="btn btn-default action-button" style="fontweight:600">Open Link</h4>
</a>
Now we have a link that looks like a button, and you can further customize its style either with style parameter or customized css.现在我们有一个看起来像按钮的链接,您可以使用样式参数或自定义 css 进一步自定义其样式。 Open your app with chrome/firefox developer tools, modify the css to the effect you want, then add the modified css to style.css
in www folder to override the default style.用chrome/firefox开发者工具打开你的app,将css修改成你想要的效果,然后将修改后的css添加到www文件夹的style.css
中,覆盖默认样式。
If you look at the output of many html tags function, you will find you can actually combine and assemble lots of stuff together to get a lot of customizations.如果您查看许多 html 标签函数的输出,您会发现您实际上可以将很多东西组合和组装在一起以获得很多自定义。
Building on @dracodoc's point about dynamically generated links, you can use renderUI
to achieve the desired effect.基于@dracodoc 关于动态生成链接的观点,您可以使用renderUI
来实现所需的效果。 In the example below, input$open_tab
refers to a generic actionButton.在下面的例子中, input$open_tab
指的是一个通用的 actionButton。 Note that you still have to include a reference to the renderUI below in your UI (ie, uiOutput("ui_open_tab"))请注意,您仍然必须在您的 UI 中包含对下面的 renderUI 的引用(即 uiOutput("ui_open_tab"))
output$ui_open_tab <- renderUI({
req(input$open_tab > 0)
link <- function_to_build_the_link(a, b, c)
tags$script(paste0("window.open('", link, "', '_blank')"))
})
I wanted to combine the multiple questions/answers with my own reproducible example.我想将多个问题/答案与我自己的可重现示例结合起来。 This combines Marsenau, dracodoc, and Vincent's answer.这结合了 Marsenau、dracodoc 和 Vincent 的回答。 And responds to Captain Hat's comment.并回应帽子船长的评论。
UI side用户界面端
uiOutput("ui_open_tab_button")
Server-side (where input$slider is an example of a dynamic element)服务器端(其中 input$slider 是动态元素的示例)
output$ui_open_tab_button <- renderUI({
shiny::a(
h4(icon("th"),
paste0("Wiki Link Number: ",input$slider),
class = "btn btn-default action-button",
style = "fontweight:600"),
target = "_blank",
href = paste0("https://en.wikipedia.org/wiki/",input$slider)
)
})
library("shiny")
library("shinydashboard")
ui <- dashboardPage(
dashboardHeader(title = "Basic dashboard"),
dashboardSidebar(
sliderInput("slider", "Wiki Link Control", 1, 10, 1)
),
dashboardBody(
box(title = "UI Only Link", p("From Marsenau... Uses onclick"),
actionButton(
inputId='ab2',
label="Wiki Main Link",
icon = icon("th"),
onclick=paste0("window.open('https://en.wikipedia.org/wiki/','_blank')")
)
),
box(title = "Dynamic link", p("From dracodoc and Vincent... answers Captain Hat's question"),
uiOutput("ui_open_tab_button")
),
fluidRow(
htmlOutput("wiki")
)
)
)
server <- function(input, output) {
output$ui_open_tab_button <- renderUI({
shiny::a(
h4(icon("th"),
paste0("Wiki Link Number: ",input$slider),
class = "btn btn-default action-button",
style = "fontweight:600"),
target = "_blank",
href = paste0("https://en.wikipedia.org/wiki/",input$slider)
)
})
output$wiki <- renderUI({
tags$iframe(src=paste0("https://en.wikipedia.org/wiki/",input$slider), height=1000, width="100%")
})
}
shinyApp(ui, server, options = list(launch.browser=T))
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.