1

I have made a panel plugin with React for Grafana 7. I would like to know when the panel is resized in the dashboard (i.e. dragged with mouse to make larger or smaller), so the plugin can react to this. I have searched for some kind of onResize event or similar but can't find anything. Is there a way to detect when a panel is resized?

computerman
  • 135
  • 6

1 Answers1

0

Here's how I handle resize inside panel plugin:

const panelContainer = document.querySelector('selector_for_element_inside_your_plugin').closest('.panel-wrapper');
const panelContanerResizeObserver = new ResizeObserver(resizeHandler);
panelContanerResizeObserver.observe(panelContainer);

In short, You select your panel wrapper and handle its resize with ResizeObserver

Michael Egorov
  • 16
  • 2
  • Where do you get document from? In the grafana plugin example you have a React FunctionComponent, which doesn't have the document. I'm sorry if this is a basic question, but the Grafana documentation lacks any kind of useful examples. – CodeMonkey Feb 22 '22 at 08:23