r - 如何使用反应数据在闪亮的应用程序中更改 flexdashbord::gauge 的标签？

Question

我希望仪表标签在值更改时更改。

我创建了f_3函数来尝试调整它，但没有成功。

我的rmarkdown代码：

---
title: "Label of gauge"
runtime: shiny
output: 
  flexdashboard::flex_dashboard:
    orientation: rows
    vertical_layout: fill
    theme: yeti
---

side{.sidebar}
-------------------------------------------

```{r}
library(tibble)
library(shiny)
library(shinyWidgets)
library(flexdashboard)
```

**Analysis**

```{r}
autonumericInput(
    inputId = "a", 
    value = 10, 
    label = "Value 1", 
    align = "center", 
    currencySymbol = "$", 
    currencySymbolPlacement = "p",
    digitGroupSeparator = ".",
    decimalCharacter = ",", 
    decimalPlaces = 0, 
    minimumValue = 0, 
    maximumValue = 100
)

autonumericInput(
    inputId = "b", 
    value = 10, 
    label = "Value 2", 
    align = "center", 
    currencySymbol = "R$", 
    currencySymbolPlacement = "p", 
    digitGroupSeparator = ".",
    decimalCharacter = ",", 
    decimalPlaces = 0, 
    minimumValue = 0, 
    maximumValue = 100
    )
```

```{r}
f_1 <- function(a, b) {
  a + b
}

reac <- reactive({
  tibble(
    a = input$a, 
    b = input$b
  )
})

pred <- reactive({
  temp <- reac()
  f_1(
    a = input$a, 
    b = input$b
  )
})
```

abc{}
--------------------------------------

###
```{r}
f_3 <- function(x) {
  if (x <= 40) {
    "Danger"
  } else if (x <= 80) {
    "Warning"
  } else ("Success")
}

renderGauge({
  gauge(
    value = round(x = pred(), digits = 0), min = 0, max = 100, symbol = "%", 
    label = f_3(x = pred())
    )
})
```

标签的值始终显示为Danger，即使值发生更改。随着价值的变化，你能做些什么来改变它？

标签： rshinyflexdashboard

Answer 1

这对我来说就像一个错误。您可以在 {flexdashboard} github 中打开一个问题并告诉他们修复它。

同时，我有一个解决方法给你。这需要你对 Shiny 有一些深入的了解，我想这超出了你目前所学的范围，所以我就不详细解释了。如果您有兴趣，请阅读这篇文章。简单来说，我们编写自己的 Shiny 方法来与 Web UI 通信并更新 UI。

---
title: "Label of gauge"
runtime: shiny
output: 
  flexdashboard::flex_dashboard:
    orientation: rows
    vertical_layout: fill
    theme: yeti
---

side{.sidebar}
-------------------------------------------

```{r}
library(tibble)
library(shiny)
library(shinyWidgets)
library(flexdashboard)
```

**Analysis**

```{r}
autonumericInput(
    inputId = "a", 
    value = 10, 
    label = "Value 1", 
    align = "center", 
    currencySymbol = "$", 
    currencySymbolPlacement = "p",
    digitGroupSeparator = ".",
    decimalCharacter = ",", 
    decimalPlaces = 0, 
    minimumValue = 0, 
    maximumValue = 100
)

autonumericInput(
    inputId = "b", 
    value = 10, 
    label = "Value 2", 
    align = "center", 
    currencySymbol = "R$", 
    currencySymbolPlacement = "p", 
    digitGroupSeparator = ".",
    decimalCharacter = ",", 
    decimalPlaces = 0, 
    minimumValue = 0, 
    maximumValue = 100
    )
```

```{r}
f_1 <- function(a, b) {
  a + b
}

reac <- reactive({
  tibble(
    a = input$a, 
    b = input$b
  )
})

pred <- reactive({
  temp <- reac()
  f_1(
    a = input$a, 
    b = input$b
  )
})
```

abc{}
--------------------------------------

###
<div id="gauge">

```{r}
f_3 <- function(x) {
  if (x <= 40) {
    "Danger"
  } else if (x <= 80) {
    "Warning"
  } else "Success"
}

renderGauge({
    session$sendCustomMessage("gauge-text",list(text = f_3(x = pred())))
  gauge(
    value = round(x = pred(), digits = 0), min = 0, max = 100, symbol = "%",
    label = "Danger"
    )
})
```

<script>
Shiny.addCustomMessageHandler('gauge-text', data=>{
    document.querySelector('#section-gauge svg text[font-size="10px"] tspan').innerHTML = data.text 
})
</script>
</div>