Mouse hover on interactive graph works on wrong positions on `revealjs` presentation

[rleyvasal]

The mouse selects wrong items on interactive charts for revealjs presentations - sometimes interactivity stops working altogether.

The same issue happens on the Presentation window of RStudio, Edge Browser and Chrome - inside Quarto .md file (notebook) interactivity works without issue.

The screenshot shows when clicking the red legend, the blue legend gets selected. When clicking blue legend nothing happens.

Code to repliate

---
format:
  revealjs:
    self-contained: true
    incremental: true
    transition: convex
    slide-number: true
    controls: true
    controls-layout: edges
---

## Plot and Data {.smaller .scrollable }

::: panel-tabset
### Plot

```{r}
library(echarts4r)
library(htmlwidgets)
library(webshot2)
df <- data.frame(
  #x = LETTERS[1:5],
  x = c("Sales", "Marketing", "C", "D","E" ),
  y = c(0,2,3,4,7),#runif(5, 1, 5),
  z = runif(5, 3, 7)
)

radar_chart = df |>
  e_charts(x) |>
  e_radar(y, max = 7, name = "Quarter 1", color=c("red","blue") )|>
  e_radar(z, name = "Quarter 2") #|>
  #e_legend(show = FALSE)
radar_chart

---

Data

df

tree graph

library(tibble)

tree <- tibble(
  tibble(name = "earth","fire"),       # 1st level
  children = list(
    tibble(name = c("land", "ocean"),             # 2nd level
       children = list(
         tibble(name = c("forest", "river")),   # 3rd level 
         tibble(name = c("fish", "kelp"),
            children = list(
               tibble(name = c("shark", "tuna"),  # 4th level 
               NULL  # kelp
            ))
         )
       ))
  )
)

tree |> 
  e_charts() |> 
  e_tree() |> 
  e_title("Tree graph")

data

tree

:::

[cscheid]

I can't reproduce this on macOS, the interaction looks good from here... @cderv, can you take a look?

[rleyvasal]

This was tested on windows 10 with latest versions of RStudio, Edge browser and Chrome browser

[cderv]

I can reproduce on Windows when opening the HTML produced within Chrome. It is working fine in the presentation pane when using last daily version of the RStudio IDE.

I simplified the example to this one

---
format: revealjs
---

## Plot and Data

```{r}
library(echarts4r)
df <- data.frame(
  #x = LETTERS[1:5],
  x = c("Sales", "Marketing", "C", "D","E" ),
  y = c(0,2,3,4,7),#runif(5, 1, 5),
  z = runif(5, 3, 7)
)

radar_chart = df |>
  e_charts(x) |>
  e_radar(y, max = 7, name = "Quarter 1", color=c("red","blue") )|>
  e_radar(z, name = "Quarter 2") #|>
  #e_legend(show = FALSE)
radar_chart

I am not sure it is something related to Quarto. I have the issue with R Markdown **revealjs** format.

I don't have the issue with HTML though, so I guess this is some possible conflict between interactive plots and revealjs framework. Reveal does a lot of resizing and scaling, and possibly it is not working well with interactive plots. 

In the past, there was an issue with **plotly** that required some fixed upstream (https://github.com/rstudio/revealjs/issues/47#issuecomment-921770171)

I suspect it could be similar - not sure we can do something about this specifically but I'll look closer just in case