ggplot geom_tile生成Plotly图形时Tooltip显示异常问题

问题重现 #

使用geom_tile模拟柱状图（满足轴反转需求），从ggplot转换为Plotly后，同一ID下的所有柱子hover时会显示该ID下全部柱子的信息，而非单个柱子的内容。以下是可复现代码：

library(ggplot2)
library(plotly)

set.seed(123)
dat <- data.frame(
  ID = rep(c("A", "B", "C"), each = 3),
  x = rep(1:3, 3),
  y1 = rnorm(9, 10, 2),
  y2 = sample(1:5, 9, replace = TRUE)
)

# 原始ggplot对象
p <- ggplot(dat, aes(x = x)) +
  geom_point(aes(y = y1, color = "y1"), size = 3) +
  geom_tile(aes(y = y2/2, height = y2, fill = "y2"), width = 0.8) +
  scale_y_continuous(
    name = "y1轴",
    sec.axis = sec_axis(~ . * 2, name = "y2轴")
  ) +
  scale_fill_manual(values = "steelblue") +
  scale_color_manual(values = "red") +
  theme_minimal() +
  facet_wrap(~ID)

# 转换后Tooltip异常
ggplotly(p)

问题原因 #

geom_tile默认按facet的ID分组绘制，转换为Plotly时，同一ID下的所有tile会被合并为单个trace，hover事件触发时会显示该trace下的所有数据点信息，而非单个tile的独立数据。

解决方案 #

方法1：修改ggplot分组逻辑（推荐）

为每个geom_tile设置独立分组，强制ggplot为每个tile生成单独的layer，转换为Plotly后每个tile对应独立trace，Tooltip即可正常显示：

p_fixed <- ggplot(dat, aes(x = x)) +
  geom_point(aes(y = y1, color = "y1"), size = 3) +
  # 新增group参数，让每个tile按ID+x的组合独立分组
  geom_tile(aes(y = y2/2, height = y2, fill = "y2", group = interaction(ID, x)), width = 0.8) +
  scale_y_continuous(
    name = "y1轴",
    sec.axis = sec_axis(~ . * 2, name = "y2轴")
  ) +
  scale_fill_manual(values = "steelblue") +
  scale_color_manual(values = "red") +
  theme_minimal() +
  facet_wrap(~ID)

# 转换后Tooltip正常
ggplotly(p_fixed, tooltip = c("x", "y", "color", "fill"))

方法2：直接修改Plotly对象的Trace属性

如果无法修改原始ggplot代码，可直接操作Plotly对象，为每个tile设置自定义Tooltip文本：

p_plotly <- ggplotly(p)

# 定位y2对应的trace（通常是第二个trace，可根据实际情况调整）
tile_trace_idx <- which(sapply(p_plotly$x$data, function(t) t$name == "y2"))

# 为每个tile生成独立的hover文本
for (i in tile_trace_idx) {
  # 生成自定义hover内容
  hover_text <- paste0(
    "ID: ", dat$ID, "<br>",
    "x: ", dat$x, "<br>",
    "y2: ", dat$y2
  )
  # 更新trace的文本和hover设置
  p_plotly$x$data[[i]]$text <- hover_text
  p_plotly$x$data[[i]]$hoverinfo <- "text"
}

# 显示修复后的图形
p_plotly

原理说明 #

• 方法1通过interaction(ID, x)创建唯一分组标识，让每个tile成为独立的绘图单元，转换为Plotly后每个tile对应单独的trace，hover时仅触发当前trace的信息。
• 方法2直接覆盖Plotly trace的text和hoverinfo属性，强制每个数据点显示对应行的自定义信息，避免分组导致的批量Tooltip展示。

内容的提问来源于stack exchange，提问作者djbetancourt