Creating Pop Ups On Click With Highcharts Map

Question

I'm creating a map of counties in Michigan using Highcharts. My code so far is below:

hcmap(  
"countries/us/us-mi-all",   
data = dataframe,   
value = "distance",   
joinBy = c("name", "county"),   
name = "Distance",   
dataLabels = list(enabled = TRUE, format = "{point.name}"),   
borderColor = "#FAFAFA",   b
orderWidth = 0.1,   
tooltip = list(pointFormat = "<b>{point.name}</b> <br><br> <b>Distance</b>: {point.value:.1f} Miles <br><b>Total</b>: {point.n_total}")) |>  
hc_title(text="<b>Distance by County</b>", style=list(color="#FAFAFA", useHTML=TRUE, fontSize='25px'))  

I am hosting the map on an R Shiny dashboard and want to create popups that appear on the same page with additional information about each county when the user clicks on a county on the map (this info is stored in other columns of the dataframe). The pop ups in this map are exactly what I'm looking for (although with a table of info rather than the pie chart) but I am having trouble converting it to my code: https://jsfiddle.net/api/post/library/pure/

I have tried using the jsfiddle link above and also tried to use the plotOptions argument to create pop ups that appear on click, but I haven't been able to make it work. I keep getting a "object 'Series' is not found" error whenever I try to use plotOptions. Any help is much appreciated!

Answer 1

I've recreated an example using sample data used in the highcharter package documentation.

mapdata <- get_data_from_map(download_map_data("custom/usa-and-canada"))

data_fake <- mapdata |>
  select(code = `hc-a2`) |>
  mutate(value = 1e5 * abs(rt(nrow(mapdata), df = 10)))

hcmap(
  "custom/usa-and-canada",
  data = data_fake,
  value = "value",
  joinBy = c("hc-a2", "code"),
  name = "Fake data",
  dataLabels = list(enabled = TRUE, format = "{point.name}"),
  borderColor = "#FAFAFA",
  borderWidth = 0.1,
  allowPointSelect = TRUE,
  tooltip = list(
    valueDecimals = 2,
    valuePrefix = "$",
    valueSuffix = "USD"
  )
) |> hc_plotOptions(
  series = list(
    events = list(
      click = JS(
        "function(event){ alert(this.name + ' clicked') }"
      )
    )
  )
)

The key is to substitute each curly brace instance with list() and then R can accept JavaScript in the function as long as it's enclosed with JS() and the actual JavaScript is passed as a character by surrounding it with double quotation marks, e.g., JS("custom JavaScript here"). However, this click event does not replicate the example jsfiddle link you provided. You may need to substitute with the JavaScript function used in the example, and tailor as needed to your data set.