Select axis depending on reactive user input in echarts4R

I have a chart where axis (x & y) are selected by a userinput. Firstly the user chooses the criteria type with a radio button, then a select input appears for him to set the actual axis parameter he wants. The dropdown menu in select input is a list of column names.

I'm able to make this work just fine with ggplot using the code below :

ui<- fluidPage(
            radioButtons("xbkct", h1(class="cch", "Select X-axis criteria"),
                         choices =c("Bookies"="bks", "Team"="tmc"),
                         inline = TRUE
                        ),
            conditionalPanel("input.xbkct==='bks'",
                             selectInput("xbookct1", "Bookies criteria",
                                         choices = NULL)
                            ),
            conditionalPanel("input.xbkct==='tmc'",
                             selectInput("xteamct1", "Team criteria",
                                         choices = NULL)
                            ),         
            radioButtons("ybkct", h1(class="cch","Select Y-axis criteria"),
                         choices = c("Bookies"="bks", "Team"="tmc")
                         ,inline = TRUE
                        ),
            conditionalPanel("input.ybkct==='bks'",
                             selectInput("ybookct1", "Bookies criteria",
                                         choices = NULL)
                            ),                      
            conditionalPanel("input.ybkct==='tmc'",
                             selectInput("yteamct1", "Team criteria",
                                         choices = NULL)
                            )
plotOutput("plotui1")
)

server<- function(input, output, session) {
  observeEvent(input$dataset,{
    updateSelectInput(session, input = "xbookct1",
                      choices = sort(colnames(dataset()[c(18:19,21:26)])))            
    })
  observeEvent(input$dataset,{
    updateSelectInput(session, input = "xteamct1",
                      choices = sort(colnames(dataset()[c(27:38)])))            
    })
  xvar <- reactive({
    if (input$xbkct=='bks')
    {
      input$xbookct1
      } else if (input$xbkct=='tmc')
      { input$xteamct1
        }
    })
  
  yvar <- reactive({
    if (input$ybkct=='bks')
    {
      input$ybookct1
      } else if (input$ybkct=='tmc')
      { input$yteamct1
        }
    })

output$plotui1 <- renderPlot({
    g1<-ggplot(dft(), aes_string(x=xvar(), y=yvar(),size=sz(),fill=as.factor(dft()$OUTCOME))) +

      geom_point(alpha=0.8, shape=21)
    g1
}]

However now I'm switching to the echarts4R package and I can't make it work. Obviously I've change plotOutput() on the UI Side with echarts4rOutput().

The error is coming from the server side when I'm trying to select my e_chart() series with xvar() and yvar(). I've tried the following but couldn't make it work:

  output$plotui1<- renderEcharts4r({
    g1<- dft() %>%
    e_chart(xvar()) %>%
      e_scatter(yvar(),sz())
    g1
  })

I've not included the sz() criteria (size) but it follows the same logic as xvar() and yvar()

Similiar to using ggplot2 in a shiny app echarts4r requires slightly more effort to use the values selected by the user. (Sidenote: aes_string was deprecated in ggplot2 3.4.0. Instead it is recommended to switch to the .data pronoun. See ?aes_string).

One option would be to use the xxx_ family of functions, e.g. e_charts_ , which serve a similar purpose as the now-deprecated aes_string and are actually called under the hood by the "non"-_ version of the function. A second option would be to do some renaming, e.g. in the code below I rename the column to be mapped on x as x and so on.

Using a minimal reprex based on mtcars:

library(echarts4r)
library(shiny)
library(dplyr, warn = FALSE)

ui <- fluidPage(
  selectInput(
    "xvar", "X",
    choices = names(mtcars),
    selected = "mpg"
  ),
  selectInput(
    "yvar", "Y",
    choices = names(mtcars),
    selected = "hp"
  ),
  selectInput(
    "sz", "Size",
    choices = names(mtcars),
    selected = "cyl"
  ),
  echarts4rOutput("plotui1"),
  echarts4rOutput("plotui2")
)

server <- function(input, output, session) {
  dft <- reactive({
    mtcars
  })
  xvar <- reactive({
    input$xvar
  })
  yvar <- reactive({
    input$yvar
  })
  sz <- reactive({
    input$sz
  })

  output$plotui1 <- renderEcharts4r({
    dft() |>
      e_charts_(xvar()) |>
      e_scatter_(yvar(), size = sz())
  })

  output$plotui2 <- renderEcharts4r({
    dft() |>
      select(x = xvar(), y = yvar(), sz = sz()) |>
      e_charts(x) |>
      e_scatter(y, sz)
  })
}

shinyApp(ui, server)
#> 
#> Listening on http://127.0.0.1:3214