rstudio/revealjs

Interactive charts need to be wrapped in `widgetframe` for interactivity to work correctly

rleyvasal opened this issue · 2 comments

Issue

When an interactive chart is created in a slide the selection for interactive items is not in the correct position.

The interactive graph needs to be wrapped in a widgetframe and the option self_contained: false needs to be in the yaml header in order to be able to select the interactive items in the chart correctly.

Expected

Interactive charts should work without widgetframe

---
title: "Untitled"
date: ""
author: ""
output: 
  revealjs::revealjs_presentation:
    incremental: true
    highlight: pygments
    self_contained: false
---

```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = FALSE)
```

# Interactive plot without `widgetframe`

```{r}
library(pacman)
p_load(tidyverse, echarts4r, widgetframe)
```
  
```{r echo=FALSE}
mtcars|>
  e_charts()|>
  e_boxplot(mpg)|> 
  e_boxplot(disp) |>
  e_boxplot(hp) |>
  e_title("boxplots") |> e_tooltip(trigger = "axis") 
```

# Interactive plot with `widgetframe`

```{r}
plot_1 <- mtcars|>
  e_charts()|>
  e_boxplot(mpg)|> 
  e_boxplot(disp) |>
  e_boxplot(hp) |>
  e_title("boxplots") |> e_tooltip(trigger = "axis") 
frameWidget(plot_1)
```

interactive_graph

cderv commented

Hi ! Thanks for opening an issue.

I am not sure to understand exactly what should be the correct behavior. When I try to reproduce, I don't think I get a different behavior between with or without widgetframe. Here what I got:
reveal-widget

Using this code
---
title: "Untitled"
date: ""
author: ""
output: 
  revealjs::revealjs_presentation:
    incremental: true
    highlight: pygments
    self_contained: false
  html_document: 
    self_contained: true
---

```{r setup, include=FALSE}
knitr::opts_chunk$set(echo = FALSE)
```

# Interactive plot without `widgetframe`

```{r, include = FALSE}
library(echarts4r)
library(widgetframe)
```
  
```{r echo = FALSE}
mtcars|>
  e_charts()|>
  e_boxplot(mpg)|> 
  e_boxplot(disp) |>
  e_boxplot(hp) |>
  e_title("boxplots") |> e_tooltip(trigger = "axis") 
```

# Interactive plot with `widgetframe`

```{r, echo = FALSE}
plot_1 <- mtcars|>
  e_charts()|>
  e_boxplot(mpg)|> 
  e_boxplot(disp) |>
  e_boxplot(hp) |>
  e_title("boxplots") |> e_tooltip(trigger = "axis") 
frameWidget(plot_1)
```

Not sure what should be the expected behavior. It is possible that there is an undesired interaction between echart4 JS lib and reveal.js library. If we cant pinpoint what and where, we could try improve.

Thanks for the additional precision you can give me in order to help me help you!

In the GIF I attached you can see in the slide "Interactive plot without widgetframe" that the cursor is very close to the boxplot in the middle but the legends still appears on the boxplot on the right.

I am not able to replicate the issue now.

If I see the problem again I will reopen this issue.