1

I would like to add interactive map points on a map that I created using highcharter. Everything looks fine up to the point that I add those points.

While the points appear on the correct location, the colors and legend change completely.

Here's my example code.

These are the data frames for the reproducible example.

#Data frame with patients per state
abbr <- c("AK", "GA", "CA", "CT", "HI", "IA", "KY", "LA", "NJ", "NM", "WA", "UT")
fips <- c("02", "13", "06", "09", "15", "19", "21", "22", "34", "35", "53", "49")
V2 <- c(4, 22, 77, 16,  0,  5,  6,  9, 15,  3, 13, 22)
States<- data.frame(abbr, fips, V2)

#Data frame with center locations
name <- c("UCLA", "Stanford")
lon <- c(-118.26, -122.17)
lat <- c(34.04, 37.43)
VHL_centers <- data.frame(lon, lat, name)

This is the part of the code that works correctly.

hcmap("https://code.highcharts.com/mapdata/countries/us/us-all.js", #Construct map
                     data = States,
                     name = "Patient number",
                     value = "V2", 
                     joinBy = c("postal-code", "abbr"),
                     borderWidth = 1,
                     borderColor = "darkred",
                     dataLabels = list(enabled = TRUE, format = "{point.properties.postal-code}"),
                     tooltip = list()) |>
  hc_legend(layout = "horizontal",
            verticalAlign = "bottom",
            align = "center",
            valueDecimals = 0,
            valueSuffix = "") |>
  hc_title(text = "VHL patients per state") |> #Add title
  hc_subtitle(text = "Source: SEER database") |> #Add subtitle
  hc_colorAxis(stops = color_stops(colors = viridisLite::inferno(10, begin = 0.1)))

And the outcome

This is my code when I try to add the centers' locations.

hcmap("https://code.highcharts.com/mapdata/countries/us/us-all.js", #Construct map
                     data = States,
                     name = "Patient number",
                     value = "V2", 
                     joinBy = c("postal-code", "abbr"),
                     borderWidth = 1,
                     borderColor = "darkred",
                     dataLabels = list(enabled = TRUE, format = "{point.properties.postal-code}"),
                     tooltip = list()) |>
  hc_legend(layout = "horizontal",
            verticalAlign = "bottom",
            align = "center",
            valueDecimals = 0,
            valueSuffix = "") |>
  hc_title(text = "VHL patients per state") |> #Add title
  hc_subtitle(text = "Source: SEER database") |> #Add subtitle
  hc_colorAxis(stops = color_stops(colors = viridisLite::inferno(10, begin = 0.1))) |> #Change color scale
  hc_add_series(data = VHL_centers, 
                type = "mappoint")

As you can see the image is completely different. The legend now goes up to 7.5k, the centers have different colors and the color of the states has changed

Ideally I would like to have just the points with a single color (let's say black), with the names appearing only when I hover over them and not directly on the map.

Thanks for your help!

1 Answer 1

0

One option to fix your issue would be to assign a different colorAxis to your points, e.g. colorAxis=1, so that the first colorAxis (aka index 0) is still applied to your map.

library(highcharter)

hcmap("https://code.highcharts.com/mapdata/countries/us/us-all.js", # Construct map
  data = States,
  name = "Patient number",
  value = "V2",
  joinBy = c("postal-code", "abbr"),
  borderWidth = 1,
  borderColor = "darkred",
  dataLabels = list(
    enabled = TRUE,
    format = "{point.properties.postal-code}"
  ),
  tooltip = list(),
) |>
  hc_legend(
    layout = "horizontal",
    verticalAlign = "bottom",
    align = "center",
    valueDecimals = 0,
    valueSuffix = ""
  ) |>
  hc_title(text = "VHL patients per state") |> # Add title
  hc_subtitle(text = "Source: SEER database") |> # Add subtitle
  hc_colorAxis(stops = color_stops(
    colors = viridisLite::inferno(10, begin = 0.1)
  )) |> # Change color scale
  hc_add_series(
    data = VHL_centers,
    type = "mappoint",
    colorAxis = 1,
    color = "black"
  )

Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.