How to extend the functionality of native grafana graph panel



We are using grafana 7.1.2 in our machine. We just want to extend or customize the native grafana graph panel plugin. How can we make the changes and run it. We also want the panel plugin to move or run from data/plugins folder instead of public/app/plugins/panel.

We have found the below plugin similar to our requirement. But its using a older version of grafana(5.0) and its not supporting the transforms.

Finally, we want to move the native grafana graph panel plugin to our custom plugins folder.

Please suggest the necessary changes and webpack config changes if required

Thanks in advance.

AFAIK it’s not really possible to extend the native graph panel. I can think of two options:

  • Use the Graph component from grafana/ui. You can customize some attributes, but propbably not to the degree you’re looking for.

  • Use the flot library. It looks like this is what the graph panel you linked to does. In fact, the native graph panel uses Flot so it’s actually already available to your plugin through Grafana. You can see an example of how to use it here:

Hello @durgaprasadthokala

In my plugin I have copied a plugin at:

This graph panel extends a standard graph and it is based on react, so may be better if you plan to use it with 7.x Grafana.

Then you may extend panel properties with your own. Example is:

And put these config into UI with panel option builder: