R flexdashboard 去除标题栏

8

顶部蓝色条,用于标题

我正在使用rStudioflexdashboard包来完成一个rMarkdown项目。一切都进展顺利。但我想删除您在此处图像顶部看到的蓝色标题栏。

我们将此html页面放入窗口中,因此它变成了第二个标题栏,看起来很糟糕。在flexdashboard中是否有一个功能可以删除整个设备?

这是YAML和您在照片中的蓝色栏下面看到的第一个块。任何建议都将不胜感激。

---
title: New Hampshire Statewide Age Adjusted Incedence Rates of Lyme
output: 
  flexdashboard::flex_dashboard:
    orientation: rows
---

```{r setup, include=FALSE, message=FALSE, warning=FALSE, echo=TRUE}

```

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

### 
```{r, aarState, message=FALSE, warning=FALSE}

library(flexdashboard)
library(rbokeh)
#load state-wide age adjusted rates

aar<-read.csv("stateAAR.csv")
figure(title=" Age Adjusted Rates by Year",width= 1500, height =600) %>%
  ly_segments(year, lci*100000, year, uci*100000, data=aar, color = "#b37700", width = 1) %>%
  ly_points(year, adj.rate*100000, glyph = 21, size=6, data = aar, hover= "<strong>Rate per 100,000:</strong> @rateHundThou </br> <strong>Upper Confidence:</strong> @uciHT </br><strong> Lower Confidence:</strong> @lciHT " , color="#666622" )%>%

  x_axis(label ='Year')%>%
  y_axis(label ='Age Adjusted Rate')


```  

Row
2个回答

9
你可以直接将 CSS 样式添加到你的 Markdown 文档中(不需要 JQuery):
---
title: "Untitled"
output: 
  flexdashboard::flex_dashboard:
    orientation: columns
    vertical_layout: fill
---
<style>

body {
  padding-top:0px
}

.navbar{
  visibility: hidden
}

</style>


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

Column {data-width=650}
-----------------------------------------------------------------------

### Chart A

```{r}
hist(iris$Sepal.Length)

```

Column {data-width=350}
-----------------------------------------------------------------------

### Chart B

```{r}
hist(iris$Sepal.Width)
```

### Chart C

```{r}
hist(iris$Petal.Length)
```

结果如下:enter image description here


当然,可以直接使用CSS...我总是首先想到jQuery :P +1 - Martin Schmelzer

3

我不知道是否有flexdashboard选项。但是你可以使用jQuery来移除导航栏并将页面主体上移。只需在YAML后面包含以下代码片段:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script>
$(document).ready(function() {
  $('.navbar').remove();
  $('body').css('padding-top', '0px');
});
</script>

我认为这不会影响父文档的主导航栏。如果有影响,可能需要进行轻微修改。

太棒了!这个回答非常有效。只给样式打分是因为对于非JS人员而言,添加到rMarkdown中要容易得多。非常感谢你的出色回答! - sconfluentus

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接