In hrbrmstr/taucharts: Create Interactive Charts with the JavaScript 'TauCharts' Library

knitr::opts_chunk$set(echo = TRUE)

An R htmlwidget interface to TauCharts.

On GitHub

Re-create TauCharts web site examples, starting with the data needed for the charts:

# devtools::install_github("hrbrmstr/taucharts")
library(taucharts)

scatter_dat <- structure(list(team = c("d", "d", "d", "d", "l", "l", "l", "l",
"k", "k", "k", "k"), cycleTime = c(1L, 2L, 3L, 4L, 2L, 3L, 4L,
5L, 2L, 3L, 4L, 5L), effort = c(1L, 2L, 3L, 4L, 1L, 2L, 3L, 4L,
4L, 5L, 6L, 8L), count = c(1L, 5L, 8L, 3L, 1L, 5L, 8L, 3L, 1L,
5L, 8L, 3L), priority = c("low", "low", "medium", "high", "low",
"low", "medium", "high", "low", "low", "medium", "high")), .Names = c("team",
"cycleTime", "effort", "count", "priority"), class = "data.frame", row.names = c(NA, 12L))

line_dat <- structure(list(type = c("us", "us", "us", "us", "us", "us", "bug",
"bug", "bug", "bug", "bug"), count = c(0L, 10L, 15L, 12L, 16L,
13L, 21L, 19L, 23L, 26L, 23L), date = c("12-2013", "01-2014",
"02-2014", "03-2014", "04-2014", "05-2014", "01-2014", "02-2014",
"03-2014", "04-2014", "05-2014")), .Names = c("type", "count",
"date"), class = "data.frame", row.names = c(NA, 11L))

bar_dat <- structure(list(team = c("d", "d", "d", "d", "l", "l", "l", "l",
"k", "k", "k", "k"), cycleTime = c(1L, 2L, 3L, 4L, 2L, 3L, 4L,
5L, 2L, 3L, 4L, 5L), effort = c(1L, 2L, 3L, 4L, 1L, 2L, 3L, 4L,
4L, 5L, 6L, 8L), count = c(1L, 5L, 8L, 3L, 1L, 5L, 8L, 3L, 1L,
5L, 8L, 3L), priority = c("low", "low", "medium", "high", "low",
"low", "medium", "high", "low", "low", "medium", "high")), .Names = c("team",
"cycleTime", "effort", "count", "priority"), class = "data.frame", row.names = c(NA, 12L))

car_dat <- structure(list(car = c("Toyota Prius+", "Volvo S60", "BMV X5",
"Infinity FX", "Mercedes Vito", "Peugeot 3008", "Subaru Forester",
"Lexus RX", "Bentley Continental"), co2 = c(96L, 135L, 197L,
238L, 203L, 155L, 186L, 233L, 246L), hp = c(99L, 150L, 306L,
238L, 95L, 120L, 150L, 188L, 507L), euroEco = c("eco", "eco",
"non-eco", "non-eco", "non-eco", "non-eco", "non-eco", "non-eco",
"non-eco"), power = c("low", "normal", "high", "high", "low",
"low", "normal", "normal", "high")), .Names = c("car", "co2",
"hp", "euroEco", "power"), class = "data.frame", row.names = c(NA, 9L))

