Search code examples
rggplot2plotlyflexdashboard

Dynamic Re-sizing Flexdashboard/Plotly Image to a Different Graphic


I'm building a dynamic flexdashboard with plotly and I was wondering if there was a way to dynamically resize my dashboard. For example, I have created plots of subjects being tested over time. When I shrink the page down, what I'd like is for it to dynamically adjust to a time-series plot of the average for the group at each test day.

My data looks like this:

library(flexdashboard)
library(knitr)
library(tidyverse)
library(plotly)

subject <- rep(c("A", "B", "C"), each = 8)
testDay <- rep(1:8, times = 3)
variable1 <- rnorm(n = length(subject), mean = 30, sd = 10)
variable2 <- rnorm(n = length(subject), mean = 15, sd = 3)
df <- data.frame(subject, testDay, variable1, variable2)

   subject testDay variable1 variable2
1        A       1 21.816831  8.575000
2        A       2 14.947327 17.387903
3        A       3 18.014435 16.734653
4        A       4 33.100524 11.381793
5        A       5 37.105911 13.862776
6        A       6 32.181317 10.722458
7        A       7 41.107293  9.176348
8        A       8 36.674051 17.114815
9        B       1 33.710838 17.508234
10       B       2 23.788428 13.903532
11       B       3 42.846120 17.032208
12       B       4  9.785957 15.275293
13       B       5 32.551619 21.172497
14       B       6 36.912465 18.694263
15       B       7 40.061797 13.759541
16       B       8 41.094825 15.472144
17       C       1 27.663408 17.949291
18       C       2 31.263966 11.546486
19       C       3 39.734050 19.831854
20       C       4 25.461309 19.239821
21       C       5 22.128139 10.837672
22       C       6 31.234339 16.976004
23       C       7 46.273664 19.255745
24       C       8 27.057218 21.086204

My plotly code looks like this (a graph of each subject over time):

Dynamic Chart
===========================

Row
-----------------------------------------------------------------------

```{r}
p1 <- df %>%
  ggplot(aes(x = as.factor(testDay), y = variable1, color = subject, group = 1)) +
  geom_line() +
  theme_bw() +
  ggtitle("Variable 1")

ggplotly(p1)
```

```{r}
p2 <- df %>%
  ggplot(aes(x = as.factor(testDay), y = variable2, color = subject, group = 1)) +
  geom_line() +
  theme_bw() +
  ggtitle("Variable 2")

ggplotly(p2)
```

Is there a way that when I shrink the website down these plots can dynamically change to a group average plot, like this:

p1_avg <- df %>%
  ggplot(aes(x = as.factor(testDay), y = variable1, group = 1)) +
  stat_summary(fun.y = "mean", geom = "line") +
  theme_bw() +
  ggtitle("Variable 1 Avg")

ggplotly(p1_avg)
p2_avg <- df %>%
  ggplot(aes(x = as.factor(testDay), y = variable2, group = 1)) +
  stat_summary(fun.y = "mean", geom = "line") +
  theme_bw() +
  ggtitle("Variable 2 Avg")

ggplotly(p2_avg)

Solution

  • You can put your plotly object inside the plotly function renderPlotly() for dynamically resizing to the page. See an example how I used the function in this blog post: https://medium.com/analytics-vidhya/shiny-dashboards-with-flexdashboard-e66aaafac1f2