【问题标题】:In flexdashboard, can a valueBox be clicked to update a text box like an actionButton?在 flexdashboard 中,可以点击 valueBox 来更新像 actionButton 这样的文本框吗?
【发布时间】:2019-11-09 16:17:10
【问题描述】:

我正在尝试在flexdashboard 中使用valueBox 来显示标题图。但是,我还希望 valueBoxactionButton 一样工作,因为单击 valueBox 应该会触发仪表板中其他地方的操作。

在检查flexdashboard 文档时,我看到valueBox 的以下相关位:

链接值框

valueBox(42, icon = "fa-pencil", href="#details")

点击valueBox 会将用户导航到带有“#details”锚点的不同页面。但是,没有任何迹象表明单击valueBox 可用于其他操作。

下面是一个最小的相关 flexdashboard 代码

---
title: "valueBox Links"
output: 
  flexdashboard::flex_dashboard:
runtime: shiny
---

```{r setup, include=FALSE}
library(flexdashboard)

    ```

Tab 1 - Test
======================================================================

Column 
-------------------------------------

#### Three valueBoxes

### valueBox 1
```{r}
valueBox(1)
    ```

### valueBox 2
```{r}
valueBox(2)
    ```

### valueBox 3
```{r}
valueBox(3)
    ```

Column
-------------------------------------

### Text output
This is where I want some text to show up dynamically, depending on if the user has clicked valueBox 1, 2, or 3.  

任何帮助将不胜感激:)

【问题讨论】:

  • 这个问题可能会有所帮助:stackoverflow.com/questions/34413137/…
  • 这是一个很好的线索,但不幸的是它适用于 shinyDashboard。无法在 flexDashboard 上复制它。
  • 让actionButtons看起来像valueBoxes怎么样?
  • 我喜欢 valueBoxes 背景颜色和图标可以根据输入值变化。有什么方法可以用 actionButtons 复制它?
  • 因为它不是一个完整的答案,所以我做了一个小要点来展示如何改变闪亮应用中的动作按钮。 Gist example

标签: r shiny flexdashboard


【解决方案1】:

我为valueBox 尝试了不同的参数,但没有任何运气。最后我设法通过将actionButtons 放在valueBoxes 的标题中来解决它,然后使用自定义样式使其透明并扩展它们以覆盖整个valueBox。看起来像这样,点击每个valueBox 在“文本输出”下呈现不同的文本:

我添加了颜色和图标以突出显示valueBoxes 可以正常设置样式。它只使用 flexdashboard 库,并且完全响应。代码如下:

---
title: "valueBox Links"
output: 
  flexdashboard::flex_dashboard:
runtime: shiny
---

```{r setup, include=FALSE}
library(flexdashboard)
```

Tab 1 - Test
======================================================================

Column 
-------------------------------------

#### Three valueBoxes

### valueBox 1
```{r}
valueBox(1, caption = paste("I'm clickable!", actionButton("button1", " ", style = "background-color:rgba(39, 128, 227, 0.0); border-color:rgba(39, 128, 227, 0.0); position: absolute; overflow: hidden; left: 0px; top: 0px; right: 0px; bottom: 0px; width:100%")), icon = "fa-thumbs-up", color = "success")
```

### valueBox 2
```{r}
valueBox(2, caption = paste("I'm clickable too!", actionButton("button2", " ", style = "background-color:rgba(39, 128, 227, 0.0); border-color:rgba(39, 128, 227, 0.0); position: absolute; overflow: hidden; left: 0px; top: 0px; right: 0px; bottom: 0px; width:100%")), icon = "fa-tag", color = "warning")
```

### valueBox 3
```{r}
valueBox(3, caption = paste("ME TOO!", actionButton("button3", " ", style = "background-color:rgba(0, 0, 0, 0.0); border-color:rgba(0, 0, 0, 0.0); position: absolute; overflow: hidden; left: 0px; top: 0px; right: 0px; bottom: 0px; width:100%")), icon = "fa-random", color = "danger")
```

Column
-------------------------------------

### Text output
```{r}
textOutput("textout")

rv <- reactiveValues(data = NULL)

observeEvent(input$button1, {
rv$data <- "There are two types of people in the world: 1) Those who can extrapolate from incomplete data."
})

observeEvent(input$button2, {
rv$data <- "If you live to be one hundred, you’ve got it made. Very few people die past that age."
})

observeEvent(input$button3, {
rv$data <- "A statistician’s wife had twins. He was delighted. He rang the minister who was also delighted. “Bring them to church on Sunday and we’ll baptize them,” said the minister. “No,” replied the statistician. “Baptize one. We’ll keep the other as a control."
})  

output$textout <- renderText({
  rv$data
})
```

【讨论】:

    猜你喜欢
    • 2022-01-07
    • 2016-11-27
    • 2021-05-06
    • 2021-11-08
    • 1970-01-01
    • 2019-03-24
    • 2021-07-01
    • 2018-10-04
    • 2019-07-11
    相关资源
    最近更新 更多