@grafana/scenes

Build highly interactive Grafana apps with ease.

About @grafana/scenes

@grafana/scenes provides a library to build highly interactive, dashboard-like experiences in Grafana's app plugins. It comes with the following features:

• Versatile layout options.
• Grafana panels rendering.
• Querying & transformations support
• Multiple time ranges support.
• Template variables support.
• URL sync.
• ... and more.

Development

To work on @grafana/scenes SDK, please follow the guides below.

Setting up @grafana/scenes with a local Grafana instance

To setup scenes with local Grafana, the following setup is required:

1. Clone the Grafana Scenes repository.
2. Clone the Grafana repository and follow the Development guide.
3. Setup env variable GRAFANA_PATH to point to your Grafana repository directory, export GRAFANA_PATH=<path-to-grafana-directory>
4. From Grafana Scenes root directory run ./scripts/dev.sh. This will compile @grafana/scenes with watch mode enabled and link it to your Grafana.
5. From Grafana directory run yarn install.

Setting up local version of @grafana/scenes with app plugin

1. Run YARN_IGNORE_PATH=1 yarn link from packages/scenes directory.
2. Run yarn dev from packages/scenes directory.
3. Run yarn link @grafana/scenes from app plugin directory.
4. Start app plugin development server.

Demo app

Alternatively, use the demo app included in this repository.