Plugins 〉Plotly panel


Developer

AE3E

Sign up to receive occasional product news and updates:


Grafana Cloud
Grafana Cloud
  • Grafana, of course
  • 10k series Prometheus metrics
  • 50 GB logs
  • 50 GB traces
  • 2,232 app o11y host hours
  • ...and more
Create free account

No credit card needed, ever.


Panel
community

Plotly panel

  • Overview
  • Installation
  • Related content

Plotly Panel

Marketplace Downloads

https://github.com/ae3e/ae3e-plotly-panel

Render any kind of charts from any datasource with Plotly (An open source javascript graphing library)

Unlike the natel-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.

The Data, Layout and Config fields match the common parameters described in Plotly's documentation. 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 : Data returns by the datasource
  • variables : Object that contains Grafana's 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.

example :

let x  = data.series[0].fields[0].values.buffer
let y  = data.series[0].fields[1].values.buffer
let serie = {
x : x,
y : y,
name : variables.project //where project is the name of a Grafana’s variable
}

return { data : [serie], config : { displayModeBar: false } }

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 :

Editor

Example of charts :

Panel

Installing Plotly panel on Grafana Cloud:

For more information, visit the docs on plugin installation.

Installing on a local Grafana:

For local instances, plugins are installed and updated via a simple CLI command. Plugins are not updated automatically, however you will be notified when updates are available right within your Grafana.

1. Install the Panel

Use the grafana-cli tool to install Plotly panel from the commandline:

grafana-cli plugins install 

The plugin will be installed into your grafana plugins directory; the default is /var/lib/grafana/plugins. More information on the cli tool.

2. Add the Panel to a Dashboard

Installed panels are available immediately in the Dashboards section in your Grafana main menu, and can be added like any other core panel in Grafana.

To see a list of installed panels, click the Plugins item in the main menu. Both core panels and installed panels will appear.