'theme: field'에 해당되는 글 1건

  1. 2017.05.02 [R] rmarkdown HTML 문서의 포맷 정하기 7

지난번 포스팅에서는 

- RStudio 에 내장되어 있는 .Rmd 소스파일을 가지고 HTML 문서를 만들기와 

- servr 패키지의 rmdv2() 함수를 사용해서 .Rmd 소스파일을 렌더링해서 로컬 웹 서버(포트 4321)로 올리는 방법을 알아보았습니다. 


이번 포스팅부터는 .Rmd 소스파일 안으로 들어가서 하나씩 더 자세히 알아보도록 하겠습니다. 

.Rmd 소스파일은 (1) YAML Header, (2) Code Chunk, (3) Markdown text 로 구성됩니다.  이중에서 이번 포스팅에서는 먼저 (1) YAML Header부터 시작해보겠습니다. 


[ .Rmd source file 구성 ]


YAML Header에는 title, author, date, output 등의 메타정보를 지정합니다.  특히, output 필드에는  rmarkdown 문서의 포맷으로서 HTML, pdf, MS word, Beamer Presentation 등을 지정할 수가 있는데요, 이번 포스팅에서는 HTML output format 에 대해서 소개하겠습니다. 




YAML Header 작성에 지켜야하는 문법이 몇가지 있습니다. 


(1) YAML Header는 '---' 로 시작해서 안에 문서에 대한 메타정보를 작성하고 '---'로 끝을 냅니다. 

(2) 상하관계는 space bar 로 들여쓰기(보통 2칸)를 해서 구분합니다. 

(3) 각 필드는 colon (':') 을 이용해서 key : value 형태로 입력합니다. (예 title: "My_First_R_MarkDown")

(4) value 는 큰 따옴표(" ")나 작은 따옴표(' ')를 사용하거나 혹은 그냥 아무런 표시 없이 입력합니다.

(5) key : value 쌍에서 value가 2개 이상일 경우 (5-1) 대괄호([ ]) 안에 value를 나열하고 comma(,) 로 구분하거나, 또는 (5-2) 한 줄에 한개의 value를 hyphen ('-')을 사용해서 나열합니다. 

---

Seoul: [Jonro, Gangnam, Ganak]

Sungnam:

  - Bungdang

  - Suwon

  - Anyang

---  




이제 YAML Header 의 output: html_document 를 사용해서 HTML 문서의 옵션을 설정하는 방법을 소개하겠습니다.  그리 어렵지 않습니다. 


 (1) 목차 만들기 (Table of Contents) > toc: true


toc: true 옵션을 설정해주면 목차를 자동으로 생성해줍니다. 

toc_depth: 2 옵션을 설정해주면 목차를 자동 생성할 때 목차의 깊이(depth)를 어디까지 할지 지정해줄 수 있습니다. '2'로 하면 '##', '3'으로 하면 '###' 수준까지 목차를 알아서 만들어줍니다. 

---

title: "My_First_R_MarkDown"

author: "RFriend"

date: '2017.05.02'

output

  html_document

    toc: true

    toc_depth: 2

--- 



 (2) 문서 단락 번호 자동부여 하기 (section numbering) > number_sections: true

문서의 단락('#', '##', '###' 등으로 구분)에 따라서 자동으로 문서 번호를 부여하기 위해서는 number_sections: true 옵션을 지정해주면 됩니다.  문서 작성할 때 알아서 스마트하게 번호를 따주면 실수할 염려도 없고 신경쓸 일도 없어서 아주 유용하겠지요?!

---

title: "My_First_R_MarkDown"

author: "RFriend"

date: '2017.05.02'

output: 

  html_document: 

    toc: true

    toc_depth: 2

    number_sections: true

--- 



  (3) 유동적인 목차 만들기 (Floating TOC) > toc_float: true

만약 문서가 길다면 커서로 HTML 문서를 scrolling 하게 되면 상단에 위치한 목차(Table of Contents)가 시야에서 사라지게 됩니다.  그래서 목차를 보려면 다시 scroll up 해야 하는 불편이 있습니다.  이럴때 유용하게 사용할 수 있는 옵션이 toc_float: true 옵션입니다.  scroll 하면 목차가 현재 화면으로 따라다니면서 항상 목차를 볼 수 있도록, 그래서 목차의 특정 하위 목차를 선택하면 바로 그 목차 부분으로 직행할 수 있는 인터페이스를 제공해줍니다. 

---

title: "My_First_R_MarkDown"

author: "RFriend"

date: '2017.05.02'

output: 

  html_document: 

    toc: true

    toc_depth: 2

    toc_float: true

    number_sections: true

---


toc_float: 옵션의 디폴트 설정은 collapsed: true (목차에 최상위 수준만 나타남), smooth_scroll: true (특정 목차를 마우스로 선택했을 때 웹 화면이 부드럽게 움직이면서 해당 목차로 이동) 인데요, 이걸 바꾸고 싶다면 아래처럼 설정을 바꾸면 됩니다. 상하 위계를 고려해서 들여쓰기(indentation) 주의해서 하시기 바랍니다. 

---

title: "My_First_R_MarkDown"

output:

  html_document:

    toc: true

    toc_float:

      collapsed: false

      smooth_scroll: false

---



  (4) 탭으로 구분하여 부분별 내용 만들기 (Tabbed Sections) > {.tabset} class


{.tabset} class attribute 을 사용하면 HTML 본문 내용을 탭(Tab) 으로 구분하고, 탭을 선택하면 그 부분의 내용이 나타나도록 할 수도 있습니다. 가령, 국가나 지역별로 매출, 수익 등을 표로 작성한 후에 국가나 지역을 탭(tba)으로 구분해 주면 원하는 국가나 지역 탭을 선택해서 볼 수 있어 편리할 것입니다. 

---

title: "My_First_R_MarkDown"

author: "RFriend"

date: '2017.05.02'

output: 

  html_document: 

    toc: true

    toc_depth: 2

    toc_float:

      collapsed: true

      smooth_scroll: true

    number_sections: true

---


## Tab by country {.tabset}

### Korea

this tab is for Korea


### China

this tab is for Chian


### Japan

this tab is for Japan




  (5) HTML 문서 모습과 스타일 (Appearance and Style) > theme: cerulean

HTML 문서의 전체적인 모습과 스타일을 지정해줄 수 있는 theme 옵션에는 "default",  "cerulean", "journal", "flatly", "readable", "spacelab", "united", "cosmo", "lumen", "paper", "sandstone", "simplex", "yeti" 등이 있습니다.  

---

title: "My_First_R_MarkDown"

author: "RFriend"

date: '2017.05.02'

output: 

  html_document: 

    toc: true

    toc_float: true

    number_sections: true

    theme: journal

---


다양한 theme 중에서 아래 화면 캡쳐 예시를 참고해서 원하는 취향의 theme을 선택해서 지정해주면 됩니다. 


[ 다양한 HTML 문서 스타일 theme ]






많은 도움 되었기를 바랍니다. 

이번 포스팅이 도움이 되었다면 아래의 '공감~♡'를 꾸욱 눌러주세요. ^^







728x90
반응형
Posted by Rfriend
,