Rmarkdown:在选项卡式部分下放置静态内容

时间:2017-05-02 14:19:58

标签: html r tabs knitr r-markdown

我希望能帮助将静态内容放在我的R markdown文件的标签部分下。它类似于这个问题:RMarkdown: Tabbed and Untabbed headings,但解决方案没有考虑目录中的空白行。

是否可以在不启动新部分的情况下结束选项卡部分?这是一个例子:

---
title: "Mtcars Example"
output: 
  html_document:
    toc: true
    toc_float: true
    number_sections: true
---

# Mtcars Info
The data was extracted from the 1974 Motor Trend US magazine..

# Dataset Prep
No changes were made to the dataset..

# Plots {.tabset .tabset-pills}
```{r results = 'hide', message = FALSE, fig.height = 5, fig.width = 5, echo = FALSE}
    plot1 <- ggplot(data = mtcars) + 
            geom_point(aes(x = mpg, y = hp))
    plot2 <- ggplot(data = mtcars) + 
            geom_point(aes(x = mpg, y = wt))
```  

## mpg vs hp  
```{r, echo = FALSE}
plot1
```  

## mpg vs wt  
```{r, echo = FALSE}
plot2
```  

#
The plots above show how mpg is related.. 

# Analysis
the mtcars dataset is a great exploratory dataset to show..

第3节是一个标签部分,允许用户在绘图之间切换。我想在它下面有静态文本。

问题是,在不启动新标题的情况下,只有在选择第二个选项卡时才能看到内容。不好。我可以通过启动一个新标题并将内容放在那里来解决这个问题。但是现在我在我的目录中有一个编号为4的部分是空白的。也不可取。

enter image description here

有什么方法可以解决这个问题吗?在Rmarkdown备忘单https://www.rstudio.com/wp-content/uploads/2016/03/rmarkdown-cheatsheet-2.0.pdf中,您可以使用###结束标签部分,但这似乎也不起作用。

1 个答案:

答案 0 :(得分:0)

我不确定任何内置解决方案。在这种情况下,我通常只使用jQuery。在这种情况下,它是一个单行。

可重复的例子:

---
title: "Mtcars Example"
output: 
  html_document:
    number_sections: true
---

<script>
$(document).ready(function() {
  $('#myDiv').appendTo('#first-tab-sec');
});
</script>

<div id="myDiv">a
The quick brown fox jumps over the lazy dog.
</div>

# Plots {.tabset .tabset-pills #first-tab-sec}

## mpg vs hp  
```{r, echo = FALSE}
plot(mtcars$mpg, mtcars$hp)
```  

## mpg vs wt  
```{r, echo = FALSE}
plot(mtcars$mpg, mtcars$wt)
```  

# Next Section

我们创建了一个ID为myDiv的div元素。在该元素内部,我们存储了内容,这些内容应该位于选项卡区域下方。

jQuery(JS)代码段执行以下操作:

文档一完成加载($(document).ready()),我们就会执行匿名function(){...}。在该函数内部,我们通过id获取div元素,并将其附加到标识为first-tab-sec的元素。

多个标签部分

如果我们有另一个标签部分,我们只需给它一个新的ID,例如second-tab-sec,然后添加代码

$('#mySecDiv').appendTo('#second-tab-sec');

到JS块。在这里,我们假设内容包含在ID为mySecDiv的div中。