Andrew Brēza
Andrew Brēza

Reputation: 8317

Hyperlink bar chart in Highcharter

I'm having trouble recreating this answer in R with Highcharter to make the bars in a bar chart into clickable URLs. Here is the Javascript code from the answer. Highcharter has a vignette about recreating Javascript that I tried to follow. Here's what tried so far. It doesn't show any of the bars.

library(tidyverse)
library(highcharter)

highchart() %>%
  hc_chart(type = "column") %>%
  hc_title(text = "Click points to go to URL") %>%
  hc_xAxis(type = "category") %>%
  hc_plotOptions(series = list(cursor = "pointer"),
                 point =
                   list(events = list(
                     click = JS(
                       "function () {
                       location.href = 'https://en.wikipedia.org/wiki/' +
                       this.options.key;
                       }"
                     )
                     ))) %>%
  hc_series(
    list(name = "USA", key = "United_States", y = 29.9),
    list(name = "Canada", key = "Canada", y = 71.5),
    list(name = "Mexico", key = "Mexico", y = 106.4)
  )

Upvotes: 0

Views: 913

Answers (1)

jbkunst
jbkunst

Reputation: 3029

Andrew,

You have some (2) errors replicating the example:

  1. If you check carefully the example you gave. The point argument lives at the same depth of cursor in the series argument.
  2. You didn't add the data in the correct way (like the vignette show).

A fixed version of your code is:

highchart() %>%
  hc_chart(type = "column") %>%
  hc_title(text = "Click points to go to URL") %>%
  hc_xAxis(type = "category") %>%
  hc_plotOptions(
    series = list(
      cursor = "pointer",
      point = list(
        events = list(
          click = JS( "function () { location.href = 'https://en.wikipedia.org/wiki/' + this.options.key; }")
          )
        )
      )
    ) %>%
  hc_series(
    list(
      data = list(
        list(name = "USA", key = "United_States", y = 29.9),
        list(name = "Canada", key = "Canada", y = 71.5),
        list(name = "Mexico", key = "Mexico", y = 106.4)
        )
      )
  )

And a better version to add the data would be:

dat <- data.frame(
  country = c("USA", "Canada", "Mexico"),
  url = c("United_States", "Canada", "Mexico"),
  value = c(29.9, 71.5, 106.4)
)

highchart() %>%
  hc_xAxis(type = "category") %>%
  hc_plotOptions(
    series = list(
      cursor = "pointer",
      point = list(
        events = list(
          click = JS( "function () { location.href = 'https://en.wikipedia.org/wiki/' + this.options.key; }")
          )
        )
      )
    ) %>%
  hc_add_series(data = dat, type = "column", mapping = hcaes(name = country, key = url, y = value))

Hope its helps

Upvotes: 2

Related Questions