In jbkunst/highcharter: A Wrapper for the 'Highcharts' Library

library(highcharter)
options(highcharter.theme = hc_theme_hcrt(tooltip = list(valueDecimals = 2)))

Introduction

We chart data, and data can come in different ways: numeric or character vectors, as time series objects, etc. but the most common object with data is a data frame. So, we'll show how chart this type of object in highcharter.

Highcharter have two main functions to create a chart from data and another to add data to an existing highchart object.

1. hchart(): A generic function which take an object (like vector, time series, data frames, likert object, etc) and return a highchart object (chart)
2. hc_add_series(): A generic function which add data to a existing highchart object depending the type (class) of the data.

There are a last function will be useful to chart data from data frame. The functions is hcaes which will define the aesthetic mappings. This 3 functions are inspired in ggplot2 package. So:

• hchart() works like ggplot2's qplot.
• hc_add_series() works like ggplot2's geom_s.
• hcaes() works like ggplot2's aes.

The main differences with ggplot2 are here we need the data and the aesthetics explicit in every highcharts functions.

First, show some data to work with.

data("mpg", "diamonds", "economics_long", package = "ggplot2")
head(mpg)

In general we'll use this structure to get a chart:

hchart(<data.frame>, <type_of_chart>, hcaes(<aesthetics>), ...)

• <data.frame> will be the data to chart.
• <type_of_chart> is a string to specify the type of chart. This value can be: line, spline, area, heatmap, treemap, etc.
• <aesthetics> is the mapping to use for plot.
• ... are other parameters to configure the chart.

So, a basic example would be:

hchart(mpg, "point", hcaes(x = displ, y = cty, group = year))

Exercising the basics

Let's try other charts to get familiar with the syntax.

data(economics_long, package = "ggplot2")

economics_long2 <- dplyr::filter(economics_long, variable %in% c("pop", "uempmed", "unemploy"))

head(economics_long2)

hchart(economics_long2, "line", hcaes(x = date, y = value01, group = variable))

Now, a heatmap and a treemap.

library(dplyr)

dfdiam <- diamonds |> 
  group_by(cut, clarity) |>
  summarize(price = median(price))

hchart(dfdiam, "heatmap", hcaes(x = cut, y = clarity, value = price), name = "Median Price") 

mpgman <- mpg |> 
  group_by(manufacturer) |> 
  summarise(n = n(),
            unique = length(unique(model))) |> 
  arrange(-n, -unique)

hchart(mpgman, "treemap", hcaes(x = manufacturer, value = n, color = unique))

Extra parameters

You can add other parameters to add options to the data series. This options can modify the names of each series/group. These names are used in the legend as well the tooltip. You can modify the colors and a lot of properties.

mpgman2 <- count(mpg, manufacturer, year)

hchart(
  mpgman2, 
  "bar",
  hcaes(x = manufacturer, y = n, group = year),
  color = c("#7CB5EC", "#F7A35C"),
  name = c("Year 1999", "Year 2008"),
  showInLegend = c(TRUE, FALSE) # only show the first one in the legend
  )

Highcharts has a very complete API with a lot of options. You can see every option in action in https://api.highcharts.com/highcharts/plotOptions.series.

A more advanced example

Using the broom package is really nice due the you can transform models to tidy data:

library(broom)

modlss <- loess(dist ~ speed, data = cars)

fit <- arrange(augment(modlss), speed) |> 
  mutate(.se = predict(modlss, se = TRUE)$se.fit)

head(fit)

In this case we'll chart the original data first and store in a variable called hc (for highcharts):

hc <- hchart(
  cars,
  type = "scatter",
  hcaes(x = speed, y = dist),
  name = "Speed and Stopping Distances of Cars",
  showInLegend = TRUE
  )

hc

We can add more series to chart (like the layers in ggplot world) using the function hc_add_series. The parameters in this functions are similar to the hchart:

hc_add_series(<highcarter_object>, <data.frame>, <type_of_chart>, hcaes(<aesthetics>), ...)

# or with the pipe:

<highcarter_object> |> hc_add_series(<data.frame>, <type_of_chart>, hcaes(<aesthetics>), ...)

In this case we will add 2 groups of series. The 1st to add will be the spline then the arearange. So we'll use hc_add_series 2 times.

qtint <- qt(0.975, predict(modlss, se = TRUE)$df)

hc |>
  hc_add_series(
    fit,
    type = "spline",
    hcaes(x = speed, y = .fitted),
    name = "Fit",
    id = "fit", # this is for link the arearange series to this one and have one legend
    lineWidth = 1,
    showInLegend = TRUE
    ) |> 
  hc_add_series(
    fit,
    type = "arearange",
    name = "SE",
    hcaes(x = speed, low = .fitted - qtint*.se, high = .fitted + qtint*.se),
    linkedTo = "fit", # here we link the legends in one.
    showInLegend = FALSE,
    color = hex_to_rgba("gray", 0.2),  # put a semi transparent color
    zIndex = -3 # this is for put the series in a back so the points are showed first
    )

Example of data from https://stackoverflow.com/questions/22717930/how-to-get-the-confidence-intervals-for-lowess-fit-using-r.

What now?

Since you know the basics now it could be interesting:

• Go motivate yourself with the vignette("showcase") and observe everything that can be done with the highcharter package.
• Learn to configure graphics using the implemented API in vignette("highcharts-api").
• See all chart you can make in vignette("highcharts").

jbkunst/highcharter documentation built on March 14, 2024, 12:52 a.m.