splom_dat <- structure(list(param1 = c("hp", "hp", "hp", "co2", "co2", "co2",
"mpg", "mpg", "mpg", "hp", "hp", "hp", "co2", "co2", "co2", "mpg",
"mpg", "mpg", "hp", "hp", "hp", "co2", "co2", "co2", "mpg", "mpg",
"mpg", "hp", "hp", "hp", "co2", "co2", "co2", "mpg", "mpg", "mpg",
"hp", "hp", "hp", "co2", "co2", "co2", "mpg", "mpg", "mpg", "hp",
"hp", "hp", "co2", "co2", "co2", "mpg", "mpg", "mpg", "hp", "hp",
"hp", "co2", "co2", "co2", "mpg", "mpg", "mpg", "hp", "hp", "hp",
"co2", "co2", "co2", "mpg", "mpg", "mpg", "hp", "hp", "hp", "co2",
"co2", "co2", "mpg", "mpg", "mpg"), param2 = c("hp", "co2", "mpg",
"hp", "co2", "mpg", "hp", "co2", "mpg", "hp", "co2", "mpg", "hp",
"co2", "mpg", "hp", "co2", "mpg", "hp", "co2", "mpg", "hp", "co2",
"mpg", "hp", "co2", "mpg", "hp", "co2", "mpg", "hp", "co2", "mpg",
"hp", "co2", "mpg", "hp", "co2", "mpg", "hp", "co2", "mpg", "hp",
"co2", "mpg", "hp", "co2", "mpg", "hp", "co2", "mpg", "hp", "co2",
"mpg", "hp", "co2", "mpg", "hp", "co2", "mpg", "hp", "co2", "mpg",
"hp", "co2", "mpg", "hp", "co2", "mpg", "hp", "co2", "mpg", "hp",
"co2", "mpg", "hp", "co2", "mpg", "hp", "co2", "mpg"), value1 = c(99,
99, 99, 96, 96, 96, 3.8, 3.8, 3.8, 150, 150, 150, 135, 135, 135,
7.4, 7.4, 7.4, 306, 306, 306, 197, 197, 197, 11.2, 11.2, 11.2,
238, 238, 238, 238, 238, 238, 11.2, 11.2, 11.2, 95, 95, 95, 203,
203, 203, 9.4, 9.4, 9.4, 120, 120, 120, 155, 155, 155, 9.2, 9.2,
9.2, 150, 150, 150, 186, 186, 186, 10.4, 10.4, 10.4, 188, 188,
188, 233, 233, 233, 13.3, 13.3, 13.3, 507, 507, 507, 246, 246,
246, 15.4, 15.4, 15.4), value2 = c(99, 96, 3.8, 99, 96, 3.8,
99, 96, 3.8, 150, 135, 7.4, 150, 135, 7.4, 150, 135, 7.4, 306,
197, 11.2, 306, 197, 11.2, 306, 197, 11.2, 238, 238, 11.2, 238,
238, 11.2, 238, 238, 11.2, 95, 203, 9.4, 95, 203, 9.4, 95, 203,
9.4, 120, 155, 9.2, 120, 155, 9.2, 120, 155, 9.2, 150, 186, 10.4,
150, 186, 10.4, 150, 186, 10.4, 188, 233, 13.3, 188, 233, 13.3,
188, 233, 13.3, 507, 246, 15.4, 507, 246, 15.4, 507, 246, 15.4
)), .Names = c("param1", "param2", "value1", "value2"), class = "data.frame", row.names = c(NA,
81L))

Now, mimic a good chunk of section 5 (and some others) of the TauCharts basic examples. Interestingly enough, faceted charts work without any real code changes:

tauchart(scatter_dat) %>%
  tau_point("cycleTime", "effort", "team", "count")

ordered factors!

scatter_dat %>%
  {
    data.frame(
      .,
      cycleTimeFactor =factor(.$cycleTime,
                              levels=rev(unique(.$cycleTime)),
                              ordered=TRUE)
    )
  } %>%
  tauchart %>%
  tau_point("cycleTimeFactor", "effort", "team", "count")

custom colors!

tauchart(scatter_dat) %>%
  tau_point("cycleTime", "effort", "team", "count") %>%
  tau_color_manual(c("orange", "green", "black"))

tauchart(line_dat) %>%
  tau_line("date", "count", "type") %>%
  tau_guide_x(label="Month") %>%
  tau_guide_y(label="Count of completed entities", label_padding=50) %>%
  tau_guide_padding(70, 70, 10, 10)

tauchart(bar_dat) %>% tau_bar("team", "effort")

tauchart(bar_dat) %>% tau_bar("team", "effort", "priority")

tauchart(bar_dat) %>% tau_bar("effort", "team", horizontal=TRUE)

