Search code examples
rechartsecharts4r

echarts4r use valueFormatter in tooltip


I want to use the valueFormatter option in an echarts4r tooltip. Following the documentation of e_tooltip I should be able to use the ... args as they are passed to echarts.

For example I would expect this to work

library(dplyr)
library(echarts4r)

mtcars |>
  group_by(cyl, gear) |> 
  summarise(mpg = mean(mpg)) |>
  mutate(gear = as.character(gear)) |>
  e_charts(gear) |>
  e_bar(mpg) |>
  e_tooltip(
    trigger = "axis",
    valueFormatter = htmlwidgets::JS("(value) => 'MPG is ' + value.toFixed(2)")
  )

Leaving out the valueFormatter, I see this picture. The goal is to have the colored-dots in the tooltip and then on the RHS of the tooltip I want to see MPG is 21.50 (Note that its fixed to 2 digits! aka showing the trailing 0), MPG is 17.75 and MPG is 15.05.

echarts

Unfortunately, the tooltip does not work and crashes/shows nothing. Any help is appreciated.


Solution

  • The issue is that the value passed to your formatter is a string. Hence, you have to first convert to a Number to apply the toFixed method:

    
    library(dplyr)
    library(echarts4r)
    
    mtcars |>
      group_by(cyl, gear) |> 
      summarise(mpg = mean(mpg)) |>
      mutate(gear = as.character(gear)) |>
      e_charts(gear) |>
      e_bar(mpg) |>
      e_tooltip(
        trigger = "axis",
        valueFormatter = htmlwidgets::JS("(value) => 'MPG is ' + Number(value).toFixed(2)")
      )
    

    enter image description here