ggiraph，R：如何将图例和具有相同 data_id 属性的 plot 链接起来？

Question

When I hover my cursor across a chart, I want the respective legend label and fill to also be highlighted, and vice versa. To do this, they need the same data_id - but I am struggling to get this right. How do I get this to work within my code?

If I add data_id=groupID to scale_fill_manual_interactive() to make the legend interactive, I get the following error:

Error in scale_interactive(scale_fill_manual, ...) : 
  object 'groupID' not found

data_id = function(breaks) { as.character(breaks) } works but it doesn't link the legend and plot. But I can't find an explanation for why that should work but 'data_id=groupID' doesn't, so solving this alone has been impossible.

Here is the code ( EDIT I've managed to get the custom labels to display correctly and have updated the code)

library(ggplot2)
library(ggiraph)
library(ggrepel)
library(scales)

Area <- c("location1", "location2", "location3", "location4")
very_good <-  c(14, 7, 17, 16)
good <-  c(33, 31, 35, 31)
quite_bad <-  c(33, 36, 30, 1)
very_bad <-  c(17, 2, 14, 10)

#Custom labels for the legend
Labels <- c("Very good", "Good", "Quite bad", "Very bad, wont return")

df1 <- data.frame(
  Area, 
  very_good, 
  good, 
  quite_bad,
  very_bad
)

df1_subset <- df1 %>%
  mutate_at(vars(2:5), funs(./100)) %>% 
  pivot_longer(
    cols = c(2:5),
    names_to = "Question", values_to = "Result"
  )

df1_subset <- transform(
  df1_subset,groupID=as.numeric(forcats::fct_inorder(Question))
)

set.seed(1)

stacked_chart <- ggplot(
  data = df1_subset,
  aes(
    x = Result,
    y = Area,
    group = Question,
    fill = Question,
    data_id = groupID
  )
) +
  geom_col_interactive(
    position = position_fill(reverse = TRUE)
  ) +
  geom_text_repel_interactive(
    aes(
      color = ifelse(Result > 0.06,  "#FFFFFF", "transparent"),
      label = percent(Result)
    ),
    fontface = "bold",
    position = position_fill(
      reverse = TRUE
    ),
    box.padding = 0.05,
    segment.color = "transparent",
    size = 5,
    direction = "x",
    hjust = 1.5
  ) +
  scale_y_discrete(
    limits = rev(Area)
  ) +
  scale_x_continuous(
    labels = scales::percent,
    expand = c(0, 0),
    limits = c(0, 1)
  ) +
  scale_color_identity() +
  scale_fill_manual_interactive(
data_id = lapply(Labels, function(breaks) {
  as.character(breaks)
}),
labels = function(breaks) {
  lapply(Labels, function(breaks) {
    label_interactive(
      breaks,
      data_id = as.character(breaks)
    )
  })
},
    values = c(
      "#000000",
      "#333333",
      "#666666",
      "#999999"
    )
  ) +
  theme_minimal() +
  theme(
    legend.position = "top",
    legend.justification = "left",
    legend.title = element_blank()
  )

stacked_chart_ggiraph <- girafe(
  ggobj = stacked_chart, width_svg = 9, height_svg = 6,
  options = list(
    opts_sizing(rescale = TRUE),
    opts_toolbar(saveaspng = FALSE),
    opts_hover_inv(css = girafe_css(
      css = "opacity:0.3;"
    )),
    opts_hover(css = girafe_css(
      css = "cursor:pointer;fill:red;",
      text = "cursor:pointer;fill:#222222;"
    )),
    opts_hover_key(css = girafe_css(
      css = "cursor:pointer;fill:red;"
    ))
  )
)

stacked_chart_ggiraph

Answer 1

I did end up finding a solution for this, which was a miracle in itself as ggiraph's documentation is still VERY incomplete. But it's been a few weeks so please comment if I've missed anything.

So ggiraph allows for custom functionality with the extra_interactive_params argument briefly mentioned in this document .

It took a lot of trial and error, but to get it to work in my case, it needed to be initialised in the initial geom_*_interactive function before it would work with the scale function, where my legend is created. I also had to use backticks `` to force R to accept custom attributes that contained special characters, like hyphens -

Here are the relevant bits of code:

  geom_col_interactive(
    aes(
      data_id = groupID,
      `data-id` = groupID
    ),
    extra_interactive_params = "data-id",
    position = position_fill(reverse = TRUE)
  ) +

...

  scale_fill_manual_interactive(
    extra_interactive_params = "data-id",
    `data-id` = seq_along(Legend_colours),
    values = Legend_colours,
    labels = function(breaks) {
      lapply(seq_along(Labels), function(breaks) {
        label_interactive(
          Labels[breaks],
          `data-id` = breaks,
          extra_interactive_params = c("data-id")
        )
      })
    }
    ) +