7.3 r2d3

이 장의 처음 두 섹션에서 설명하는 패키지는 모두 대부분의 데이터 유형을 시각화하는 풍부한 개체를 제공한다. 그러나 결국 우리의 그래픽은 다른 사람들이 디자인하고 모든 R 개발자가 사용할 수 있는 그래픽처럼 보일 것이다.

시각화의 모든 측면을 절대적으로 제어하려는 몇 가지 사용 사례가 있다. 우리에게 도움이 되는 위젯이 없거나 고도로 맞춤화된 무언가가 필요하다. 여기서 D3가 우리를 도울 수 있고 r2d3는 D3를 RStudio 프로젝트에 통합하는 데 사용할 수있는 패키지이다.

htmlwidgets와 마찬가지로 D3는 웹 기반 Javascript 솔루션이다. 그러나 D3를 사용하는 것은 htmlwidget으로 하는 것보다 더 복잡하다. D3는 본질적으로 프로그래밍 언어이다.

D3의 핵심 아이디어는 그래픽 프리미티브 (선 및 원과 같은 것)로 데이터 세트를 결합할 수 있다는 것이다. 이러한 그래픽은 데이터 세트의 값에 따라 늘어나거나 줄어 들게 된다. D3 그래픽은 모양을 제어할 수 있기 때문에 매우 복잡해질 수 있다. D3의 학습은 범위를 벗어나지만 시작하기 위한 간단한 방법은 살펴보기로 한다.

NOTE 여기에서 설명하는 기능을 사용하려면 다운로드한 RStudio의 현재 버전에서 사용할 수있는 RStudio 1.2가 필요하다. 그러나 이 장에서 사용된 버전은 RStudio의 미리보기 버전이므로 스크린 샷이 다소 다르게 보일 수 있다.

D3를 사용하려면 RStudio 메뉴로 이동 한 다음 “파일,” “새 파일,” “D3 스크립트”를 차례로 선택합니다. D3 코드가있는 파일이 나타납니다.

// !preview r2d3 data=c(0.3, 0.6, 0.8, 0.95, 0.40)
//
// r2d3: https://rstudio.github.io/r2d3 
var barHeight = Math.ceil(height / data.length);
svg.selectAll('rect')
.data(data)
.enter().append('rect')
.attr('width', function(d) { return d * width; })
.attr('height', barHeight)
.attr('y', function(d, i) { return i * barHeight; })
.attr('fill', 'steelblue');

이 파일의 코드는 Javascript이며 이 코드를 수정하여 시각화를 조정할 수 있다. 이 파일을 저장하고 “미리보기” 버튼을 클릭하여 D3 시각화가 어떻게 보이는지 확인한다. 앞서 강조한 사전 패키징된 솔루션과 비교하면 별로 좋아 보이지 않지만, D3는 실제로 그릴 수있는 캔버스를 더 많이 제공하므로 괜찮다.

미리보기는 단순히 파일의 주석에 있는 코드를 사용하지만 R 스크립트 파일에서 자체 데이터를 제공하는 경우 r2d3 라이브러리를 사용하여 수행할 수 있다.

library(r2d3)
r2d3(data = c(.1,.2,.3,.4,.3,.2,.1),
script = "d3_plot.js")

이 코드는 그림 7.7의 플롯을 생성한다.

그림 7.7: 기본 D3 플롯

분명히 이것은 매우 기본적인 시각화이다. r2d3 웹 사이트에서 D3로 할 수있는 멋진 시각화 전체 세트를 확인할 수 있다. 이러한 예제에는 사용자 고유의 D3 사용자 지정 시각화를 위한 시작점으로 사용할 수 있도록 해주는 필요한 코드도 포함하고 있다.