排版
关于仪表盘布局的总体规则是：
- 一级标题：生成页面；
- 二级标题：生成列（或行）；
- 三级标题：生成框（包含一个或多个仪表盘组件）。
下面给出一个简单的例子：
--- title: "Get Started" output: flexdashboard::flex_dashboard --- ```{r setup, include=FALSE} library(flexdashboard) ``` Column 1 -------------------------------------------------- ### Chart A ```{r} ``` Column 2 -------------------------------------------------- ### Chart B ```{r} ``` ### Chart C ```{r} ```
请注意，第一行文本（Coluumn 1）下的一系列破折号是第二级标题的另一种 Markdown 语法形式，即
Column 1 --------------------------------------------------
等同于
## Column 1
我们使用了一系列的破折号，只是为了让第二节在源文档中更为显眼罢了。
默认情况下，二级标题在仪表板上生成列，三级标题在列中垂直堆叠。所以在默认情况下，你不必在仪表盘上设置列，因为它默认会一列一列的垂直堆放显示。
注：二级标题的内容将不会显示在输出中。二级标题仅用于布局（例如，例子中的Column 1不会显示在输出中），因此标题的实际内容一点都不重要。相比之下，一级标题和三级标题更加重要。
下图显示了上述示例的结果，一共是两列，第一列为 “Chart A”，第二列为 “Chart B” 和 “Chart C”。
注：在这个例子中，我们没有在代码块中加入任何 R 代码，所以所有的框都是空的。当然在实际使用中，你可以编写任意的 R 代码来生成 R 图、HTML 小部件并将其加入到这些“盒子”中。
1.基于行的布局
通过修改 orientation 选项将默认以列导向的布局改为以行导向的布局，例如：
output: flexdashboard::flex_dashboard: orientation: rows
这时二级结构中将会按照行进行排列，三级结构中会按照行中的列进行堆叠。我们将上述例子修改后，输出结果如图下所示：
2.节属性
二级结构头部还可以加入一些属性，例如：设置列宽度为350：
A narrow column {data-width=350} --------------------------------
在基于行布局的情况下，可以为行设置 data-height 属性。而基于列布局的情况下，可以使用 {.tabset} 使得三级结构以制表符的形式排列，例如：
Two tabs {.tabset} ------------------ ### Tab A ### Tab B
所得结果如图下所示
![EF%W]I@T_26H7H3Z8GCR}H2.png](https://ucc.alicdn.com/pic/developer-ecology/2b1e6d6923a84f6788d3062e7a8b69c4.png?x-oss-process=image/resize,w_1400/format,webp "EF%W]I@T_26H7H3Z8GCR}H2.png")
3.多页
如果 rmd 文档中有多个一级结构的内容时，这时仪表盘会将每个一节结构分别显示为单独页面。下面给出一个简单的例子：
--- title: "Multiple Pages" output: flexdashboard::flex_dashboard --- Visualizations {data-icon="fa-signal"} ===================================== ### Chart 1 ```{r} ``` ### Chart 2 ```{r} ``` Tables {data-icon="fa-table"} ===================================== ### Table 1 ```{r} ``` ### Table 2 ```{r} ```
所得结果如图下所示：
注：一系列等号是一级标题的另一种 Markdown 语法（也可以使用单个井号
#表示）。
从图中我们可以看到：页面标题显示在仪表盘顶部的导航菜单中。一级结构单独构成一个页面。
本例中，我们还做了一个小拓展，通过 data-icon 属性将图标应用于页面标题中。当然，你可以从该网址 https://fontawesome.com 找到其他可用的图标。
4.故事板
除了基于列或行布局外，你还可以通过故事板（"storyboard"）进行布局，呈现一些可视化图形或其他说明。
下面给出一个简单的例子：
--- title: "Storyboard Commentary" output: flexdashboard::flex_dashboard: storyboard: true --- ### A nice scatterplot here ```{r} plot(cars, pch = 20) grid() ``` --- Some commentary about Frame 1. ### A beautiful histogram on this board ```{r} hist(faithful$eruptions, col = 'gray', border = 'white', main = '') ``` --- Some commentary about Frame 2.`r xfun::file_string('examples/dashboard/03-storyboard.Rmd')`
如图所示，你可以通过顶部的左右导航按钮来浏览所有故事板内容。
