Plugins 〉Polystat

Panel
grafana

Polystat

  • Overview
  • Installation
  • Change log
  • Related content

Grafana Polystat Panel

Marketplace Downloads License Known Vulnerabilities Maintainability Test Coverage

This panel plugin provides a D3-based multistat panel for Grafana 7.3+.

A hexagon is created for each metric received, with the ability to group metrics into a composite metric, and display the triggered state of the composite.

Screenshots

This plugin supports autoscaling for best-fit sizing of each polygon to the panel size. When the complete text cannot be displayed, only tooltips are active.

All visible

Scaled3

Scaled down

Scaled1

Scaled down with tooltip

Scaled2

Options

State with Composites

Layout

Layout

Specify the desired number of columns and rows, or select Autosize to allow the plugin to calculate a "best fit" for the size of the panel.

Columns

Max # of columns to create

Rows

Max # rows to create NOTE: if both columns and rows are set, only rows*columns will be displayed, generally one or none should be set.

Display Limit

Set a limit on number of hexagons to be displayed, set to 0 for no limit.

Sizing

Sizing

Set the size of the polygon to a fixed size, or select auto-size for "best fit".

Sorting

Sorting

Tooltips

Tooltips

Set the font to be used for Tooltips

Global

Global

Display

Show all Show triggered

Show all example

Global Aliasing

This field allows you to specify a regular expression to pick a portion of matching metric names to be rendered instead of the full name.

If you have these 3 Queries, returning a series: Foo-A, values 1,2,3 Bar-B, values 4,5,6 Misc, values 7,8,9

Before Aliasing

Adding the regular expression: /(Foo|Bar)/, will display:

After Aliasing

Specify a regular expression to pick a portion of matching metric names.

Actions

Click Through

Click through to use when none are defined for a hexagon.

Show Metric Name

Display the metric in the hexagon

Show Metric Value

Display the metric value

Overrides

Overrides without Thresholds

Overrides with Thresholds

Overrides Rendered

Composites

Composites with Thresholds

Composite Rendered with Tooltip

Animation

Animation

Animate Composites

Animate hexagon to display metrics if there are composites

Animation Example

Speed

Speed of animation in milliseconds

Thresholds

This plugin supports "ranged" states.

Thresholds are expected to be sorted by ascending value, where

T0 = lowest decimal value, any state
TN = highest decimal value, any state

Initial state is set to "ok"

A comparison is made using "greater than or equal to" against the value If value >= thresholdValue state = X

Comparisons are made in reverse order, using the range between the Nth (inclusive) threshold and N+1 (exclusive)

  InclusiveValue = T(n).value
  ExclusiveValue = T(n+1).value

When there is no n+1 threshold, the highest value threshold T(n), a simple inclusive >= comparison is made

Example 1: (typical linear)

    T0 - 5, ok
    T1 - 10, warning
    T2 - 20, critical
  Value >= 20 (Value >= T2)
  10 <= Value < 20  (T1 <= Value < T2)
  5 <= Value < 10   (T0 <= Value < T1)

Example 2: (reverse linear)

    T0 - 50, critical
    T1 - 90, warning
    T2 - 100, ok
  Value >= 100
  90 <= value < 100
  50 <= value < 90

Example 3: (bounded)

    T0 - 50, critical
    T1 - 60, warning
    T2 - 70, ok
    T3 - 80, warning
    T4 - 90, critical
    Value >= 90
    80 <= Value < 90
    70 <= Value < 80
    60 <= Value < 70
    50 <= Value < 60

The "worst" state is returned after checking every threshold range

Time Range

Additional Screenshots

Tooltip

Hovering over a hexagon shows the metrics that comprise the displayed state. For composites this will expand members of the composite.

Tooltip

State with composites

This shows creation of composites, where you select which metrics comprise the composite.

State with Composites

This shows composites configured for GPU 0,1,2,3, and non-grouped metrics from GPU4-7.

State with partial composites

Templating

Using Dashboard Template Variables

Template variables are available in the clickThroughUrl setting, specified by using ${varname}. They can also be passed to another dashboard by appending var-VARNAME=value to the url

/dashboard/xyz?var-VARNAME=${VARNAME}

Using Polystat Variables

Each polygon represents either a single metric, or a composite metric

An example drilldown clickthrough url can be specified like this:

dashboard/db/drilldown?var-HOSTNAME=${__cell_name}

NOTE: Metrics are sorted using the global options "Sorting" settings. Global filters are also applied before dereferencing is performed.

