d3radarR

Charles Allen at TennisVisuals blogging at tennisvis.blogspot.com has been doing some really incredible visualization work for tennis. When I saw his reusable iteration ofNadieh Bremer’s redesigned radar chart I instantly wanted it in R. This week I offer an early and rough htmlwidget implementation in d3radarR. I only wish I could more fully support all of the options and accessors included with the radar chart. Next year, once I wrap up a widget a week, I hope to revisit this. As always, any feedback and polite requests motivate and inspire me.

Installation

This is not on CRAN, so to install we will need some help fromdevtools::install_github.

devtools::install_github("timelyportfolio/d3radarR")

Examples

Recreating the included examples is usually a good place to start. Let’s recreate the phone data radar chart.

# devtools::install_github("timelyportfolio/d3radarR")library(d3radarR)# use data from demo#   https://github.com/TennisVisuals/updating-radar-chart/blob/master/radarDemo.jsjson_data = jsonlite::fromJSON('  [      {        "key":"Nokia Smartphone",      "values":[          {  "axis":"Battery Life", "value":0.26 }, {  "axis":"Brand", "value":0.10 },        {  "axis":"Contract Cost", "value":0.30 }, {  "axis":"Design And Quality", "value":0.14 },        {  "axis":"Have Internet Connectivity", "value":0.22 }, {  "axis":"Large Screen", "value":0.04 },        {  "axis":"Price Of Device", "value":0.41 }, {  "axis":"To Be A Smartphone", "value":0.30 }        ]    },    {        "key":"Samsung",      "values":[          {  "axis":"Battery Life", "value":0.27 }, {  "axis":"Brand", "value":0.16 },        {  "axis":"Contract Cost", "value":0.35 }, {  "axis":"Design And Quality", "value":0.13 },        {  "axis":"Have Internet Connectivity", "value":0.20 }, {  "axis":"Large Screen", "value":0.13 },        {  "axis":"Price Of Device", "value":0.35 }, {  "axis":"To Be A Smartphone", "value":0.38 }        ]    },    {        "key":"iPhone",      "values":[          {  "axis":"Battery Life", "value":0.22 }, {  "axis":"Brand", "value":0.28 },        {  "axis":"Contract Cost", "value":0.29 }, {  "axis":"Design And Quality", "value":0.17 },        {  "axis":"Have Internet Connectivity", "value":0.22 }, {  "axis":"Large Screen", "value":0.02 },        {  "axis":"Price Of Device", "value":0.21 }, {  "axis":"To Be A Smartphone", "value":0.50 }        ]    }  ]',  simplifyDataFrame = FALSE)d3radar(json_data)

You might notice the data format is not very R-like. One of the most immediate needs for this implementation would be a data transformer for R. I unfortunately ran out of time this week, so we might need to learn a little dplyr and purrr to work withdata.frames. Let’s look at a mtcars as a radar.

# devtools::install_github("timelyportfolio/d3radarR")# use example from ?starslibrary(d3radarR)library(scales)library(dplyr)library(purrr)# this is ugly#  should probably include some conversion helpersmtcars %>%  add_rownames( var = "key" ) %>%  mutate_each(funs(rescale), -key) %>%  #limit to 8 rows for manageability  head(8) %>%  by_row(    function(row){      list(        key = row[["key"]],        values = lapply(          names(row)[-match("key",names(row))],          function(nm){            list(              "axis" = nm,              "value" = row[[nm]]            )          }        )      )    }  ) %>%  {    d3radar( .$.out )  }

I hear that a certain team that I might like might be playing an important game soon. Let’s looks at a radar chart using ESPN efficiency ratings. Here is where colors would be really helpful, but I just didn’t have the time.

# devtools::install_github("timelyportfolio/d3radarR")library(d3radarR)# source : http://espn.go.com/college-football/statistics/teamratings/_/tab/efficiencyespn_efficiency <- list(  list(    key = "Alabama",    values = list(      list(axis = "offense", value = 70.9/100),      list(axis = "defense", value = 92.9/100),      list(axis = "specialtms", value = 58.3/100)    )  ),  list(    key = "Oklahoma",    values = list(      list(axis = "offense", value = 83.3/100),      list(axis = "defense", value = 83.1/100),      list(axis = "specialtms", value =42.6/100)    )  ),  list(    key = "Clemson",    values = list(      list(axis = "offense", value = 81.3/100),      list(axis = "defense", value = 87.1/100),      list(axis = "specialtms", value = 32.4/100)    )  ),  list(    key = "Michigan State",    values = list(      list(axis = "offense", value = 70.5/100),      list(axis = "defense", value = 73.2/100),      list(axis = "specialtms", value = 39.0/100)    )  )  )d3radar( espn_efficiency )

Thanks

Thanks Charles Allen at TennisVisuals for his great work and in particular his responsiveness to my pestering on his updating radar chart.

As always, thanks to

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