e_arrange doesn't work during the shiny session

[hnasko]

As I understand e_arrange is a new feature in the latest library. It is written in the documentation that e_arrange may not work properly in the RStudio viewer. But should it work in the shiny session? I have decided to try it instead of grid.

library(shiny)
library(shinydashboard)


ui <- dashboardPage(
  
  dashboardHeader(),
  
  dashboardSidebar(
    
    sidebarMenu(id = "tabs",
                menuItem("Users activity", tabName = "users_activity"))
    
  ),
  
  dashboardBody(
    tabItems(
      tabItem(tabName = "users_activity",
              fluidPage(title = "Users activity",  echarts4rOutput("agg_plot"))
      )
    )
  )
)


server <- function(input, output, session) {
  
  df <- data.frame(
    weekDay = c("Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday",
                "Sunday"),
    a = rnorm(7, 15, 3),
    b= rnorm(7, 10, 4),
    c = rnorm(7, 8, 5)
  )
  
  output$agg_plot <- renderEcharts4r({
    
    plot_1 <- df %>%
      e_charts(weekDay) %>%
      e_bar(a) %>%
      e_grid(left = '4%', right = '3%', bottom = '10%', containLabel = TRUE) %>%
      e_tooltip(trigger = "axis") %>%
      e_legend(show = FALSE) %>%
      e_title(text = "This is title 1") %>%
      e_color(color = "#00e5ff") %>%  
      e_group("grp") # assign group
    
    plot_2 <- df %>%
      e_charts(weekDay) %>%
      e_bar(b) %>%
      e_grid(left = '4%', right = '3%', bottom = '10%', containLabel = TRUE) %>%
      e_tooltip(trigger = "axis") %>%
      e_legend(show = FALSE) %>%
      e_title(text = "This is title 2") %>%
      e_color(color = "#33ff99")%>%
      e_group("grp") %>%
      e_connect_group("grp")

    plot_3 <- df %>%
      e_charts(weekDay, height = 200, width = "100%") %>%
      e_bar(c) %>%
      e_grid(left = '4%', right = '3%', bottom = '10%', containLabel = TRUE) %>%
      e_tooltip(trigger = "axis") %>%
      e_legend(show = FALSE) %>%
      e_title(text = "This is title 3") %>%
      e_color(color = "#ff33b8") %>%
      e_group("grp") %>%
      e_connect_group("grp")

    plot <- e_arrange(plot_1, plot_2, plot_3, cols = 1, rows = 3)
    plot
    
  })
  
}

shinyApp(ui, server)

[JohnCoene]

Yes, I actually have not tried the function in Shiny, only R markdown. The thing is you should not need it. It truly just lays out (or tries to 😄) layout the charts in a grid. You can use fluidRow and column in shiny, the charts will still be connected :)

There is an example here.

library(shiny)
library(echarts4r)
library(shinydashboard)


ui <- dashboardPage(
  
  dashboardHeader(),
  
  dashboardSidebar(
    
    sidebarMenu(
      id = "tabs",
      menuItem("Users activity", tabName = "users_activity")
    )
    
  ),
  
  dashboardBody(
    tabItems(
      tabItem(
        tabName = "users_activity",
        fluidRow(
          column(4, echarts4rOutput("plot1")),
          column(4, echarts4rOutput("plot2")),
          column(4, echarts4rOutput("plot3"))
        )
      )
    )
  )
)


server <- function(input, output, session) {
  
  df <- data.frame(
    weekDay = c("Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday",
                "Sunday"),
    a = rnorm(7, 15, 3),
    b= rnorm(7, 10, 4),
    c = rnorm(7, 8, 5)
  )
  
  output$plot1 <- renderEcharts4r({
    df %>%
      e_charts(weekDay) %>%
      e_bar(a) %>%
      e_grid(left = '4%', right = '3%', bottom = '10%', containLabel = TRUE) %>%
      e_tooltip(trigger = "axis") %>%
      e_legend(show = FALSE) %>%
      e_title(text = "This is title 1") %>%
      e_color(color = "#00e5ff") %>%  
      e_group("grp") # assign group
  })

  output$plot2 <- renderEcharts4r({
    df %>%
      e_charts(weekDay) %>%
      e_bar(b) %>%
      e_grid(left = '4%', right = '3%', bottom = '10%', containLabel = TRUE) %>%
      e_tooltip(trigger = "axis") %>%
      e_legend(show = FALSE) %>%
      e_title(text = "This is title 2") %>%
      e_color(color = "#33ff99")%>%
      e_group("grp") %>%
      e_connect_group("grp")
  })

  output$plot3 <- renderEcharts4r({
    df %>%
      e_charts(weekDay, height = 200, width = "100%") %>%
      e_bar(c) %>%
      e_grid(left = '4%', right = '3%', bottom = '10%', containLabel = TRUE) %>%
      e_tooltip(trigger = "axis") %>%
      e_legend(show = FALSE) %>%
      e_title(text = "This is title 3") %>%
      e_color(color = "#ff33b8") %>%
      e_group("grp") %>%
      e_connect_group("grp")
  })
  
}

shinyApp(ui, server)

I'll have it work in Shiny.

Does that help?

[hnasko]

Yes, it helps! Thank you.

[artemklevtsov]

@JohnCoene, use shiny layout are workaround but not a solution.
plotly subplots works as well and some users need the same behavior.

[artemklevtsov]

I think a possible solution is alternative renderEcharts4r function.

[JohnCoene]

Yes indeed. I have it labeled as enhancement, I'll tackle this eventually, just not very high on the priority list.

[JohnCoene]

Note as @artemklevtsov suggests: a new render* function would be required.

[tylerlittlefield]

Just wanted to put a +1 in this enhancement. I think it's a really nice feature to have for people that need to plot a dynamic number of plots in a grid for example.

[tylerlittlefield]

I also think that the documentation could maybe call this out, especially in this section: https://echarts4r.john-coene.com/articles/connect.html#shiny