• Part I. ioslides
  • Part II. htmlwidget

Part I. ioslides

Slides in rmarkdown

File type and format

  • html
    • ioslides, slidy
    • htmlwidget 사용 가능, web에 간편하게 게시가능
  • pdf
    • beamer
    • 가장 formal하고 academic함
  • pptx - powerpoint

Structure

Header rmarkdown in slides
Level-1 header # part
Level-2 header ## page
Level-3 header ### paragraph

ioslides

Subtitling & Incremental Mode

This is my subtitle

  • 이 페이지의 Level-2 헤더는 아래와 같이 적었음
## Subtitling and Incremental Mode | This is my subtitle {.build}
  • Subtitle
    • 페이지의 title과 subtitle을 함께 넣을 수 있음
  • Incremental Mode
    • {.build}를 적어주면 incremental mode가 실행됨
    • global하게 적용하려면 YAML 헤더에 incremental: true

Presentation control

Chrome에서 파일을 열었을 때에 아래 키로 프리젠테이션 조작 가능

  • ‘f’: enable fullscreen mode
  • ‘w’: toggle widescreen mode
  • ‘o’: enable overview mode
  • ‘h’: enable code highlight mode
  • ‘p’: show presenter notes

Code highlighting

  • ‘h’: enable code highlight mode
trivial_code1 <- 0
important_code1 <- 0
important_code2 <- 0
trivial_code2 <- 0
  • 위의 코드 블럭은 아래와 같이 입력했음
  • Highlight하고 싶은 영역을 “### <b>”와 “### </b>”로 둘러쌓으면 됨
Code highlight

Code highlight

Background images and Font color

As you walk down the fairway of life you must smell the roses, for you only get to play one round. – Ben Hogan

  • 앞 페이지의 Rmd 코드는 아래와 같음
    • Background images는 Level-2 Header에서 지정 (이미지 파일 경로와 사이즈 지정)
    • 폰트의 색을 바꾸고 싶은 영역을 <div class="white">와 </div>로 둘러싸면 하얀색 폰트로 나옴
Background and font

Background and font

YAML Header of this lecture note

YAML header

YAML header

  • logo - 로고 파일 경로
  • styles.css - 스타일 파일을 이용해서 로고 이미지와 테두리 크기 지정
  • smaller - 작은 폰트
  • incremental - incremental mode
  • transition: slower - 페이드 효과

Part II. htmlwidget

htmlwidget

  • JavaScript 데이터 시각화물을 R에서 사용
  • Rmarkdown의 html 포맷과 shiny application에 widget 형태로 삽입
  • Interactive presentation

1. plotly 객체

Interactive ggplot

library(ggplot2)
library(plotly)
fig <- ggplot(mpg, aes(x = displ, y = hwy)) + 
  geom_point(aes(color = class)) + geom_smooth()
fig_plotly <- ggplotly(fig) 
class(fig_plotly)
## [1] "plotly"     "htmlwidget"

fig_plotly

2. dygraphs 객체

Interactive timeseries plot

library(dygraphs)
lungDeaths <- cbind(mdeaths, fdeaths)
fig_dygraph <- dygraph(lungDeaths) %>%
  dySeries("mdeaths", label = "Male") %>%
  dySeries("fdeaths", label = "Female") %>%
  dyOptions(stackedGraph = TRUE) %>%
  dyRangeSelector(height = 20)
class(fig_dygraph)
## [1] "dygraphs"   "htmlwidget"

fig_dygraph

Deaths from Lung Disease (UK)

3. leaflet()

Interactive map

library(leaflet)
fig_leaflet <- leaflet() %>% addTiles() %>% 
  setView(127.076, 37.631, zoom = 16) %>%
  addMarkers(127.076, 37.63148, label="Frontier bldg",
             labelOptions = labelOptions(noHide = TRUE, textsize = "15px"))
class(fig_leaflet)
## [1] "leaflet"    "htmlwidget"

fig_leaflet

4. DT (DataTables) 객체

Interactive table

tbl_DT1

Some configuration

tbl_DT2 <- 
  datatable(iris, 
            caption = '(Caption) Table 1: This is iris dataset.',
            rownames = FALSE,
            fillContainer = FALSE, 
            options = list(pageLength = 8),
            class = 'cell-border stripe')
  • caption 위치를 바꿀 수도 있음
  • fillContainer = TRUE이면 크기를 자동 조정
  • options = list(pageLength = 12)로 초기 행의 갯수 지정
  • class = 'cell-border stripe'는 세로줄 추가

tbl_DT2

"The medium is the message - Marshall McLuhan"