Background color of area surrounding ggplot in a {xaringan} slide

Question

I'm trying to match the background color of a ggplot with the background color of the slide in a {xaringan} presentation. But there are some areas that I don't know how to change the color of. I don't even know if that is controlled by ggplot or by xaringan.

The area I'm talking about is this marked in the image below: area

I've added borders to the ggplot (red) and the output of the r code chunk (orange) so to delimitate better the area I'm talking about.
To reproduce this behavior you can run the code below:

---
title: "Presentation Ninja"
subtitle: "⚔<br/>with xaringan"
author: "Yihui Xie"
institute: "RStudio, PBC"
date: "2016/12/12 (updated: `r Sys.Date()`)"
output:
  xaringan::moon_reader:
    lib_dir: libs
    nature:
      highlightStyle: github
      highlightLines: true
      countIncrementalSlides: false
---

```{r setup, include=FALSE}
options(htmltools.dir.version = FALSE)
library(tidyverse)
```

```{css, echo = FALSE}
.remark-slide-content {
  background-color: #bfc7e0;
}
```

# Get Started

```{r, echo=FALSE, out.extra = 'style="border:2px solid orange;"'}
mtcars %>% 
  ggplot() +
  geom_line(mapping = aes(x = mpg, y = qsec)) +
  theme_minimal() +
  theme(plot.background = element_rect(fill = "#bfc7e0", colour = "red")) +
  coord_fixed()
```

I have no idea where to change the color of these areas, since I've already chenged the background color of the slide and the overall background of the ggplot.

Answer 1

This is nothing special about xaringan. The issue is that you use coord_fixed but also arises when using coord_polar or coord_sf.

As a result the plot is rendered with a fixed aspect ratio which means that the size of the plot will not adjust to the size of the plotting device, e.g. you run into the same issue when running

library(tidyverse)

png("foo.png")
mtcars %>%
  ggplot() +
  geom_line(mapping = aes(x = mpg, y = qsec)) +
  theme_minimal() +
  theme(plot.background = element_rect(fill = "#bfc7e0", colour = "red")) +
  coord_fixed()
dev.off()

To get rid of the "white" background you could set the background color of the plotting device using knitr::opts_chunk$set(dev.args = list(bg = "#bfc7e0")).

EDIT Thanks to the comment by @YihuiXie I think the best option would be to use "transparent" for both the background fill of the device and the ggplot. Doing so allows to change the background fill for the slides without the need to change the bg fill color of the device or the ggplot.

---
title: "Presentation Ninja"
subtitle: "⚔<br/>with xaringan"
author: "Yihui Xie"
institute: "RStudio, PBC"
date: "2016/12/12 (updated: `r Sys.Date()`)"
output:
  xaringan::moon_reader:
    lib_dir: libs
    nature:
      highlightStyle: github
      highlightLines: true
      countIncrementalSlides: false
---

```{r setup, include=FALSE}
options(htmltools.dir.version = FALSE)
library(tidyverse)

knitr::opts_chunk$set(dev.args = list(bg = "transparent"))
```

```{css, echo = FALSE}
.remark-slide-content {
  background-color: #bfc7e0;
}
```

# Get Started

```{r, echo=FALSE, out.extra = 'style="border:2px solid orange;"'}
mtcars %>%
  ggplot() +
  geom_line(mapping = aes(x = mpg, y = qsec)) +
  theme_minimal() +
  theme(plot.background = element_rect(fill = "transparent", colour = "red")) +
  coord_fixed()
```