Single Metric Variables

The name and value of a polygon can be referenced using the following syntax:

  • Metric Name: ${__cell_name}
  • Metric Value: ${__cell}
  • Metric Raw Value: ${__cell:raw} syntax. By default values are URI encoded. Use this syntax to disable encoding
Composite Metric Variables

The names and values of a composite polygon can be referenced using the following syntax:

  • Composite Name: ${__composite_name}
  • Metric Name: ${__cell_name_n}
  • Metric Value: ${__cell_n}
  • Metric Raw Value: ${__cell_n:raw} syntax. By default values are URI encoded. Use this syntax to disable encoding

Building

This plugin relies on @grafana/toolkit, typical build sequence:

yarn install
yarn build

For development, you can run:

yarn watch

The code will be parsed then copied into "dist" if "jslint" passes without errors.

Docker Support

A docker-compose.yml file is include for easy development and testing, just run

docker-compose up

Then browse to http://localhost:3000

External Dependencies

  • Grafana 7.3+

Enable Grafana TestData

Grafana TestData is not enabled by default. To enable it, first navigate to the Plugins section, found in your Grafana main menu. Click the Apps tabs in the Plugins section and select the Grafana TestData App. (Or navigate to http://your_grafana_instance/plugins/testdata/edit to go directly there). Finally click the enable button to enable.

Acknowledgements

This panel is based on this D3 example:

Many thanks to contributors:

  • Mathieu Rollet (matletix)
  • Mattias Jiderhamn (mjiderhamn)
  • AnushaBoggarapu
  • KamalakarGoretta
  • Rene Hennig (renehennig)
  • Hamza Ziyani (HZiyani)

and many others!

For more information, visit the docs on plugin installation.

Change Log

Entries

v1.2.6

  • Add support for global aliasing using regular expression
  • Fix custom border color #197
  • Updated docs

v1.2.5

  • Fix for null data from a query stopping processing other queries

v1.2.4

  • Convert to use dataframes
  • Add support for Ellipses when using Fixed Font Size Labels
  • Add support for composite creation using template variable

v1.2.3

  • Fix for polygon click-through causing incorrect fill color, Issues #174 #154
  • Support global value mappings in Overrides #164, Issue #159
  • Compute X and Y mouse positions in mouseover #166, Issue #163
  • Increase polystat-panel-tooltip z-index #165, Issue #130
  • Fix for composite threshold evalation using global thresholds #174, Issues #158 and #173
  • Fix for default warning color not rendering corectly #179
  • Feature: Tooltip can now be disabled (on by default), PR 158

v1.2.2

  • Fix for gradient threshold color issue #126

v1.2.1

  • Update for v6 event compatibility
  • Global hide/value feature
  • Fix for custom sizing #136
  • Text alignment fix for "square" and "circle" shapes
  • Fix for crashing issue #135
  • Fix for tooltip width #133

v1.2.0

  • Grafana 7.0.0 release with plugin signing

v1.1.0

  • New: Sort options for polygons and tooltips (issue #37)
  • New: Square-shape polygon now available (issue #92)
  • New: Optional Global thresholds
  • New: Sorting options for values and labels of polygons
  • New: Templating support for overrides and composites

v1.0.16

  • fixes variable encoding in clickthrough urls

v1.0.15

  • implemented metric referencing for clickthroughs (issue #38)
  • implemented composite name referencing
  • implemented template variables for clickthroughs
  • fixed bug with default clickthrough and sanitize url

v1.0.14

  • Update Logo
  • Fixed threshold evaluation
  • Added global fill color option
  • Autoscaling fonts has better results
  • Refactor UI for overrides, implement enable/disable
  • Refactor UI for composites, implement enable/disable
  • Implement global fill color for no thresholds
  • Now correctly parses custom color selection

v1.0.13

  • Default to roboto font
  • Default to short units and 2 decimals
  • Moved panel options outside of saved config
  • Add global unit format and global decimals
  • No longer errors when thresholds not found
  • Refactor thresholds to allow range evaluation in overrides
  • Refactor and implement custom gradients for overrides

v1.0.12

  • Fixed composite state evaluations
  • Added ability to set color and size of polygon border
  • Single shape now centers itself
  • Non-composites now show their value if possible
  • New tests added to verify fixes

v1.0.11

  • Panel no longer shares data/affects other panels of same type

v1.0.1

  • Added Options -> Show Timestamp checkbox for tooltips

v1.0.0

  • Initial commit