Skip to content

Commit

Permalink
Cleanup
Browse files Browse the repository at this point in the history
  • Loading branch information
jacksongoode committed Jul 19, 2022
1 parent 74a60fa commit 4c71133
Show file tree
Hide file tree
Showing 12 changed files with 192 additions and 269,808 deletions.
3 changes: 0 additions & 3 deletions DEV.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,13 +3,10 @@
1. Change version in package.json
2. Build the plugin `npm run build`
3. Add token to env `set GRAFANA_API_KEY=<my_api_key>` and sign the plugin `npx @grafana/toolkit plugin:sign`

4. Commit changes

5. Create new tag for plugin
- `git tag -a v0.x.x -m "release v0.x.x"`
- `git push origin master --follow-tags`

6. Create new release on Github
7. Rename `dist` folder to `grafana-plotly-panel-0.x.x` and zip it (Due to current trouble with signature process, move all image to root of `dist` folder and update `plugin.json` accordingly).
8. Generate md5 with command `certutil -hashfile grafana-plotly-panel-0.x.x.zip MD5`
Expand Down
31 changes: 16 additions & 15 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,49 +3,50 @@
[![Marketplace](https://img.shields.io/badge/dynamic/json?logo=grafana&color=F47A20&label=marketplace&prefix=v&query=%24.items%5B%3F%28%40.slug%20%3D%3D%20%22grafana-plotly-panel%22%29%5D.version&url=https%3A%2F%2Fgrafana.com%2Fapi%2Fplugins)](https://grafana.com/grafana/plugins/grafana-plotly-panel)
[![Downloads](https://img.shields.io/badge/dynamic/json?logo=grafana&color=F47A20&label=downloads&query=%24.items%5B%3F%28%40.slug%20%3D%3D%20%22grafana-plotly-panel%22%29%5D.downloads&url=https%3A%2F%2Fgrafana.com%2Fapi%2Fplugins)](https://grafana.com/grafana/plugins/grafana-plotly-panel)

[https://github.com/nline/grafana-plotly-panel](https://github.com/nline/grafana-plotly-panel)

Render any kind of charts from any datasource with [Plotly](https://plotly.com/javascript/) (An open source javascript graphing library)
Render charts with [Plotly.js](https://plotly.com/javascript/). A maintained fork of [this plugin](https://github.com/ae3e/ae3e-plotly-panel).

Unlike the [natel-plotly-panel](https://github.com/NatelEnergy/grafana-plotly-panel), this plugin is not limited to specific types of charts. But, on the other hand, the user interface is really rough in order to let users to set all options available in Plotly.

## Getting started

The _Data_, _Layout_ and _Config_ fields match the common parameters described in [Plotly's documentation](https://plotly.com/javascript/plotlyjs-function-reference/). They must be in JSON format.

Data provided by the datasource can be transformed via a user-defined script before to be injected in the Plotly chart. The script includes 2 arguments :
Data provided by the datasource can be transformed via a user-defined script before to be injected in the Plotly chart. The script includes 2 arguments:

- `data` : Data returns by the datasource
- `variables` : Object that contains [Grafana's variables](https://grafana.com/docs/grafana/latest/variables/) available in the current dashboard (user variables and few global variables: `__from`, `__to`, `__interval` and `__interval_ms`).

The script must return an object with one or more of the following properties: `data`, `layout`, `config` and `frames`.
The script must return an object with one or more of the following properties:
- `data`
- `layout`
- `config`
- `frames`.

example :
For example:

```javascript
let x = data.series[0].fields[0].values.buffer;
let y = data.series[0].fields[1].values.buffer;

let serie = {
let series = {
x: x,
y: y,
name: variables.project, //where project is the name of a Grafana's variable
name: variables.project // where 'project' is the name of a Grafana's variable
};

return {
data: [serie],
data: [series],
config: {
displayModeBar: false,
},
};
```
## Screenshots

Object returned by the script and JSON provided in the _Data_, _Layout_ and _Config_ fields will be merged (deep merge).

If no script is provided, the panel will use only _Data_, _Layout_ and _Config_ fields.

Plotly panel editor :
Plotly panel editor:

![Editor](https://raw.githubusercontent.com//nline/grafana-plotly-panel/master/src/img/editor.png)

Example of charts :
Example of charts:

![Panel](https://raw.githubusercontent.com//nline/grafana-plotly-panel/master/src/img/panel.png)
20 changes: 10 additions & 10 deletions dist/MANIFEST.txt
Original file line number Diff line number Diff line change
Expand Up @@ -12,31 +12,31 @@ Hash: SHA512
],
"plugin": "jacksongoode-grafana-plotly-panel",
"version": "1.0.0",
"time": 1658263022227,
"time": 1658268185507,
"keyId": "7e4d0c6a708866e7",
"files": {
"index.html": "2fa2c4168c5bb7b8502989f437e4a1a71e663702b0ec9c01530215c8c026dcaf",
"LICENSE": "b40930bbcf80744c86c46a12bc9da056641d722716c378f5659b9e555ef833e1",
"CHANGELOG.md": "e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855",
"module.js.map": "f41650eea7c40e32e7542654093c16af4325a6c4666baca677d401546b7973f7",
"module.js.map": "0a32d284aba64aeac05889a2fcdd035e2fd3f4bb258309669ce6e123d3d6733b",
"plugin.json": "106809313ebb654ff28a313cae2189fceb525588ef7fb9590bf8288c48d313a5",
"README.md": "340e949d1d2d7bd693c072af2b76029e4a3a068303195f2d4e3a6d080b556bd9",
"README.md": "8fd54479c57696ff06a3afce428161f6d8ab4b27bee7b9c08d21e3186eeadce0",
"img/plotly.svg": "d5ec9acca6416f4bc3161de6f203511cc8c02888b0eb6fef35cfa8c7f590c715",
"img/editor.png": "158e968f971e6fc129c007867aa9a424d3674431452d3c83d4ff9ae7813d7e43",
"img/panel.png": "ebd614120962a84bc6e6808fe6df3dec7ade38c8abb9181d49c229e0ccd2df96",
"img/logo.svg": "745fb75066b18dcf4f31f6a5af9adaa85ecc9f89a53d97088c068e28cb1a58e6",
"module.js": "b6ffc8699d59db685ebecf732862e466493b734e300aeafc69ba0841a1877591",
"module.js": "4f8e1c012d3d776447b786703b2712f2d88a5e7c5bd704ff9cbca2bd541be9b0",
"dashboards/simple.json": "50cac2ecb72667a81d58ca4282b5482c3687f21dea5672aedbacd632d096d41a"
}
}
-----BEGIN PGP SIGNATURE-----
Version: OpenPGP.js v4.10.10
Comment: https://openpgpjs.org

wrcEARMKAAYFAmLXFe4AIQkQfk0ManCIZucWIQTzOyW2kQdOhGNlcPN+TQxq
cIhm57BFAgUWNIOiAvXKdiyoRgoG3VF/PJO46Y2TJ40g8VK4vokMnF5vlxVe
VqvUcU4Gyo04X0iyhp9YEq6Qe6HcYr164gz2wwII+MpynN/UjowwCeHDHWi2
44SimcAbRD0qW3xnx7e4sTLHquvt2fwGw/X42OOlMmdgJyCTxfSXw48mNMoO
inF/3P4=
=wXxe
wrkEARMKAAYFAmLXKhkAIQkQfk0ManCIZucWIQTzOyW2kQdOhGNlcPN+TQxq
cIhm573TAgkB2PnyASXnEmUxtoJBLAk6N/DZmiSEphxaT98yNxeL26ee/OXU
ZMYCY7Na8gshabvBTkxUtl44XCPJYrDr/0p0+YsCCQGrHfWOMkwcuBHQTUtQ
Tx+w/RlEdnOO33UNcTMggVP1Klbklj68Zyqx2SwJL+i4rGDE3GvvmIuqBWgq
p9UCvp7IlQ==
=oG+N
-----END PGP SIGNATURE-----
31 changes: 16 additions & 15 deletions dist/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,49 +3,50 @@
[![Marketplace](https://img.shields.io/badge/dynamic/json?logo=grafana&color=F47A20&label=marketplace&prefix=v&query=%24.items%5B%3F%28%40.slug%20%3D%3D%20%22grafana-plotly-panel%22%29%5D.version&url=https%3A%2F%2Fgrafana.com%2Fapi%2Fplugins)](https://grafana.com/grafana/plugins/grafana-plotly-panel)
[![Downloads](https://img.shields.io/badge/dynamic/json?logo=grafana&color=F47A20&label=downloads&query=%24.items%5B%3F%28%40.slug%20%3D%3D%20%22grafana-plotly-panel%22%29%5D.downloads&url=https%3A%2F%2Fgrafana.com%2Fapi%2Fplugins)](https://grafana.com/grafana/plugins/grafana-plotly-panel)

[https://github.com/nline/grafana-plotly-panel](https://github.com/nline/grafana-plotly-panel)

Render any kind of charts from any datasource with [Plotly](https://plotly.com/javascript/) (An open source javascript graphing library)
Render charts with [Plotly.js](https://plotly.com/javascript/). A maintained fork of [this plugin](https://github.com/ae3e/ae3e-plotly-panel).

Unlike the [natel-plotly-panel](https://github.com/NatelEnergy/grafana-plotly-panel), this plugin is not limited to specific types of charts. But, on the other hand, the user interface is really rough in order to let users to set all options available in Plotly.

## Getting started

The _Data_, _Layout_ and _Config_ fields match the common parameters described in [Plotly's documentation](https://plotly.com/javascript/plotlyjs-function-reference/). They must be in JSON format.

Data provided by the datasource can be transformed via a user-defined script before to be injected in the Plotly chart. The script includes 2 arguments :
Data provided by the datasource can be transformed via a user-defined script before to be injected in the Plotly chart. The script includes 2 arguments:

- `data` : Data returns by the datasource
- `variables` : Object that contains [Grafana's variables](https://grafana.com/docs/grafana/latest/variables/) available in the current dashboard (user variables and few global variables: `__from`, `__to`, `__interval` and `__interval_ms`).

The script must return an object with one or more of the following properties: `data`, `layout`, `config` and `frames`.
The script must return an object with one or more of the following properties:
- `data`
- `layout`
- `config`
- `frames`.

example :
For example:

```javascript
let x = data.series[0].fields[0].values.buffer;
let y = data.series[0].fields[1].values.buffer;

let serie = {
let series = {
x: x,
y: y,
name: variables.project, //where project is the name of a Grafana's variable
name: variables.project // where 'project' is the name of a Grafana's variable
};

return {
data: [serie],
data: [series],
config: {
displayModeBar: false,
},
};
```
## Screenshots

Object returned by the script and JSON provided in the _Data_, _Layout_ and _Config_ fields will be merged (deep merge).

If no script is provided, the panel will use only _Data_, _Layout_ and _Config_ fields.

Plotly panel editor :
Plotly panel editor:

![Editor](https://raw.githubusercontent.com//nline/grafana-plotly-panel/master/src/img/editor.png)

Example of charts :
Example of charts:

![Panel](https://raw.githubusercontent.com//nline/grafana-plotly-panel/master/src/img/panel.png)
Loading

0 comments on commit 4c71133

Please sign in to comment.