I am working on a project using rMarkdown
and the flexdashboard
package from rStudio
. Everything is coming together nicely. But I would like to remove the blue title bar you see at the top of the image here.
We are dropping this html page into a window so it becomes a second title bar, which looks terrible. Is there a function in flexdashboard
to remove this entire apparatus?
Here is the YAML and the first chunk you see just below the blue bar in the photograph. Any suggestion would be greatly appreciated.
---
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
You can just add CSS styling directly to your markdown document (no JQuery required):
---
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)
```
Results in:
I am not aware of any flexdashboard option. But you could use jQuery to remove the navbar and move the body up. Just include the following snippet right after your 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>
I think this leaves the main navigation bar of the parent document untouched. If not it might need some lsight modification.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With