本地保存ggplot图形并嵌入reactable表格时图片加载失败求助

问题根源 #

• 交互式环境下reactable生成的HTML预览文件存放在系统临时目录，你使用的plots/xxx.png相对路径是相对于R工作目录的，HTML从临时目录加载时无法匹配到正确的文件路径，因此显示图片损坏
• 若后续部署到Shiny应用，Shiny默认不会暴露本地工作目录的文件作为静态资源，直接写相对路径同样会无法加载

补充：你用magick::image_read能正常加载是因为该函数基于R的工作目录查找文件，和HTML页面的资源加载路径属于两个独立的逻辑，因此之前的验证无法排除路径问题。

解决方案 #

分两种使用场景适配：

场景1：静态生成HTML表格使用 #

直接将本地图片转成base64编码内嵌到HTML中，完全规避路径依赖，修改表格生成部分的代码即可：

species %>%
  as.data.frame() %>%
  rename("species" = 1) %>%
  mutate(
    img_path = paste0("plots/", janitor::make_clean_names(species),".png"),
    # 转base64编码作为img的src，需提前安装knitr包
    plot = paste0("<img src='", knitr::image_uri(img_path), "' />")
  ) %>%
  reactable(
    columns = list(
      plot = colDef(html = TRUE,
                    resizable = TRUE,
                    show=TRUE)
    ))

场景2：Shiny应用中使用 #

你最终要用到Shiny环境的话，更推荐用Shiny的静态资源映射方案，性能优于每次转base64：

1. 在Shiny应用代码的最开头添加资源路径映射，将本地plots目录注册为Shiny可访问的静态资源路径：

addResourcePath("my_plots", "./plots")

2. 修改img的src为映射后的路径：

mutate(plot = paste0("<img src='/my_plots/", janitor::make_clean_names(species),".png' />"))

运行应用后即可正常加载图片。

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