Highcharts - Highcharter in R - Getting Tooltip values from df rather than map - r

Question

I'm attempting to create a map graph with highlighted tiles using highcharter in R.
I managed to retrieve a JSON map, create a dataframe with my data, and generate a highcharter map graph. I'm now customizing the toolip, which should display the country name, region and the number integer in my dataframe's count column. Using the hc_tooltip() function returns the name and region, but doesn't find the values. I suspect this is due to the tooltip function looking in the map data rather than my dataframe. I'm unsure how to change that. Here's an example:
map <- "https://code.highcharts.com/mapdata/custom/world-highres.geo.json" %>%
GET() %>%
content() %>%
jsonlite::fromJSON(simplifyVector = FALSE)
sample_table <- data.frame(name = c("Spain","France","China"),
continent = c("Europe","Europe","Asia"),
occurences = c(150,70,120))
cols3 <- scales::viridis_pal(option = "turbo",
begin = 0.4,
direction = 1)(length(unique(sample_table$name)))
highchart(type = "map") %>%
hc_title(text = "Map Title") %>%
hc_subtitle(text = "Map Subtitle") %>%
hc_add_series_map(map = map, df = sample_table, joinBy = "name", value = "occurences",
dataLabels = list(enabled = TRUE
,format = "{point.properties.hc-a2}")
) %>%
hc_colors(cols3) %>%
hc_colorAxis(stops = color_stops(colors = cols3)) %>%
hc_tooltip(
useHTML = TRUE,
formatter = JS(
"
function(){
outHTML = '<b>' + this.point.name + '</b> <br>' + this.point.continent +
'</b> <br>' + this.point.occurences
return(outHTML)
}
"
))%>%
hc_mapNavigation(enabled = TRUE)
Where the table contains the following
name continent occurences
1 Spain Europe 150
2 France Europe 70
3 China Asia 120
As you can see from the image, I get the country and continent name as intended, but I do not get the number of occurrences. Is there a way to get the tooltip values from both the map data and the dataframe?

Answer 1

When you included hc_add_series_map you defined the value of the variable to chart as "occurences". To include this column in your formatter, try using:
this.point.value
instead of referencing the column name.
Here is the complete example:
library(highcharter)
library(httr)
map <- "https://code.highcharts.com/mapdata/custom/world-highres.geo.json" %>%
GET() %>%
content()
sample_table <- data.frame(name = c("Spain","France","China"),
continent = c("Europe","Europe","Asia"),
occurences = c(150,70,120))
cols3 <- scales::viridis_pal(option = "turbo",
begin = 0.4,
direction = 1)(length(unique(sample_table$name)))
highchart(type = "map") %>%
hc_title(text = "Map Title") %>%
hc_subtitle(text = "Map Subtitle") %>%
hc_add_series_map(map = map,
df = sample_table,
joinBy = "name",
value = "occurences",
dataLabels = list(enabled = TRUE,format = "{point.properties.hc-a2}")
) %>%
hc_colors(cols3) %>%
hc_colorAxis(stops = color_stops(colors = cols3)) %>%
hc_tooltip(
useHTML = TRUE,
formatter = JS(
"
function(){
outHTML = '<b>' + this.point.name + '</b> <br>' + this.point.continent +
'</b> <br>' + this.point.value;
return(outHTML)
}
"
)) %>%
hc_mapNavigation(enabled = TRUE)
Map