JohnCoene / echarts4r

🐳 ECharts 5 for R
http://echarts4r.john-coene.com/
Other
585 stars 82 forks source link

click on title for e_on #629

Closed oobd closed 1 month ago

oobd commented 1 month ago

Is there a way to use e_on to trigger something when title is clicked on?

I thought something like this might work but nothing happens when i click on the title

library(echarts4r)

# Create the data frame
data <- data.frame(
  day = c('Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'),
  value = c(820, 932, 901, 934, 1290, 1330, 1320)
)

# Create the chart with added logging
chart <- data |>
  e_charts(day) |>
  e_line(value) |>
  e_title("Click me", triggerEvent = TRUE) |>
  e_x_axis(type = "category") |>
  e_y_axis(type = "value") |>
  e_on(
    "click",
    htmlwidgets::JS(
      "function(params) {
        console.log('Event params:', params);
        if (params.componentType === 'title') {
          console.log('Title clicked');
          alert('Title is clicked!');
        } else {
          console.log('Non-title component clicked');
        }
      }"
    )
  )

# Render the chart
chart
rdatasculptor commented 1 month ago

Please, test this one. Is this what you were expecting?

library(echarts4r)

# Create the data frame
data <- data.frame(
  day = c('Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'),
  value = c(820, 932, 901, 934, 1290, 1330, 1320)
)

# Create the chart with added logging
chart <- data |>
  e_charts(day) |>
  e_line(value) |>
  e_title("Click me", triggerEvent = TRUE) |>
  e_x_axis(type = "category") |>
  e_y_axis(type = "value") |>
  e_on(
    "title",
    htmlwidgets::JS(
      "function(params) {
        console.log('Event params:', params);
        if (params.componentType === 'title') {
          console.log('Title clicked');
          alert('Title is clicked!');
        } else {
          console.log('Non-title component clicked');
        }
      }"
    )
  )

# Render the chart
chart
oobd commented 1 month ago

Yes, perfect! thanks 👍 If you don't mind me asking, how did you figure out that it has to be "title" instead of "click" in e_on? I had a lot of trouble understanding what the first argument of e_on should be / which options were available

e.g. if i now wanted to say do same if clicked on any legend, how would i go about finding what the correct argument would be?

rdatasculptor commented 1 month ago

I guess you should add "legend" instead of "title" in that case. But not sure 😊

How I found out? The first thing I noticed is that the argument is a query on a part of the chart. "Click" is not a query, not a part of the chart. Second: I checked echarts js examples.

Please close the issue. Thanks!

oobd commented 1 month ago

Thanks again!