如何在 Rmarkdown HTML 中并排显示 2 个 flexdashboard 仪表?
How to display 2 flexdashboard gauges side by side in Rmarkdown HTML?
我有两个 flexdashboard
仪表,我想在 Rmarkdown -> html 文件中绘制 side-by-side。该文件 NOT 是一个 flexdashboard,只是想使用该包中的漂亮仪表。
---
title: "Eye Gaugeing"
author: "Databot"
date: "10/24/2016"
output: html_document
fig_caption: yes
---
```{r setup, include=FALSE}
library(flexdashboard)
gauge1_data <- 95
gauge2_data <- 63
max_data <- 100
```
## Gauges
```{r gauge, fig.width=2, fig.height=2, fig.cap='Cap1'}
gauge(round(100*(1.0*gauge1_data)/max_data,2),0,100, symbol = '%', label= "Non-Stops: Tile 1", gaugeSectors(
success = c(80, 100), warning = c(40, 79), danger = c(0, 39)))
```
```{r gauge2, fig.width=2, fig.height=2, fig.cap='Cap1'}
p0 <- gauge(round(100*(1.0*gauge2_data)/max_data,2),0,100, symbol = '%', label= "Full Cabin Match: Tile 1", gaugeSectors(
success = c(80, 100), warning = c(40, 79), danger = c(0, 39)))
```
我喜欢大仪表,我不能撒谎。
令人惊讶的是,我很难将它们并排放置。
尝试使用 library(gridExtra)
但它只喜欢安排名为 grobs
的东西。仪表为 class htmlwidget
& gauge
。
还尝试了 {r out.width=c('500px', '300px'), fig.show='hold'}
并将它们塞入同一个块中,但出现错误。
如果有任何建议,我将不胜感激。
flexdashboard 中的仪表专门用于 flexdashboard 布局系统,在其他格式中通常不会像预期的那样工作(这就是为什么小部件是 flexdashboard 的一部分而不是独立包中的原因)。
您可以通过使用 HTML/Bootstrap framework:
创建两列来使仪表并排显示
## Gauges
<div class = "row">
<div class = "col-md-6">
<center>
```{r gauge, fig.width=2, fig.height=2}
gauge(round(100*(1.0*gauge1_data)/max_data,2),0,100, symbol = '%', label= "Non-Stops: Tile 1", gaugeSectors(
success = c(80, 100), warning = c(40, 79), danger = c(0, 39)))
```
</center>
</div>
<div class = "col-md-6">
<center>
```{r gauge2, fig.width=2, fig.height=2}
gauge(round(100*(1.0*gauge2_data)/max_data,2),0,100, symbol = '%', label= "Full Cabin Match: Tile 1", gaugeSectors(
success = c(80, 100), warning = c(40, 79), danger = c(0, 39)))
```
</center>
</div>
</div>
我有两个 flexdashboard
仪表,我想在 Rmarkdown -> html 文件中绘制 side-by-side。该文件 NOT 是一个 flexdashboard,只是想使用该包中的漂亮仪表。
---
title: "Eye Gaugeing"
author: "Databot"
date: "10/24/2016"
output: html_document
fig_caption: yes
---
```{r setup, include=FALSE}
library(flexdashboard)
gauge1_data <- 95
gauge2_data <- 63
max_data <- 100
```
## Gauges
```{r gauge, fig.width=2, fig.height=2, fig.cap='Cap1'}
gauge(round(100*(1.0*gauge1_data)/max_data,2),0,100, symbol = '%', label= "Non-Stops: Tile 1", gaugeSectors(
success = c(80, 100), warning = c(40, 79), danger = c(0, 39)))
```
```{r gauge2, fig.width=2, fig.height=2, fig.cap='Cap1'}
p0 <- gauge(round(100*(1.0*gauge2_data)/max_data,2),0,100, symbol = '%', label= "Full Cabin Match: Tile 1", gaugeSectors(
success = c(80, 100), warning = c(40, 79), danger = c(0, 39)))
```
令人惊讶的是,我很难将它们并排放置。
尝试使用 library(gridExtra)
但它只喜欢安排名为 grobs
的东西。仪表为 class htmlwidget
& gauge
。
还尝试了 {r out.width=c('500px', '300px'), fig.show='hold'}
并将它们塞入同一个块中,但出现错误。
如果有任何建议,我将不胜感激。
flexdashboard 中的仪表专门用于 flexdashboard 布局系统,在其他格式中通常不会像预期的那样工作(这就是为什么小部件是 flexdashboard 的一部分而不是独立包中的原因)。
您可以通过使用 HTML/Bootstrap framework:
创建两列来使仪表并排显示## Gauges
<div class = "row">
<div class = "col-md-6">
<center>
```{r gauge, fig.width=2, fig.height=2}
gauge(round(100*(1.0*gauge1_data)/max_data,2),0,100, symbol = '%', label= "Non-Stops: Tile 1", gaugeSectors(
success = c(80, 100), warning = c(40, 79), danger = c(0, 39)))
```
</center>
</div>
<div class = "col-md-6">
<center>
```{r gauge2, fig.width=2, fig.height=2}
gauge(round(100*(1.0*gauge2_data)/max_data,2),0,100, symbol = '%', label= "Full Cabin Match: Tile 1", gaugeSectors(
success = c(80, 100), warning = c(40, 79), danger = c(0, 39)))
```
</center>
</div>
</div>