Yihui Xie | One R Markdown Document, Fourteen Demos | RStudio (2020)
R Markdown is a document format based on the R language and Markdown to intermingle computing with narratives in the same document. With this simple format, you can actually do a lot of things. For example, you can generate reports dynamically (no need to cut-and-paste any results because all results can be dynamically generated from R), write papers and books, create websites, and make presentations. In this talk, I'll use a single R Markdown document to give demos of the R packages rmarkdown, - bookdown for authoring books (https://bookdown.org), - blogdown for creating websites (https://github.com/rstudio/blogdown), - rticles for writing journal papers (https://github.com/rstudio/rticles), - xaringan for making slides (https://github.com/yihui/xaringan), - flexdashboard for generating dashboards (https://github.com/rstudio/flexdashboard), - learnr for tutorials (https://github.com/rstudio/learnr), - rolldown for storytelling (https://github.com/yihui/rolldown), And the integration between Shiny and R Markdown. To make the best use of your time during the presentation, I recommend you to take a look at the rmarkdown website in advance: https://rmarkdown.rstudio.com
image: thumbnail.jpg
Transcript#
This transcript was generated automatically and may contain errors.
Please join me in welcoming Yihui Xie.
Thank you. Good morning, everyone. So I'm Yihui. First, I would like to thank Rob for sharing all these touching love stories with R Markdown. And well, actually, before I get started, I have a few horror stories to share.
First one is that I don't have slides today. Oh, terrible. The second is I only have an R script, which I opened here. And what we are going to do for this talk is that I will explain the R script line by line for 20 minutes. I'm just kidding.
Third thing is that I'm going to do live demos. And I would like to introduce Yihui's law of doing live demos, which is live demos always work before you step onto the podium. All right. Let's see if I will succeed.
So I'm going to source this script. Well, actually, I still have a few more horror stories. First one is I'm going to use the Iris data for demonstration. Oh, that's terrible. If that's not horrible enough, okay, I have another horror story. I'm going to use pie charts. Oh, even better, right? If that still does not scare you, I'm going to use three-dimensional pie charts and animated pie charts.
Thank you for staying in the room, still staying with me here. All right. Let's get started for real.
The R Markdown document
So because I don't have enough time, I'm going to type out my example here just really fast. Of course, I'm cheating. I wrote a blog post on how I cheated, so you can go back and check out that blog post. All right. So I've got an R Markdown document, which is precisely 100 lines. I think people with OCD will feel very comfortable with that. 100 lines. No more, no less.
I think this is a pretty simple example. We just have some sections, some R code chunks that produce plots and tables and equations and also some dynamic and interactive content.
Demo 1: HTML document output
So the first demo I'm going to show you is probably the most boring one, the HTML document output. So I'm going to compile this automatically, and here's the output. There's nothing new, basically an ordinary HTML document. So yeah, I just did some text output here. I drew a scatterplot, actually a two-dimensional density plot overlaid by a so-called sunflower plot. I call this my version of Starry Night.
I don't know if it actually looks like a starry night. Anyway, so I've got a table here. I've got a linear regression model here. So all these things are dynamically generated. And here's our horrible pie chart, which is a pyramid chart. The sky, the blue sky, the sunny side of the pyramid, and shady side of the pyramid.
I don't applaud yet, because I have a better one. The animated pie chart, which is a Pac-Man. So just to show you that you can do animations from R Markdown. And I've also got dynamic interactive content, which are HTML widgets. So this shows where we are right now. Here's the Hilton, the hotel, and I've also got the boring iris data in the data tables. It's interactive. You can go to different pages, you can sort the columns, you can search in the table.
Demo 2: Dark mode with CSS
So that shows some of the most common components of the R Markdown document. Next what I'm going to do is to insert a CSS code chunk. So here I've got a CSS code chunk, which is really simple. What I did here is that I set the background color of the document to be black, and I applied a CSS filter to this document to invert all the colors. So hopefully you will see what it looks like in a minute. So with just two lines of CSS code, I turned this document into the dark mode.
So now I've got dark mode. I think the dark mode aligns very well with my horror story theme. And now this starry night, I don't know, maybe it has turned to... It has become something like a virus night or zombie night, I don't know. Well, you can see, yeah, the text is white and the background is black, and, yeah, the pyramid also looks scary, the sky is red, it is red, and also Pac-Man, oh, it looks like a ghost now.
And also our leaflet, interactive leaflet map, the Hilton Hotel, it looks like a haunted hotel now. Just look at those forks and knives, icons, I guess probably you are not sure if these are the places where you eat or get eaten.
are the places where you eat or get eaten.
Wow, okay, I think it looks horrible enough. The next example I'm going to show you is that actually you can make your HTML output respond to your system's theme. So what I'm going to do is that I will just add a media query to these CSS rules. So basically that means when the theme of my system is dark, this document will automatically go to the dark mode, see, if I switch to dark mode, then my document switches to dark mode. If I switch to light mode, it becomes the light mode. So it can respond to the appearance of your operating system. So just with two lines of CSS code, I think that's pretty amazing.
Demo 3: PDF and LaTeX output
Next I'm going to show you a PDF, a LaTeX document output. What I'm going to do is that I will add two LaTeX packages to this document. One is animate, the other is coffee4. You will know what these packages do in a moment. So I'm going to compile this LaTeX document to PDF and show you the output. There's actually another danger of doing live demos, which is I often have to stand here in awkward silence waiting for our markdown to finish the compilation.
So the coffee4 package actually adds some coffee stains to your document. I still don't know why you should do that. Sometimes you can show to your advisor or your boss, oh, look, I'm working really hard. I'm still reading the paper while drinking coffee. The coffee stains can be random. Just like that, yeah.
All right. Next let me show you the animation stuff. The animation actually only works in the Acrobat Reader, so I need another reader to open this PDF file. All right. Here we go. And we've got the Pac-Man here. It actually works in PDF, and I click on it, yeah, it will start biting. That's the animation and coffee stains in PDF output.
Demo 4: Word document
So our next example is going to be Word document, yeah. This is your favorite output format, right? But it's my least favorite output format. Anyway, I will show you. So basically what I did here is I used a custom Word template, which is specified in the reference doc X option. So that is a template I made in advance. Let's compile this and see what it looks like.
Oh, why is it your favorite output format looks horrible? Sorry, I'm cheating. I opened the Word document in text edit on Mac OS. Let me switch to Windows because I don't have Office installed on my Mac OS. So here we are on Windows now. Yeah, so this is what the output looks like. So I made a template simply by inserting an image in the header, so I applied that template to the R Markdown document, so now you've got the Word output that looks like this.
Demo 5: PowerPoint presentation
So the next one is, next demo is also your favorite, another of your favorite output format, which is PowerPoint presentation. I did a similar thing. I applied a custom template to the R Markdown document, and we will see the output. Yeah, of course, I still need to switch to Windows because I don't have PowerPoint installed.
Yeah, basically I just randomly chose a template in PowerPoint and applied that to the R Markdown document, so it looks like it works. Sometimes it looks messy, but the content is still there, and the Pac-Man is still working hard. All right. That's PowerPoint.
Demo 6: IOSlides HTML presentation
So the next demo is IOSlides presentation. So you can create multiple types of slides, like HTML slides, PDF slides, or PowerPoint. So here I'm going to show you a type of HTML slides named IOSlides. So I'm only using the default options. You can see still the same content there. But with HTML, personally I really love HTML slides because it's so much more flexible. For example, with like a single key press, you can go to the overview mode, and again with a single key stroke, you can turn this to the widescreen mode or just the normal mode. So take that challenge, PowerPoint.
Demo 7: Beamer presentation
So that is HTML slides. Next demo is Beamer presentation. And that's kind of dangerous because I almost always feel sleepy when I look at Beamer slides. Sorry, Rob. Yours looks fantastic.
So Beamer, you can actually choose some themes from the RStudio IDE. So for example, here you can change the output options and choose different themes there. For example, we can switch to Berkeley and see what that looks like. So this is the original theme I used. If we change to another theme and need this document again, you can see a different theme. Oh, it's blue. That's my least favorite color in Beamer.
Demo 8: Tufte style
Beamer. And the next demo is the Tufti package. So Tufti package provides the style created by Edward Tufti. And you can actually create HTML output formats and PDF output. So here I'm showing you the HTML format. So still the same content, all the plots, the tables are all there. And one of the main characteristics of the Tufti style is that it has a main column on the left-hand side. And it also has a sidebar on the right-hand side. So there are certain things that can be placed in the sidebar. For example, like figure caption or table caption or footnotes or your citations. You can also have some full-width elements like the map. And this is actually a very responsive layout. For example, if your screen is very narrow, for example, when you're reading this page on your mobile phone. Well, actually, I don't know why you should read anything on your mobile phone, like read a paper. But, yeah, it's just possible. The layout can respond to the page width.
Demo 9: Rodon package
And next one is the Rodon package. This is a new package I wrote last year. And my main motivation for developing this package is actually Lama. Because I saw a JavaScript library named scrolllama. So that sounds cute. Let me write an R package for it. So I wrote an R package named Rodon, which creates an HTML page that looks like this.
So Rodon basically means when you scroll down a document, you can display different things in the main area. So, for example, originally I was displaying this scatterplot. And then as I scroll down, you can take a look on the left-hand side where I put all the text and sections and things like that there. So as you scroll down, you can highlight certain things like your plots, your tables, things like that. And I think this is also a very interesting output format. So just scroll down, and certain things will change. That is the Rodon package.
Demo 10: Journal articles with rticles
And we've also got the demo for journal articles. So that is one of the output formats from the articles package, articles without A. So I'm using the JSS underscore article format. So, again, the same document and different output. So I guess some of you might have submitted papers to JSS. And I just wanted to show you that it's also possible to write a JSS paper with R Markdown.
Well, actually, I'm not sure how wide the articles packages will be used because of the Stockholm syndrome. When LaTeX tortures you enough, you will fall in love with it. So, yeah, I'm not sure how wide Markdown will be used for writing journal papers. But we will see. So that is the articles package.
When LaTeX tortures you enough, you will fall in love with it.
Demo 11: flexdashboard
And you can also create dashboards from the same document. So now I'm using the flexdashboard package. And now you can see my first level section headings have become pages. And my second level section headers have become columns. We have four second level section headings here. So we have four columns in this dashboard. And, yeah, again, the Pac-Man is still working there. And, yeah, interactive map also works here. And also it's actually responsive in the sense that it responds to your page width. So if the page is too narrow, you can see the layout will automatically change. So that is the dashboard.
Demo 12: pagedown
Next demo is page down. So we have an output format named we actually have several output formats in the page down package. One of them is book underscore CRC. That is the style for the publisher Chapman Hall. So let's compile this document to that output format. So page down is a package for creating PDFs from HTML. And we style the HTML pages with CSS. There's also a JavaScript back end which, like, makes all these pages on the HTML page. So you can see it looks quite sophisticated, right? If you want a PDF, you just press control P or command P. You can print this to a beautiful PDF. And I swear this is HTML. This is not PDF here. I can open the JavaScript console for you and type a few lines of JavaScript to show you, oh, this is really HTML. And then you can see all the CSS associated with these elements there. So it's in my web browser. But you can create a PDF from this HTML page.
Demo 13: bookdown
So the next demo is bookdown. So bookdown also contains several output formats. What I'm demonstrating here is an output format named Gitbook. So the same document is compiled to a book with multiple chapters. You can navigate through these chapters. And you can toggle the table of contents, which is in a sidebar. You can change the typeface. You can change the font size. You can change the theme. It's very flexible. So that is bookdown.
Demo 13: learnr interactive tutorials
And next I'm going to demonstrate the learnr package. learnr allows you to create interactive tutorials from markdown. So this is an interactive tutorial created from that same markdown document. So it has several topics. You can navigate through these topics. And sometimes you can also specify the code chunks to be exercises so that your students can, like, run the code right there. And they can change the code and rerun. So they can play with the code freely here.
Just let me go back to my horror theme again, change the color of the sky to be black. It still works. So that's the learnr package.
Demo 14: blogdown
So my last demo is blogdown. So I will copy that R markdown document to a blogdown website and compile that website. Hopefully you will see that website in a minute. All right. So this is the website. I'm using the Hugo academic theme. So we can scroll down to find our demo file there. One R markdown document, 14 demos. Everything is still there. The Pac-Man has turned his head to the right. All right. So that is the blogdown package.
Closing thoughts
All right. So I think that's pretty much what I have got for you today. And people often say, oh, markdown, markdown, it's just so simple. I cannot create sophisticated applications with markdown. I just want to show them that they are wrong. There are a lot of things that you can do with markdown and R markdown. Thank you.
But the one with the most votes right now is what's the up dog app? What's that? What's up dog? Up dog. I'm sorry. I should have deleted that section in the blogdown book. Up dog is right. It's done.
Second question, then, if we can do this one. What is the difference between bookdown and pagedown? bookdown and pagedown? bookdown, well, the focus of pagedown is HTML. But for bookdown, it supports HTML, PDF, and even Word documents. Yeah. So pagedown is mainly to use CSS to type HTML documents. Thank you, Yiwei.
