• Stars
    star
    316
  • Rank 125,168 (Top 3 %)
  • Language
    JavaScript
  • License
    Other
  • Created over 9 years ago
  • Updated 11 months ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

R Markdown Format for reveal.js Presentations

R Markdown Format for reveal.js Presentations

CRAN status R-CMD-check reveal.js

Overview

This repository provides an R Markdown custom format for reveal.js HTML presentations. The packages includes reveal.js library in version 4.2.1

You can use this format in R Markdown documents by installing this package as follows:

install.packages("revealjs")

To create a reveal.js presentation from R Markdown you specify the revealjs_presentation output format in the front-matter of your document. You can create a slide show broken up into sections by using the # and ## heading tags (you can also create a new slide without a header using a horizontal rule (----). For example here’s a simple slide show:

---
title: "Habits"
author: John Doe
date: March 22, 2005
output: revealjs::revealjs_presentation
---

# In the morning

## Getting up

- Turn off alarm
- Get out of bed

## Breakfast

- Eat eggs
- Drink coffee

# In the evening

## Dinner

- Eat spaghetti
- Drink wine

## Going to sleep

- Get in bed
- Count sheep

Rendering

Depending on your use case, there are 3 ways you can render the presentation.

  1. RStudio
  2. R console
  3. Terminal (e.g., bash)

RStudio

When creating the presentation in RStudio, there will be a Knit button right below the source tabs. By default, it will render the current document and place the rendered HTML file in the same directory as the source file, with the same name.

R Console

The Knit button is actually calling the rmarkdown::render() function. So, to render the document within the R console:

rmarkdown::render('my_reveal_presentation.Rmd')

There are many other output tweaks you can use by directly calling render. You can read up on the documentation for more details.

Command Line

When you need the presentation to be rendered from the command line:

Rscript -e "rmarkdown::render('my_reveal_presentation.Rmd')"

Display Modes

The following single character keyboard shortcuts enable alternate display modes:

  • 'f' enable fullscreen mode

  • 'o' enable overview mode

  • 'b' enable pause mode with a black screen hiding slide content

  • '?' enable help mode to show keyboard shortcut cheatsheet

  • 's' enable presentation mode with speaker notes when the Notes plugin is activated

  • 'm' enable menu mode when the ‘menu’ plugin is activated

Pressing Esc exits all of these modes.

Incremental Bullets

You can render bullets incrementally by adding the incremental option:

---
output:
  revealjs::revealjs_presentation:
    incremental: true
---

If you want to render bullets incrementally for some slides but not others you can use this syntax:

::: incremental

- Eat spaghetti
- Drink wine

:::

or

::: nonincremental

- Eat spaghetti
- Drink wine

:::

Incremental Revealing

You can also add pauses between content on a slide using . . .

# Slide header

Content shown first

. . .

Content shown next on the same slide

Using Fragments explicitly is also possible

# Slide header

Content shown first

::: fragment
Content shown next on the same slide
:::

Appearance and Style

