Grafana Apps

App plugins are a new kind of grafana plugin that can bundle datasource and panel plugins within one package. It also enable the plugin author to create custom pages within grafana. The custom pages enable the plugin author to include things like documentation, sign up forms or controlling other services using HTTP requests.

Datasource and panel plugins will show up like normal plugins. The app pages will be available in the main menu.

App in Main MenuDeveloping App Plugins - 图2

Enabling app plugins

After installing an app, it has to be enabled before it shows up as a datasource or panel. You can do that on the app page in the config tab.

Developing an App Plugin

An App is a bundle of panels, dashboards and/or data source(s). There is nothing different about developing panels and data sources for an app.

Apps have to be enabled in Grafana and should import any included dashboards when the user enables it. A ConfigCtrl class should be created and the dashboards imported in the postUpdate hook. See example below:

  1. export class ConfigCtrl {
  2.   /** @ngInject */
  3.   constructor($scope, $injector, $q) {
  4.     this.$q = $q;
  5.     this.enabled = false;
  6.     this.appEditCtrl.setPostUpdateHook(this.postUpdate.bind(this));
  7.   }
  9.   postUpdate() {
  10.     if (!this.appModel.enabled) {
  11.       return this.$q.resolve();
  12.     }
  13.     return this.appEditCtrl.importDashboards().then(() => {
  14.       this.enabled = true;
  15.       return {
  16.         url: "plugins/raintank-kubernetes-app/page/clusters",
  17.         message: "Kubernetes App enabled!"
  18.       };
  19.     });
  20.   }
  21. }
  22. ConfigCtrl.templateUrl = 'components/config/config.html';

If possible a link to a dashboard or custom page should be shown after enabling the app to guide the user to the appropriate place.

After enablingDeveloping App Plugins - 图4

Develop your own App

Our goal is not to have a very extensive documentation but rather have actual code that people can look at. An example implementation of an app can be found in this example app repo