Full Screen Plot

css content classes plot

Properly size a plot to completely fill the slide

Emil Hvitfeldt true
05-22-2021

To have a plot fill a slide you need to do 2 things. First, you need to create a content class that removes all the necessary padding and margins. Second, you need to set the proper chunk options to size the plot correctly. Note that the fig.asp must properly match the aspect ratio of your slides.

Result

Rmd

---
output:
  xaringan::moon_reader:
    css: ["default", "style.css"]
    lib_dir: libs
    seal: FALSE
    nature:
      highlightStyle: github
      highlightLines: true
      countIncrementalSlides: false
---

class: full

```{r, fig.asp = 3/4, fig.align = 'center', echo = FALSE, out.width = "100%", dpi= 300, warning = FALSE}
library(ggplot2)
library(palmerpenguins)

ggplot(penguins) +
  aes(bill_length_mm, bill_depth_mm,
      color = species) +
  geom_point() +
  theme_minimal() +
  scale_color_manual(values = c("darkorange","purple","cyan4")) +
  labs(title = "Bill depth and length")
```

style.css

.full {
  padding: 0px;
}

.full p {
  margin-top: 0px;
}

Reuse

Text and figures are licensed under Creative Commons Attribution CC BY 4.0. The figures that have been reused from other sources don't fall under this license and can be recognized by a note in their caption: "Figure from ...".

Citation

For attribution, please cite this work as

Hvitfeldt (2021, May 22). Xaringan Gallery: Full Screen Plot. Retrieved from https://xaringan.gallery/examples/full-screen-plot/

BibTeX citation

@misc{hvitfeldt2021full,
  author = {Hvitfeldt, Emil},
  title = {Xaringan Gallery: Full Screen Plot},
  url = {https://xaringan.gallery/examples/full-screen-plot/},
  year = {2021}
}