There are several options that control the appearance of revealjs presentations:

  • theme specifies the theme to use for the presentation (available themes are “simple”, “dark”, “black”, “sky”, “beige”, “serif”, “solarized”, “blood”, “moon”, “night”, “league”, or “white”

  • highlight specifies the syntax highlighting style. Supported styles include “default”, “tango”, “pygments”, “kate”, “monochrome”, “espresso”, “zenburn”, “haddock”, or “breezedark”. Pass null to prevent syntax highlighting.

  • center specifies whether you want to vertically center content on slides (this defaults to false).

For example:

output:
  revealjs::revealjs_presentation:
    theme: sky
    highlight: pygments
    center: true

Revealjs documentation about themes

Slide Transitions

You can use the transition and background_transition options to specify the global default slide transition style:

  • transition specifies the visual effect when moving between slides. Available transitions are “convex”, “fade”, “slide”, “concave”, “zoom”, or “none”.

  • background_transition specifies the background transition effect when moving between full page slides. Available transitions are “convex”, “fade”, “slide”, “concave”, “zoom”, or “none”

For example:

output:
  revealjs::revealjs_presentation:
    transition: fade
    background_transition: slide

You can override the global transition for a specific slide by using the data-transition attribute, for example:

## Use a zoom transition {data-transition="zoom"}

## Use a faster speed {data-transition-speed="fast"}

You can also use different in and out transitions for the same slide, for example:

## Fade in, Slide out {data-transition="slide-in fade-out"}

## Slide in, Fade out {data-transition="fade-in slide-out"}

This works also for background transition

## Use a zoomed background transition {data-background-transition="zoom"}

Revealjs documentation about transitions

Slide Backgrounds

Slides are contained within a limited portion of the screen by default to allow them to fit any display and scale uniformly. You can apply full page backgrounds outside of the slide area by adding a data-background attribute to your slide header element. Four different types of backgrounds are supported: color, image, video and iframe. Below are a few examples.

## CSS color background {data-background-color=#ff0000}

## Full size image background {data-background-image="background.jpeg"}

## Video background {data-background-video="background.mp4"}

## Embed a web page as a background {data-background-iframe="https://example.com"}

Backgrounds transition using a fade animation by default. This can be changed to a linear sliding transition by specifying the background-transition: slide. Alternatively you can set data-background-transition on any slide with a background to override that specific transition.

Revealjs documentation about backgrounds

2-D Presentations

You can use the slide_level option to specify which level of heading will be used to denote individual slides. If slide_level is 2 (the default), a two-dimensional layout will be produced, with level 1 headers building horizontally and level 2 headers building vertically. For example:

# Horizontal Slide 1

## Vertical Slide 1

## Vertical Slide 2

# Horizontal Slide 2

With this layout horizontal navigation will proceed directly from “Horizontal Slide 1” to “Horizontal Slide 2”, with vertical navigation to “Vertical Slide 1”, etc. presented as an option on “Horizontal Slide 1”. Global reveal option navigationMode can be tweaked to change this behavior.

Reveal Options

Reveal.js has many additional options to configure it’s behavior. You can specify any of these options using reveal_options, for example:

---
title: "Habits"
output:
  revealjs::revealjs_presentation:
    self_contained: false
    reveal_options:
      slideNumber: true
      previewLinks: true
---

You can find documentation on the various available Reveal.js options here: https://revealjs.com/config/.

Figure Options

There are a number of options that affect the output of figures within reveal.js presentations:

  • fig_width and fig_height can be used to control the default figure width and height (7x5 is used by default)

  • fig_retina Specifies the scaling to perform for retina displays (defaults to 2, which currently works for all widely used retina displays). Note that this only takes effect if you are using knitr >= 1.5.21. Set to null to prevent retina scaling.

  • fig_caption controls whether figures are rendered with captions

For example:

---
title: "Habits"
output:
  revealjs::revealjs_presentation:
    fig_width: 7
    fig_height: 6
    fig_caption: true
---

MathJax Equations

By default MathJax scripts are included in reveal.js presentations for rendering LaTeX and MathML equations. You can use the mathjax option to control how MathJax is included:

  • Specify “default” to use an https URL from the official MathJax CDN.

  • Specify “local” to use a local version of MathJax (which is copied into the output directory). Note that when using “local” you also need to set the self_contained option to false.

  • Specify an alternate URL to load MathJax from another location.

  • Specify null to exclude MathJax entirely.

For example, to use a local copy of MathJax:

---
title: "Habits"
output:
  revealjs::revealjs_presentation:
    mathjax: local
    self_contained: false
---

To use a self-hosted copy of MathJax:

---
title: "Habits"
output:
  revealjs::revealjs_presentation:
    mathjax: "http://example.com/mathjax/MathJax.js?config=TeX-AMS-MML_HTMLorMML"
---

To exclude MathJax entirely:

---
title: "Habits"
output:
  revealjs::revealjs_presentation:
    mathjax: null
---

Document Dependencies

By default R Markdown produces standalone HTML files with no external dependencies, using data: URIs to incorporate the contents of linked scripts, stylesheets, images, and videos. This means you can share or publish the file just like you share Office documents or PDFs. If you’d rather keep dependencies in external files you can specify self_contained: false. For example:

---
title: "Habits"
output:
  revealjs::revealjs_presentation:
    self_contained: false
---

Note that even for self contained documents MathJax is still loaded externally (this is necessary because of it’s size). If you want to serve MathJax locally then you should specify mathjax: local and self_contained: false.

One common reason keep dependencies external is for serving R Markdown documents from a website (external dependencies can be cached separately by browsers leading to faster page load times). In the case of serving multiple R Markdown documents you may also want to consolidate dependent library files (e.g. Bootstrap, MathJax, etc.) into a single directory shared by multiple documents. You can use the lib_dir option to do this, for example:

---
title: "Habits"
output:
  revealjs::revealjs_presentation:
    self_contained: false
    lib_dir: libs
---

Reveal Plugins

You can enable various reveal.js plugins using the reveal_plugins option. Plugins currently supported include:

Plugin Description
notes Present per-slide notes in a separate browser window. Open Note view pressing S.
zoom Zoom in and out of selected content with Alt+Click.
search Find a text string anywhere in the slides and show the next occurrence to the user. Open search box using CTRL + SHIFT + F.
chalkboard Include handwritten notes within a presentation. Press c to write on slides, Press b to open a whiteboard or chalkboard to write.
menu Include a navigation menu within a presentation. Press m to open the menu.

Note that the use of plugins requires that the self_contained option be set to false. For example, this presentation includes both the “notes” and “search” plugins:

---
title: "Habits"
output:
  revealjs::revealjs_presentation:
    self_contained: false
    reveal_plugins: ["notes", "search"]
---

You can specify additional options for the chalkboard and menu plugins using reveal_options, for example:

---
title: "Habits"
output:
  revealjs::revealjs_presentation:
    self_contained: false
    reveal_plugins: ["chalkboard", "menu"]
    reveal_options:
      chalkboard:
        theme: whiteboard
        toggleNotesButton: false
      menu:
        side: right
---

No other plugins can be added in revealjs_presentation(). You can open feature request for new plugins or you would need to use a custom template to write your own HTML format including custom plugins.

Advanced Customization

Includes

You can do more advanced customization of output by including additional HTML content or by replacing the core pandoc template entirely. To include content in the document header or before/after the document body you use the includes option as follows:

---
title: "Habits"
output:
  revealjs::revealjs_presentation:
    includes:
      in_header: header.html
      before_body: doc_prefix.html
      after_body: doc_suffix.html
---

Pandoc Arguments

If there are pandoc features you want to use that lack equivalents in the YAML options described above you can still use them by passing custom pandoc_args. For example:

---
title: "Habits"
output:
  revealjs::revealjs_presentation:
    pandoc_args: [
      "--title-prefix", "Foo",
      "--id-prefix", "Bar"
    ]
---

Documentation on all available pandoc arguments can be found in the pandoc user guide.

Shared Options

If you want to specify a set of default options to be shared by multiple documents within a directory you can include a file named _output.yaml within the directory. Note that no YAML delimiters or enclosing output object are used in this file. For example:

_output.yaml

revealjs::revealjs_presentation:
  theme: sky
  transition: fade
  highlight: pygments

All documents located in the same directory as _output.yaml will inherit it’s options. Options defined explicitly within documents will override those specified in the shared options file.

Code of Conduct

Please note that the revealjs project is released with a Contributor Code of Conduct. By contributing to this project, you agree to abide by its terms.

More Repositories

1

cheatsheets

Posit Cheat Sheets - Can also be found at https://posit.co/resources/cheatsheets/.
TeX
5,382
star
2

shiny

Easy interactive web applications with R
R
5,139
star
3

rstudio

RStudio is an integrated development environment (IDE) for R
Java
4,432
star
4

bookdown

Authoring Books and Technical Documents with R Markdown
JavaScript
3,525
star
5

rmarkdown

Dynamic Documents for R
R
2,737
star
6

shiny-examples

JavaScript
1,909
star
7

gt

Easily generate information-rich, publication-quality tables from R
R
1,853
star
8

blogdown

Create Blogs and Websites with R Markdown
R
1,691
star
9

reticulate

R Interface to Python
R
1,604
star
10

webinars

Code and slides for RStudio webinars
HTML
1,510
star
11

rticles

LaTeX Journal Article Templates for R Markdown
TeX
1,402
star
12

plumber

Turn your R code into a web API.
R
1,352
star
13

tensorflow

TensorFlow for R
R
1,313
star
14

renv

renv: Project environments for R.
R
949
star
15

shinydashboard

Shiny Dashboarding framework
CSS
852
star
16

pagedown

Paginate the HTML Output of R Markdown with CSS for Print
R
850
star
17

keras

R Interface to Keras
R
811
star
18

pointblank

Data quality assessment and metadata reporting for data frames and database tables
R
794
star
19

flexdashboard

Easy interactive dashboards for R
JavaScript
778
star
20

leaflet

R Interface to Leaflet Maps
JavaScript
775
star
21

rmarkdown-book

R Markdown: The Definitive Guide (published by Chapman & Hall/CRC in July 2018)
RMarkdown
738
star
22

ggvis

Interactive grammar of graphics for R
R
709
star
23

rstudio-conf

Materials for rstudio::conf
HTML
694
star
24

learnr

Interactive Tutorials with R Markdown
R
692
star
25

shiny-server

Host Shiny applications over the web.
JavaScript
686
star
26

RStartHere

A guide to some of the most useful R Packages that we know about
R
655
star
27

py-shiny

Shiny for Python
Python
627
star
28

DT

R Interface to the jQuery Plug-in DataTables
JavaScript
577
star
29

rmarkdown-cookbook

R Markdown Cookbook. A range of tips and tricks to make better use of R Markdown.
RMarkdown
562
star
30

blastula

Easily send great-looking HTML email messages from R
R
522
star
31

r2d3

R Interface to D3 Visualizations
R
506
star
32

bookdown-demo

A minimal book example using bookdown
CSS
476
star
33

hex-stickers

RStudio hex stickers
R
426
star
34

distill

Distill for R Markdown
HTML
418
star
35

bslib

Tools for theming Shiny and R Markdown via Bootstrap 3, 4, or 5.
SCSS
408
star
36

packrat

Packrat is a dependency management system for R
R
394
star
37

tufte

Tufte Styles for R Markdown Documents
R
385
star
38

dygraphs

R interface to dygraphs
JavaScript
358
star
39

pins-r

Pin, Discover and Share Resources
R
295
star
40

fontawesome

Easily insert FontAwesome icons into R Markdown docs and Shiny apps
R
288
star
41

profvis

Visualize R profiling data
JavaScript
285
star
42

crosstalk

Inter-htmlwidget communication for R (with and without Shiny)
JavaScript
283
star
43

config

config package for R
R
248
star
44

pool

Object Pooling in R
R
241
star
45

thematic

Theme ggplot2, lattice, and base graphics based on a few simple settings.
R
237
star
46

Intro

Course materials for "Introduction to Data Science with R", a video course by RStudio and O'Reilly Media
R
234
star
47

shinytest

Automated testing for shiny apps
JavaScript
227
star
48

tinytex-releases

Windows/macOS/Linux binaries and installation methods of TinyTeX
PowerShell
226
star
49

httpuv

HTTP and WebSocket server package for R
C
217
star
50

nomnoml

Sassy 'UML' Diagrams for R
JavaScript
216
star
51

shinymeta

Record and expose Shiny app logic using metaprogramming
R
212
star
52

htmltools

Tools for HTML generation and output
R
201
star
53

shinyuieditor

A GUI for laying out a Shiny application that generates clean and human-readable UI code
JavaScript
198
star
54

promises

A promise library for R
R
191
star
55

vetiver-r

Version, share, deploy, and monitor models
R
170
star
56

rstudioapi

Safely access RStudio's API (when available)
R
161
star
57

gradethis

Tools for teachers to use with learnr
R
161
star
58

concept-maps

Concept maps for all things data science
HTML
158
star
59

master-the-tidyverse

Course contents for Master the Tidyverse
158
star
60

shinythemes

Themes for Shiny
R
152
star
61

ShinyDeveloperConference

Materials collected from the First Shiny Developer Conference Palo Alto, CA January 30-31 2016
HTML
151
star
62

chromote

Chrome Remote Interface for R
R
143
star
63

shiny-gallery

Code and other documentation for apps in the Shiny Gallery ✨
HTML
139
star
64

sortable

R htmlwidget for Sortable.js
R
124
star
65

rsconnect

Publish Shiny Applications, RMarkdown Documents, Jupyter Notebooks, Plumber APIs, and more
R
120
star
66

reactlog

Shiny Reactivity Visualizer
JavaScript
119
star
67

redx

dynamic nginx configuration
Lua
118
star
68

bigdataclass

Two-day workshop that covers how to use R to interact databases and Spark
R
113
star
69

shinyapps

Deploy Shiny applications to ShinyApps
110
star
70

shinyloadtest

Tools for load testing Shiny applications
HTML
109
star
71

webshot2

Take screenshots of web pages from R
R
108
star
72

shinyvalidate

Input validation package for the Shiny web framework
JavaScript
108
star
73

r-docker

Docker images for R
Dockerfile
105
star
74

miniUI

R
102
star
75

sass

Sass compiler package for R
C++
102
star
76

r-system-requirements

System requirements for R packages
Shell
100
star
77

shinytest2

R
96
star
78

keras-customer-churn

Customer Churn Shiny Application
R
96
star
79

r-builds

an opinionated environment for compiling R
Shell
91
star
80

addinexamples

An R package showcasing how RStudio addins can be registered and used.
R
85
star
81

r-manuals

A re-styled version of the R manuals
R
83
star
82

shinyapps-package-dependencies

Collection of bash scripts that install R package system dependencies
R
74
star
83

markdown

The first generation of Markdown rendering for R (born in 2012). Originally based on the C library sundown. Now based on commonmark. Note that this package is markdown, not *rmarkdown*.
R
72
star
84

R-Websockets

HTML 5 Websockets implementation for R
R
68
star
85

webdriver

WebDriver client in R
R
68
star
86

beyond-dashboard-fatigue

Materials for the RStudio webinar 'Beyond Dashboard Fatigue'
R
66
star
87

cloudml

R interface to Google Cloud Machine Learning Engine
R
65
star
88

shinylive

Run Shiny on Python (compiled to wasm) in the browser
TypeScript
61
star
89

rstudio-conf-2022-program

rstudio::conf(2022, "program")
R
61
star
90

rstudio-docker-products

Docker images for RStudio Professional Products
Just
59
star
91

bookdown.org

Source documents to generate the bookdown.org website
R
59
star
92

education.rstudio.com

CSS
57
star
93

tfestimators

R interface to TensorFlow Estimators
R
57
star
94

sparkDemos

HTML
54
star
95

vetiver-python

Version, share, deploy, and monitor models.
Python
54
star
96

tfprobability

R interface to TensorFlow Probability
R
54
star
97

shiny-incubator

Examples and ideas that don't belong in the core Shiny package and aren't officially supported.
JavaScript
53
star
98

connections

https://rstudio.github.io/connections/
R
52
star
99

swagger

Swagger is a collection of HTML, Javascript, and CSS assets that dynamically generate beautiful documentation from a Swagger-compliant API.
HTML
51
star
100

leaflet.mapboxgl

Extends the R Leaflet package with a Mapbox GL JS plugin to allow easy drawing of vector tile layers.
R
49
star