onChangeTimeRange() documentation

matgrafana · May 8, 2024, 5:28am

I’m trying to figure out how to use this event in my plugin (grafanacubism-panel / GitHub - ekacnet/grafanacubism-panel) I would like to implement zooming and so I need to change the time range to match the window that has be defined by the zoom.

I saw this React plugin: how to register to the TimeRangeChange event post but it was not quite clear how to use it to control the dashboard time range from within the plugin.

sowdenraymond · May 8, 2024, 6:32am

github.com

VolkovLabs/volkovlabs-calendar-panel/blob/cac1f7e9d1b14463bd8bd2994b075b3e31af2ce9/src/CalendarPanel.tsx#L104


      
            )}
          >
            {/* Apply time interval */}
            {selectedInterval && (
              <div className={styles.applyIntervalButton}>
                <Button
                  onClick={() => {
                    if (selectedInterval) {
                      const [from, to] = selectedInterval;
                      clearSelection();
                      onChangeTimeRange({ from: from.valueOf(), to: to.valueOf() });
                    }
                  }}
                >
                  Apply time range
                </Button>
              </div>
            )}
          
            {/* Header displaying the weekdays */}
            <div className={styles.weekdayContainer}>

Topic		Replies	Views
React plugin: how to register to the TimeRangeChange event Grafana Plugin Development	3	1610	February 4, 2020
Grafana , React, TimeRange Change Event capture Grafana	0	368	February 6, 2020
How to get PanelEvents in React plugin development Grafana Plugin Development	3	965	June 21, 2021
How to catch time range change event in react panel Grafana Plugin Development	0	442	July 13, 2020
Is it possible to have different Grafana apps interact? Grafana Plugin Development	1	464	August 24, 2020

onChangeTimeRange() documentation

Related topics