Apex Chart - Tooltip help

Configuration Frontend
4

For if you are still having the same issue:
I also struggled with showing all series for the tooltip for quite some time. What finally solved it is grouping on the x-axis. The series most likely have an irregular time interval, thus do not share the same x axis points. (See the note below the example: tooltip – ApexCharts.js)
This can be fixed with the group_by function. Here is my example (only the necessary config):

apex_config:
  xaxis:
    tooltip:
      enabled: false # Disable the x-axis tooltip
  tooltip:
    shared: true # Share tooltip with all series
    intersect: false # Also show tooltip when not hovering exactly on a point
    fixed:
      enabled: true
      position: topLeft
    x:
      format: HH:mm (dd MMM) #Cleaner time formatting
      show: true
all_series_config:
  group_by: # Fix irregular time for the shared tooltip to work
    duration: 5min
    func: avg
    fill: last

Make sure to set the duration accordingly. Good luck!

1 Like