- Node.js 14
- yarn
- Grafana 7 (or docker and appropriate Grafana image)
- Run
yarn
command to install dependencies - Run
npm run build
to build the plugin - Launch Grafana and set up plugins path to the parent directory, e.g.
docker run -d -p 3000:3000 -v "$(YOUR_PROJECT_PARENT_DIRECTORY)":/var/lib/grafana/plugins --name=grafana grafana/grafana:7.0.0
Now you can visit http://localhost:3000
(username: admin
, password: admin
) and add a new panel plugin to the dashboard. There are temporarily hardcoded API key and test request but no gifs will be displayed anyway. This is due to browser's 3rd party cookie restrictions, one can check them out in browser's devtools.
This template is a starting point for building Grafana Panel Plugins in Grafana 7.0+
Panels are the building blocks of Grafana. They allow you to visualize data in different ways. While Grafana has several types of panels already built-in, you can also build your own panel, to add support for other visualizations.
For more information about panels, refer to the documentation on Panels
-
Install dependencies
yarn install
-
Build plugin in development mode or run in watch mode
yarn dev
or
yarn watch
-
Build plugin in production mode
yarn build
- Build a panel plugin tutorial
- Grafana documentation
- Grafana Tutorials - Grafana Tutorials are step-by-step guides that help you make the most of Grafana
- Grafana UI Library - UI components to help you build interfaces using Grafana Design System