Question

我正在尝试使用flexdashboard::gauge，但它总是大小相同（不会缩放），我不知道如何更改它的大小。我知道有一种方法可以使用renderPlot和例如height设置普通图。有没有办法与renderGauge做类似的事情？

这是我的代码：

---
title: "Test"
output: 
  flexdashboard::flex_dashboard:
    orientation: columns
    vertical_layout: fill
runtime: shiny    
---



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


Column {.sidebar}
-----------------------------------------------------------------------

```{r}
selectInput("n", label = "Number of bins:",
            choices = c(10, 20, 35, 50), selected = 20)
```



Column {data-width=500}
-----------------------------------------------------------------------


### Gauge

```{r}
renderGauge({
    invalidateLater(1000, session)
    dane <- round(runif(1,0,100))
    df <- data.frame(Label = "IRR", Value = as.numeric(dane))
    gauge(dane, min = 0, max = 100, symbol = '%', gaugeSectors(
  success = c(80, 100), warning = c(40, 79), danger = c(0, 39)
))
  })

```

### Chart A

```{r }
renderPlot({
  plot(1:10,1:10)
})
```


Column {data-width=500}
-----------------------------------------------------------------------

### Chart B

```{r}
renderPlot({
  plot(1:10,1:10)
})
```

### Chart C

```{r}
renderPlot({
  plot(1:10,1:10)
})
```

其余图表将填补这个空缺。你知道如何让这个规格更大吗？谢谢！

Answer 1

毕竟这可能并不难。真正的问题似乎出在justgage.css上，它将高度固定为160px 。您可以通过添加自定义css来覆盖它，例如，通过以下方式：

文件extra.css：

.html-widget.gauge {
  height: 100%; /*or try sth like 320px instead of 100%, whatever you prefer*/
}

.html-widget.gauge svg {
  height: 100%; /*or try sth like 320px instead of 100%, whatever you prefer*/
  margin-top: -10px;
  margin-bottom: -40px;
}

然后编辑文档的 yaml标头，如下所示：

---
title: "Test"
output: 
  flexdashboard::flex_dashboard:
    orientation: columns
    vertical_layout: fill
    css: extra.css
runtime: shiny
---

这希望文件extra.css与主文档位于同一目录中。

在R中缩放flexdashboard gauge

1 个答案: