2 min read

Week28 - d3treeR

Week28 - d3treeR

htmlwidgets News This Week

A gallery is really close. Just a little longer until its release, for all the newest and updated htmlwidgets, continue to search Github search.

Also, I should note that Week 2’s widget svgPanZoom achieved CRAN. Just ask if you would like me to work through the CRAN process for any others.

This Week’s Widget - d3treeR

Martijn Tennekes is one of my favorite R package authors. At Vis2014, he presented his work with Edwin de Jonge on treemaps and hierarchical colors both of which have R packages.

Bill White has done some very interesting work with d3.js. He has attacked the treemap problem on the JavaScript side and explained it all very well with source code (generously MIT licensed) in his post D3 TREEMAP WITH TITLE HEADERS.

Tennekes’ treemap in R gives us a powerful set of tools to transform, analyze, and color treemaps. Let’s combine all this functionality with the nice interactivity of Bill White’s d3.js treemaps in this week’s htmlwidget d3treeR.

Quick Installation

d3treeR is not yet on CRAN and won’t be unless someone asks, so for now please install with devtools::install_github.

devtools::install_github("timelyportfolio/d3treeR")

Examples

treemap as data

As stated in the introduction, d3treeR is built to work seamlessly with treemaps from the R treemap package.

# devtools::install_github("timelyportfolio/d3treeR")
library(treemap)
library(d3treeR)

# first example from ?treemap

data(GNI2010)
d3tree(
  treemap(
     GNI2010,
     index=c("continent", "iso3"),
     vSize="population",
     vColor="GNI",
     type="value"
   )
  ,rootname = "World"
)

# devtools::install_github("timelyportfolio/d3treeR")
library(treemap)
library(d3treeR)

# last example from ?treemap

data(business)
business$employees.growth <- business$employees - business$employees.prev
d3tree(
  # Brewer's Red-White-Grey palette reversed with predefined range
  treemap(business,
          index=c("NACE1", "NACE2"),
          vSize="employees",
          vColor="employees.growth",
          type="value",
          palette="-RdGy",
          range=c(-30000,30000))
  ,rootname = "World"
)

JSON as data

We can use JSON or lists from R to provide our hierarchy. Let’s use the ubiquitous flare.json.

library(treemap)
library(d3treeR)

  # with flare.json from Mike Bostock

d3tree(
  "http://bl.ocks.org/mbostock/raw/4063582/raw/flare.json"
  ,id = "name"
  ,height = 520
  ,width = 620
)

Thanks

Thanks so much to Martijn Tennekes, Edwin de Jonge, Mike Bostock, and Bill White.

As always, thanks to

  • Ramnath Vaidyanathan and RStudio for htmlwidgets
  • all the contributors to R and JavaScript