首页 > 解决方案 > R flexdashboard垂直滚动切断图形

问题描述

我正在尝试制作一个垂直滚动的 flexdashboard。有时,垂直滚动无法正常工作,下图被截断。这可以通过使窗口变窄来“修复”,然后它会滚动,但显然这不是一个可接受的解决方案。

代码如下,以及滚动不良的屏幕截图。可以看到最终图形的内容被截断了。我还包含了所需滚动行为的图片。我知道代码片段有点长,但是当然滚动行为只有在适当数量的图表中才会显现出来。

这是所需的滚动行为:

正确的例子

这是获得的裁剪滚动条和隐藏图:

不好的例子

---
title: "Untitled"
output: flexdashboard::flex_dashboard
orientation: row
vertical_layout: scroll

---

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

dataset <- mtcars
```

Page 1
================================

Row
-----------------------------------------------------------------------


### ValueBox 1

```{r}
valueBox(42, caption = "my caption", icon = "fa-calendar")
```   
### ValueBox 2

```{r}
valueBox(250, caption = "my caption", icon = "fa-calendar")
``` 

### Additional Info


```{r}

sector_levels <- gaugeSectors(success = c(0, 40),
                              warning = c(40, 60),
                              danger = c(60, 100),
                              colors= c("red", "yellow", "green"))


g1 <- gauge(25, min = 0, max = 100, sectors = sector_levels)
g2 <- gauge(75, min = 0, max = 100, sectors = sector_levels)

g1
g2
```
###  Chart B 
```{r}
color_map <- c("4" = "red", "6" = "green", "8"  ="blue")


plot1 <- plot_ly(data = dataset, x = ~dataset$cyl, color = ~as.factor(cyl), colors = color_map,
  type = "histogram")

plot1 <- plot1 %>% layout(legend = c, xaxis = list(title = "Also a Test"))

plot1
```

标签: rflexdashboard

解决方案


如果有人感兴趣,我已经通过在 CSS 中应用最小高度值来管理解决方法。所需的 CSS 代码是:

.chart-stage-flex{
  min-height: 500px;
}

这可能是一个 hack,但似乎按预期工作。


推荐阅读