R 분석가라면 Shiny가 대화식 데이터 시각화에 이상적이라는 것을 알고 있습니다. 그러나 때로는 하나의 Shiny 페이지에 모든 그래프를 맞추기란 쉽지 않은게 사실입니다. 대시보드를 사용하면 보고서를 섹션, 패널 및 탭으로 구분하여 보고서를 직관적으로 구성 할 수 있습니다. 덕분에 최종 사용자가 작업을 훨씬 쉽게 탐색 할 수 있습니다.

shinydashboard는 그럭저럭 괜찮은 패키지 입니다만, 이를 사용하여 여러개의 앱을 만들어 보면 모두 비슷해 보이고 디자인이 그다지 미려하지 않습니다. 반면,semantic.dashboard는 시맨틱 UI를 사용하는 훌륭한 패키지 입니다. 덕분에 앱에 아름다운 시맨틱 구성 요소를 도입하고 다양한 주제 중에서 선택할 수 있습니다. (semantic.dashboard가 아직 설치되어 있지 않은 경우 해당 GitHub 페이지에서 자세한 지침을 확인하시고 아래와 같이 설치하시기 바랍니다)

 

시작하기

빈 대시보드를 만드는 것으로 시작해 볼까요? 아래와 같이 코드를 작성해 보시기 바랍니다.

비교를 위해 라이브러리 (semantic.dashboard)를 라이브러리 (shinydashboard)로 변경하면 어떻게되는지 확인해 보시기 바랍니다.

코드를 실행시키면 아래와 같은 빈 Shiny 화면이 나오게 됩니다.

거의 별다른 노력을 들이지 않고 첫 번째 semantic.dashboard 앱을 위한 골격을 만들 수 있습니다. 각 dashboardPage 는 header, sidebar, body 세 가지 요소로 구성됩니다.이제 이 기본 골격에 제목을 추가하고 색상을 변경해 보겠습니다.

사이드바에 두 개의 메뉴 요소를 추가합니다.

 

아래와 같은 화면으로 구성됩니다.

이제 menuItem에 아이콘을 추가하여 좀 더 미려한 화면을 만들 수 있습니다. (참고로 R 콘솔에서 ?menuItem 를 입력하여 보다 자세한 설명을 볼 수 있습니다)

 

콘텐츠 추가 하기

이제 이 앱에 콘텐츠를 채워 봅시다. 여기에 대중 교통 데이터 세트 “mtcars”를 사용해 봅시다. 이 데이터 세트는 1974 Motor Trend US 잡지에서 추출되었습니다. 이 잡지는 32 개의 구식 자동차의 일부 매개 변수로 구성됩니다. 그 전에 다음 코드를 살펴보시면 탭을 사용하여 body의 내용을 변경하는 방법을 아실 수 있습니다.

 

우리는 menuItem 와 정확히 같은 tabItem를 가진 두 개의 tabItem 을 만들었습니다. tabItem의 선택된 매개 변수는 앱을 실행 한 후 선택하고 표시해야하는 tabItem을 알려줍니다.

그 지식을 갖추고, 우리는 마침내 정말로 기능적인 것을 구현할 수 있습니다. 우리는 자동차의 기어 박스 유형과 갤런 당 매개 변수 간의 관계를 설명하는 간단한 그림을 작성하는 것으로 시작합니다.

 

 

ggplot2를 사용하고 있기 때문에이 패키지를 스크립트 시작 부분에 첨부하는 것을 잊지 마시기 바랍니다. 이 데이터 세트에서 다른 플롯을 만들려고합니다. 따라서 메인 페이지를 두 섹션으로 나누십시오. 우리는 fluidRow 함수의의 내용을 변경 할 수 있습니다. 첫 번째 tab의 기능은 다음과 같습니다.

 

 

대화형 항목들

대화형 플롯을 대시 보드에 추가해 보도록 하겠습니다. 자동차의 무게와 갤런 당 마일 사이의 관계를 “plotly” 로 표현해 봅시다. 몇 가지 추가 정보를 포함시킬 수 있기 때문에 여기에 포인트 플롯을 사용해 보도록 합시다. 색상으로 실린더의 수를 표시하고 점의 크기는 0.25 마일 시간을 표시합니다.

앱의 SemnaticUI 레이아웃과 일관성을 유지하기 위해 그래프 색상에 semantic_palette 를 사용했습니다. 대시보드에 삽입 하려면 두 번째 상자에 유추하여 추가합니다.

실행해 보면 메인 페이지가 아래와 같이 보일겁니다.

 

이제 다른 [Extra] 탭으로 전환해서 자동차 속송의 전체 목록을 표시해 보도록 합시다. 이를 위해 DT 패키지를 사용하여 서버측 테이블을 렌더링 합니다.

그리고, 두번째 탭 [Extra]에 표시해 봅시다.

 

이렇게 완성본을 만들어 봤습니다. 이제 대시보드의 테마를 수정해 보겠습니다. Semantic Forest 웹 사이트에서 옵션을 검토하고 cerulean 을 적용해 봅시다. dashboardPage 함수에서 하나의 매개변수만 변경하기 때문에 테마를 지금 변경하는 것은 매우 쉽습니다.

이 앱의 작동 원리를 살펴 보겠습니다.

전체 코딩 스크립트

지금까지 semantic.dashboard 패키지로 첫 번째 Shiny 대시보드를 작성해봤습니다. 지금까지 설명했던 스크립트를 아래와 같이 확인할 수 있습니다. 이를 바탕으로 응용하여 좀더 확장된 대시보드를 작성할 수 있습니다.

참고 리소스

 

 

출처: Create outstanding dashboards with the new semantic.dashboard package