在 flexdashboard 中结合多个不同类型的页面 vertical_layout
Combine in flexdashboard with multiple pages different types of vertical_layout
我创建了一个包含多个页面的 flexdashboard 文档。我希望在第一页上显示 vetical_layout: fill
,但在第二页上我希望显示 vertical_layout: scroll
。我的文档是这样开头的:
---
title: "DASHBOARD"
output:
flexdashboard::flex_dashboard:
orientation: columns
logo: logo.png
vertical_layout: fill
---
如何才能看到带有 vertical_layout: scroll
的第二页?
您可以覆盖单个 (H2) 列的全局 vertical_layout
值。
---
title: "Changing Vertical Layout"
output:
flexdashboard::flex_dashboard:
orientation: columns
vertical_layout: fill
---
```{r setup, include=FALSE}
library(flexdashboard)
library(ggplot2)
```
Page 1
================================
Column {data-width=650}
-----------------------------------------------------------------------
### Panel A
```{r}
qplot(cars$speed)
qplot(cars$dist)
```
Column {data-width=350}
-----------------------------------------------------------------------
### Panel B
```{r}
qplot(cars$speed)
```
### Panel C
```{r}
qplot(cars$dist)
```
Page 2
================================
Column { vertical_layout: scroll}
-----------------------------------------------------------------------
### Panel A
```{r}
qplot(cars$speed)
qplot(cars$dist)
```
```{r}
qplot(cars$speed)
qplot(cars$dist)
```
```{r}
qplot(cars$speed)
qplot(cars$dist)
```
这是覆盖全局值的类似示例。 (但是 in this case,他们在页面 (H1) 级别更改方向)。
以下解决方案对我有用。在 YAML header 中,我使用 "vertical_layout: fill" 将默认行为设置为 "fill." 然后我在页面 header 和列 [=] 中使用以下 CSS 样式16=] 为需要滚动的页面。
Page 3 {style="position:relative;"}
========================================================
Column {style="height:100pc;"}
--------------------------------------------------------
### Chart A
``` {r}
```
### Chart B
``` {r}
```
我创建了一个包含多个页面的 flexdashboard 文档。我希望在第一页上显示 vetical_layout: fill
,但在第二页上我希望显示 vertical_layout: scroll
。我的文档是这样开头的:
---
title: "DASHBOARD"
output:
flexdashboard::flex_dashboard:
orientation: columns
logo: logo.png
vertical_layout: fill
---
如何才能看到带有 vertical_layout: scroll
的第二页?
您可以覆盖单个 (H2) 列的全局 vertical_layout
值。
---
title: "Changing Vertical Layout"
output:
flexdashboard::flex_dashboard:
orientation: columns
vertical_layout: fill
---
```{r setup, include=FALSE}
library(flexdashboard)
library(ggplot2)
```
Page 1
================================
Column {data-width=650}
-----------------------------------------------------------------------
### Panel A
```{r}
qplot(cars$speed)
qplot(cars$dist)
```
Column {data-width=350}
-----------------------------------------------------------------------
### Panel B
```{r}
qplot(cars$speed)
```
### Panel C
```{r}
qplot(cars$dist)
```
Page 2
================================
Column { vertical_layout: scroll}
-----------------------------------------------------------------------
### Panel A
```{r}
qplot(cars$speed)
qplot(cars$dist)
```
```{r}
qplot(cars$speed)
qplot(cars$dist)
```
```{r}
qplot(cars$speed)
qplot(cars$dist)
```
以下解决方案对我有用。在 YAML header 中,我使用 "vertical_layout: fill" 将默认行为设置为 "fill." 然后我在页面 header 和列 [=] 中使用以下 CSS 样式16=] 为需要滚动的页面。
Page 3 {style="position:relative;"}
========================================================
Column {style="height:100pc;"}
--------------------------------------------------------
### Chart A
``` {r}
```
### Chart B
``` {r}
```