|
1 |
| -# Grafana panel plugin template |
| 1 | +# Grafana Button Control Panel |
2 | 2 |
|
3 |
| -This template is a starting point for building a panel plugin for Grafana. |
| 3 | +This panel allows you to create buttons and define actions for them. It can be |
| 4 | +used to add control functionality to your dashboards. Actions are defined as |
| 5 | +queries to Datasources. |
4 | 6 |
|
5 |
| -## What are Grafana panel plugins? |
| 7 | +Multiple buttons are allowed within a single panel, they can be arranged either |
| 8 | +horizontally or vertically. |
6 | 9 |
|
7 |
| -Panel plugins allow you to add new types of visualizations to your dashboard, such as maps, clocks, pie charts, lists, and more. |
| 10 | +The query field is a JSON object, that depends on each Datasource type. You can |
| 11 | +use Grafana's Query Inspector to find out what Grafana sends to each Datasource, |
| 12 | +and copy those into the query field. |
8 | 13 |
|
9 |
| -Use panel plugins when you want to do things like visualize data returned by data source queries, navigate between dashboards, or control external systems (such as smart home devices). |
| 14 | +## Examples |
10 | 15 |
|
11 |
| -## Getting started |
| 16 | +Query field to delete InfluxDB database: |
12 | 17 |
|
13 |
| -### Frontend |
| 18 | +```json |
| 19 | +{ |
| 20 | + "query": "drop database \"foo\"", |
| 21 | + "rawQuery": true, |
| 22 | + "resultFormat": "time_series" |
| 23 | +} |
| 24 | +``` |
14 | 25 |
|
15 |
| -1. Install dependencies |
| 26 | +Same example with PostgreSQL: |
16 | 27 |
|
17 |
| - ```bash |
18 |
| - yarn install |
19 |
| - ``` |
| 28 | +```json |
| 29 | +{ |
| 30 | + "rawSql": "DROP DATABASE foo;", |
| 31 | + "format": "table" |
| 32 | +} |
| 33 | +``` |
20 | 34 |
|
21 |
| -2. Build plugin in development mode or run in watch mode |
22 |
| - |
23 |
| - ```bash |
24 |
| - yarn dev |
25 |
| - |
26 |
| - # or |
27 |
| - |
28 |
| - yarn watch |
29 |
| - ``` |
30 |
| - |
31 |
| -3. Build plugin in production mode |
32 |
| - |
33 |
| - ```bash |
34 |
| - yarn build |
35 |
| - ``` |
36 |
| - |
37 |
| -4. Run the tests (using Jest) |
38 |
| - |
39 |
| - ```bash |
40 |
| - # Runs the tests and watches for changes |
41 |
| - yarn test |
42 |
| - |
43 |
| - # Exists after running all the tests |
44 |
| - yarn lint:ci |
45 |
| - ``` |
46 |
| - |
47 |
| -5. Spin up a Grafana instance and run the plugin inside it (using Docker) |
48 |
| - |
49 |
| - ```bash |
50 |
| - yarn server |
51 |
| - ``` |
52 |
| - |
53 |
| -6. Run the E2E tests (using Cypress) |
54 |
| - |
55 |
| - ```bash |
56 |
| - # Spin up a Grafana instance first that we tests against |
57 |
| - yarn server |
58 |
| - |
59 |
| - # Start the tests |
60 |
| - yarn e2e |
61 |
| - ``` |
62 |
| - |
63 |
| -7. Run the linter |
64 |
| - |
65 |
| - ```bash |
66 |
| - yarn lint |
67 |
| - |
68 |
| - # or |
69 |
| - |
70 |
| - yarn lint:fix |
71 |
| - ``` |
72 |
| - |
73 |
| - |
74 |
| - |
75 |
| -## Learn more |
76 |
| - |
77 |
| -Below you can find source code for existing app plugins and other related documentation. |
78 |
| - |
79 |
| -- [Basic panel plugin example](https://github.com/grafana/grafana-plugin-examples/tree/master/examples/panel-basic#readme) |
80 |
| -- [Plugin.json documentation](https://grafana.com/docs/grafana/latest/developers/plugins/metadata/) |
81 |
| -- [How to sign a plugin?](https://grafana.com/docs/grafana/latest/developers/plugins/sign-a-plugin/) |
| 35 | +`refId`, `datasourceId` are automatically sent, so you don't have to set them. |
0 commit comments