Not working with echarts4r

[etiennebacher]

library(shiny)
library(prompter)
library(echarts4r)
library(magrittr)

ui <- fluidPage(
  use_prompt(),
  br(),
  actionButton(
    "bs4_color_info",
    "bs4_color_info",
    class="btn-info",
    style = "color: white"
  ),
  column(
    9,
    br(),
    echarts4rOutput("plot") %>% 
      add_prompt(
        message = "The color is different of bs4_color_success button",
        position = "top", 
        type = "info", 
        size = "medium", 
        rounded = TRUE
      )

  )
)

server <- function(input, output, session) {
  output$plot <- renderEcharts4r({
    mtcars %>% e_charts(mpg) %>% e_scatter(drat)
  })
}

shinyApp(ui, server)

Error in if (ui_element$name == "img") { : argument is of length zero

[etiennebacher]

Works well with plotly, it must be a problem with how echarts creates a canvas (+ a problem with add_prompt()):

library(shiny)
library(prompter)
library(echarts4r)
library(plotly)
library(magrittr)

ui <- fluidPage(
  use_prompt(),
  br(),
  actionButton(
    "bs4_color_info",
    "bs4_color_info",
    class="btn-info",
    style = "color: white"
  ),
  column(
    9,
    br(),
    tags$div(
      class="hint--bottom hint--info hint--medium hint--rounded",
      `aria-label`="The color is different of bs4_color_success button",
      plotlyOutput("plot") 
    )

  )
)

server <- function(input, output, session) {
  output$plot <- renderPlotly({
    plot_ly(economics, x = ~date, y = ~pop)
  })
}

shinyApp(ui, server)

[etiennebacher]

This was partially fixed in 9a0187bdf2f4413e5a9c7481d613c82fb1274b07 but I referenced the wrong issue in the commit. There is still a problem with the dimensions of echarts plot. What I understand is that echarts scales the plot with the dimensions of the parent div, which here is the div with hint. Therefore, the 100% width that echarts applies are the 100% width of the div with hint, which is quite narrow. Possible to change the dimensions of echarts manually but I don't like that, it seems too hacky / not robust.

library(shiny)
library(echarts4r)
library(magrittr)

ui <- fluidPage(
  use_prompt(),
  br(),
  actionButton(
    "bs4_color_info",
    "bs4_color_info",
    class="btn-info",
    style = "color: white"
  ),
  column(
    9,
    br(),
    echarts4rOutput("plot", width = "600px") %>% 
      add_prompt(
        message = "The color is different of bs4_color_success button",
        position = "bottom",
        type = "info",
        size = "medium",
        rounded = TRUE
      )

  )
)

server <- function(input, output, session) {
  output$plot <- renderEcharts4r({
    mtcars %>% e_charts(mpg) %>% e_scatter(drat)
  })
}

shinyApp(ui, server)