Easiest way to format table for interactive tooltip for ggiraph

Question

I have this basic example below. As you will see it is an interactive plot. What I am hoping to achieve at the moment is to take the dummy_data and make it a formatted table for the tooltip when you hover over a datapoint. I am going to have different sets for points but I just want this one example to work for all and then I can change the data.

As you will see in the tooltip = argument it would need to be included there. I am just not sure if there is an easy way to pass this table as it is printed in there with some css to format it easily. I want it to look as good or better than dummy_data printed to console essentially.

I hope this is clear enough? Please let me know if I can clarify. See reprex below.

library(ggplot2)
library(ggiraph)
#> Warning: package 'ggiraph' was built under R version 4.1.2


dataset <- mtcars

dummy_data <- 
  data.frame(
    stringsAsFactors = FALSE,
    Feature = c("FeatureA","FeatureB",
                "FeatureC","FeatureD","FeatureE","FeatureF","FeatureG",
                "FeatureH","FeatureI","FeatureJ","FeatureK","FeatureL",
                "FeatureM","FeatureN","FeatureO","FeatureP","FeatureQ",
                "FeatureR","FeatureS","FeatureT","FeatureU"),
    Rating = c(1L,1L,1L,1L,3L,3L,4L,1L,
               4L,1L,4L,1L,1L,1L,1L,4L,1L,1L,2L,3L,2L)
  )

dummy_data
#>     Feature Rating
#> 1  FeatureA      1
#> 2  FeatureB      1
#> 3  FeatureC      1
#> 4  FeatureD      1
#> 5  FeatureE      3
#> 6  FeatureF      3
#> 7  FeatureG      4
#> 8  FeatureH      1
#> 9  FeatureI      4
#> 10 FeatureJ      1
#> 11 FeatureK      4
#> 12 FeatureL      1
#> 13 FeatureM      1
#> 14 FeatureN      1
#> 15 FeatureO      1
#> 16 FeatureP      4
#> 17 FeatureQ      1
#> 18 FeatureR      1
#> 19 FeatureS      2
#> 20 FeatureT      3
#> 21 FeatureU      2

dataset$carname <- row.names(dataset)
dataset$tooltip <- paste(dummy_data)



gg_scatter <- ggplot(dataset, 
                     aes(x = disp, y = qsec, tooltip = 
                           paste0(
                             "<div class='header' checked>
                           <p>Ready to take ",tooltip,"? If so</p>
                           <a href='shiny.rstudio.com/tutorial'>Click Here!</a>
                           </div>"), 
                         data_id = carname, color= wt) ) + 
  geom_point_interactive(size=3) + 
  labs(title = "mouse over points") + 
  theme_minimal() + theme(
    plot.background = element_blank(),
    panel.background = element_blank()
  )



girafe(ggobj = gg_scatter, 
       options = list(
         opts_sizing(rescale = TRUE, width = .7) )
)

^{Created on 2022-04-27 by the reprex package (v2.0.0)}

Answer 1

You can pass HTML code to the tooltip, so one way would be to create an HTML version of your table using knitr::kable, get the HTML table code and add it to your dataframe and then use as tooltip.

library(ggplot2)
library(ggiraph)

dataset <- mtcars

# add tooltip, using only first 10 rows to avoid showing too much text
dataset$tooltip <- knitr::kable(dummy_data[1:10, ], format = "html")

gg_scatter <- ggplot(dataset, 
                     aes(x = disp, y = qsec, 
                         tooltip = tooltip, color= wt) ) + 
    geom_point_interactive(size=3) 

girafe(ggobj = gg_scatter)

For more customisation for the tooltip table, instead of knitr::kable, you can use some other package that allows creating more customised HTML tables.