tauchart(bar_dat) %>% tau_bar("effort", "team", "priority", horizontal=TRUE)

legendary!

tauchart(car_dat) %>%
  tau_point("power", "co2", color="euroEco") %>%
  tau_legend()

tooltips!

tauchart(car_dat) %>%
  tau_point("power", "co2", color="euroEco") %>%
  tau_legend() %>%
  tau_tooltip()

basic facets!

print(car_dat)

tauchart(car_dat) %>%
  tau_point(c('euroEco', 'co2'), c('power', 'hp'))

scatterplot matrices!

tauchart(splom_dat) %>%
  tau_point(c("param1", "value1"), c("param2", "value2"))

trends!

tc <- tauchart(car_dat) %>%
  tau_point( "hp", c("euroEco","co2"), color = "euroEco" ) %>%
  tau_legend( ) %>%
  tau_tooltip( )

tc %>%
  tau_trendline( )  #using defaults

tc %>%
  #type does not seem to work as expected
  # so use models instead to change default type or order of dropdown
  tau_trendline( models = c( "logarithmic", "exponential" ) )

tc %>%
  # start with unclicked TREND LINE
  tau_trendline( showTrend = FALSE )

tc %>%
  #take the fun away from the user
  tau_trendline( showPanel = FALSE )

Now do some other things outside the examples

customize y axis labels!

how_good <- structure(list(
      Ranking = structure(
        1:5, .Label = c("Bottom", "Bellow Average",
                        "Average", "Above Average", "Top"), class = "factor"
      ), Prob = c(30L, 10L, 15L, 40L, 5L)/100
    ), .Names = c("Ranking", "Prob"), row.names = c(NA,-5L), class = "data.frame")

# NOTE my division by 100 in Prob above

tauchart(how_good) %>%
  tau_bar(x="Ranking", y="Prob") %>%
  tau_guide_y(tick_format="%")

the whole shebang!

data(cars_data)
tauchart(cars_data) %>%
  tau_point("milespergallon", c("class", "price"), color="class") %>%
  tau_legend() %>%
  tau_trendline() %>%
  tau_tooltip(c("vehicle", "year", "class", "price", "milespergallon"))

custom CSS rules!

make_black_tooltip <- function(tau) {
  tau %>%
    tau_add_css_rule(".tau-chart__tooltip { background: black; color: white; }") %>%
    tau_add_css_rule(".tau-chart__tooltip__exclude:hover { color: #65717f; background: linear-gradient(to right, rgba(255, 255, 255, 0) 100%, rgba(235, 238, 241, 0.9) 0%); }") %>%
    tau_add_css_rule(".tau-chart__tooltip__exclude { color: white; }") %>%
    tau_add_css_rule(".tau-chart__tooltip__list__elem { color: white; }") %>%
    tau_add_css_rule(".tau-chart__tooltip__list__elem:first-child { color: white; font-weight: bold; }") %>%
    tau_add_css_rule(".tau-chart__tooltip__gray-text { color: white; font-weight: bold; }")
}

tauchart(mtcars) %>%
  tau_point("wt", "mpg", color="cyl") %>%
  tau_color_manual(c("blue", "maroon", "black")) %>%
  tau_tooltip() %>%
  make_black_tooltip()

alternatively

tauchart(mtcars) %>%
  tau_point("wt", "mpg", color="cyl") %>%
  tau_color_manual(c("blue", "maroon", "black")) %>%
  tau_tooltip() %>%
  tau_add_css_rule(c(".tau-chart__tooltip { background: black; color: white; }",
                     ".tau-chart__tooltip__exclude:hover { color: #65717f; background: linear-gradient(to right, rgba(255, 255, 255, 0) 100%, rgba(235, 238, 241, 0.9) 0%); }",
                     ".tau-chart__tooltip__exclude { color: white; }",
                     ".tau-chart__tooltip__list__elem { color: white; }",
                     ".tau-chart__tooltip__list__elem:first-child { color: white; font-weight: bold; }",
                     ".tau-chart__tooltip__gray-text { color: white; font-weight: bold; }"))