diff --git a/devenv/dev-dashboards/panel-stat/panel-stat-tests.json b/devenv/dev-dashboards/panel-stat/panel-stat-tests.json index dba99155d1f..3c5c59fd407 100644 --- a/devenv/dev-dashboards/panel-stat/panel-stat-tests.json +++ b/devenv/dev-dashboards/panel-stat/panel-stat-tests.json @@ -3,7 +3,10 @@ "list": [ { "builtIn": 1, - "datasource": "-- Grafana --", + "datasource": { + "type": "datasource", + "uid": "grafana" + }, "enable": true, "hide": true, "iconColor": "rgba(0, 211, 255, 1)", @@ -13,18 +16,35 @@ ] }, "editable": true, - "gnetId": null, + "fiscalYearStartMonth": 0, "graphTooltip": 0, + "id": 508, "links": [], + "liveNow": false, "panels": [ { - "datasource": null, + "collapsed": false, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 0 + }, + "id": 18, + "panels": [], + "title": "Original", + "type": "row" + }, + { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "fieldConfig": { "defaults": { "color": { "mode": "thresholds" }, - "custom": {}, "mappings": [], "thresholds": { "mode": "absolute", @@ -59,7 +79,7 @@ "h": 3, "w": 24, "x": 0, - "y": 0 + "y": 1 }, "id": 6, "interval": "6m", @@ -69,19 +89,27 @@ "justifyMode": "auto", "orientation": "auto", "reduceOptions": { - "calcs": ["mean"], + "calcs": [ + "mean" + ], "fields": "", "values": false }, + "showPercentChange": false, "sparkline": { "show": true }, - "textMode": "auto" + "textMode": "auto", + "wideLayout": true }, - "pluginVersion": "7.1.0-pre", + "pluginVersion": "10.3.0-pre", "targets": [ { "alias": "__house_locations", + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "labels": "", "min": 0, "noise": 5, @@ -91,19 +119,18 @@ "spread": 100 } ], - "timeFrom": null, - "timeShift": null, - "title": "", "type": "stat" }, { - "datasource": null, + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "fieldConfig": { "defaults": { "color": { "mode": "thresholds" }, - "custom": {}, "mappings": [], "thresholds": { "mode": "absolute", @@ -138,7 +165,7 @@ "h": 6, "w": 24, "x": 0, - "y": 3 + "y": 4 }, "id": 10, "interval": "7m", @@ -148,19 +175,27 @@ "justifyMode": "auto", "orientation": "auto", "reduceOptions": { - "calcs": ["mean"], + "calcs": [ + "mean" + ], "fields": "", "values": false }, + "showPercentChange": false, "sparkline": { "show": true }, - "textMode": "auto" + "textMode": "auto", + "wideLayout": true }, - "pluginVersion": "7.1.0-pre", + "pluginVersion": "10.3.0-pre", "targets": [ { "alias": "__house_locations", + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "min": 0, "noise": 10, "refId": "A", @@ -169,19 +204,19 @@ "spread": 10 } ], - "timeFrom": null, - "timeShift": null, "title": "Panel Title", "type": "stat" }, { - "datasource": null, + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "fieldConfig": { "defaults": { "color": { "mode": "thresholds" }, - "custom": {}, "mappings": [], "thresholds": { "mode": "absolute", @@ -216,7 +251,7 @@ "h": 6, "w": 24, "x": 0, - "y": 9 + "y": 10 }, "id": 14, "interval": "7m", @@ -226,19 +261,27 @@ "justifyMode": "auto", "orientation": "auto", "reduceOptions": { - "calcs": ["mean"], + "calcs": [ + "mean" + ], "fields": "", "values": false }, + "showPercentChange": false, "sparkline": { "show": true }, - "textMode": "auto" + "textMode": "auto", + "wideLayout": true }, - "pluginVersion": "7.1.0-pre", + "pluginVersion": "10.3.0-pre", "targets": [ { "alias": "__house_locations", + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "min": 0, "noise": 10, "refId": "A", @@ -247,19 +290,19 @@ "spread": 10 } ], - "timeFrom": null, - "timeShift": null, "title": "Panel Title", "type": "stat" }, { - "datasource": null, + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "fieldConfig": { "defaults": { "color": { "mode": "thresholds" }, - "custom": {}, "mappings": [], "thresholds": { "mode": "absolute", @@ -294,7 +337,7 @@ "h": 18, "w": 6, "x": 0, - "y": 15 + "y": 16 }, "id": 13, "interval": "5m", @@ -304,19 +347,27 @@ "justifyMode": "auto", "orientation": "horizontal", "reduceOptions": { - "calcs": ["mean"], + "calcs": [ + "mean" + ], "fields": "", "values": false }, + "showPercentChange": false, "sparkline": { "show": true }, - "textMode": "auto" + "textMode": "auto", + "wideLayout": true }, - "pluginVersion": "7.1.0-pre", + "pluginVersion": "10.3.0-pre", "targets": [ { "alias": "__server_names", + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "min": 0, "refId": "A", "scenarioId": "random_walk", @@ -324,19 +375,19 @@ "spread": 100 } ], - "timeFrom": null, - "timeShift": null, "title": "Horizontal with graph", "type": "stat" }, { - "datasource": null, + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "fieldConfig": { "defaults": { "color": { "mode": "thresholds" }, - "custom": {}, "mappings": [], "thresholds": { "mode": "absolute", @@ -371,7 +422,7 @@ "h": 9, "w": 4, "x": 6, - "y": 15 + "y": 16 }, "id": 8, "interval": "10m", @@ -381,59 +432,91 @@ "justifyMode": "auto", "orientation": "auto", "reduceOptions": { - "calcs": ["mean"], + "calcs": [ + "mean" + ], "fields": "", "values": false }, + "showPercentChange": false, "sparkline": { "show": true }, - "textMode": "auto" + "textMode": "auto", + "wideLayout": true }, - "pluginVersion": "7.1.0-pre", + "pluginVersion": "10.3.0-pre", "targets": [ { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "refId": "A", "scenarioId": "random_walk" }, { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "refId": "B", "scenarioId": "random_walk" }, { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "refId": "C", "scenarioId": "random_walk" }, { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "refId": "D", "scenarioId": "random_walk" }, { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "refId": "E", "scenarioId": "random_walk" }, { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "refId": "F", "scenarioId": "random_walk" }, { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "refId": "G", "scenarioId": "random_walk" } ], - "timeFrom": null, - "timeShift": null, "title": "Auto grid", "type": "stat" }, { - "datasource": null, + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "fieldConfig": { "defaults": { "color": { "mode": "thresholds" }, - "custom": {}, "mappings": [], "thresholds": { "mode": "absolute", @@ -468,7 +551,7 @@ "h": 9, "w": 6, "x": 10, - "y": 15 + "y": 16 }, "id": 12, "interval": "10m", @@ -478,59 +561,91 @@ "justifyMode": "auto", "orientation": "horizontal", "reduceOptions": { - "calcs": ["mean"], + "calcs": [ + "mean" + ], "fields": "", "values": false }, + "showPercentChange": false, "sparkline": { "show": true }, - "textMode": "auto" + "textMode": "auto", + "wideLayout": true }, - "pluginVersion": "7.1.0-pre", + "pluginVersion": "10.3.0-pre", "targets": [ { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "refId": "A", "scenarioId": "random_walk" }, { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "refId": "B", "scenarioId": "random_walk" }, { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "refId": "C", "scenarioId": "random_walk" }, { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "refId": "D", "scenarioId": "random_walk" }, { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "refId": "E", "scenarioId": "random_walk" }, { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "refId": "F", "scenarioId": "random_walk" }, { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "refId": "G", "scenarioId": "random_walk" } ], - "timeFrom": null, - "timeShift": null, "title": "Horizontal", "type": "stat" }, { - "datasource": null, + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "fieldConfig": { "defaults": { "color": { "mode": "thresholds" }, - "custom": {}, "mappings": [], "max": 200, "min": 0, @@ -567,7 +682,7 @@ "h": 9, "w": 8, "x": 16, - "y": 15 + "y": 16 }, "id": 15, "interval": "5m", @@ -577,19 +692,27 @@ "justifyMode": "auto", "orientation": "horizontal", "reduceOptions": { - "calcs": ["mean"], + "calcs": [ + "mean" + ], "fields": "", "values": false }, + "showPercentChange": false, "sparkline": { "show": true }, - "textMode": "name" + "textMode": "name", + "wideLayout": true }, - "pluginVersion": "7.1.0-pre", + "pluginVersion": "10.3.0-pre", "targets": [ { "alias": "__server_names", + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "max": 200, "min": 0, "noise": 5, @@ -600,19 +723,19 @@ "startValue": 0 } ], - "timeFrom": null, - "timeShift": null, "title": "Text mode name", "type": "stat" }, { - "datasource": null, + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "fieldConfig": { "defaults": { "color": { "mode": "thresholds" }, - "custom": {}, "mappings": [], "max": 200, "min": 0, @@ -649,7 +772,7 @@ "h": 9, "w": 18, "x": 6, - "y": 24 + "y": 25 }, "id": 16, "interval": "5m", @@ -659,19 +782,27 @@ "justifyMode": "auto", "orientation": "auto", "reduceOptions": { - "calcs": ["mean"], + "calcs": [ + "mean" + ], "fields": "", "values": false }, + "showPercentChange": false, "sparkline": { "show": true }, - "textMode": "value" + "textMode": "value", + "wideLayout": true }, - "pluginVersion": "7.1.0-pre", + "pluginVersion": "10.3.0-pre", "targets": [ { "alias": "__server_names", + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "max": 200, "min": 0, "noise": 15, @@ -682,19 +813,19 @@ "startValue": 0 } ], - "timeFrom": null, - "timeShift": null, "title": "Value only", "type": "stat" }, { - "datasource": null, + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "fieldConfig": { "defaults": { "color": { "mode": "thresholds" }, - "custom": {}, "mappings": [], "max": 200, "min": 0, @@ -731,7 +862,7 @@ "h": 5, "w": 24, "x": 0, - "y": 33 + "y": 34 }, "id": 17, "interval": "5m", @@ -741,19 +872,27 @@ "justifyMode": "auto", "orientation": "auto", "reduceOptions": { - "calcs": ["mean"], + "calcs": [ + "mean" + ], "fields": "", "values": false }, + "showPercentChange": false, "sparkline": { "show": true }, - "textMode": "none" + "textMode": "none", + "wideLayout": true }, - "pluginVersion": "7.1.0-pre", + "pluginVersion": "10.3.0-pre", "targets": [ { "alias": "__server_names", + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, "max": 200, "min": 0, "noise": 15, @@ -764,13 +903,1091 @@ "startValue": 0 } ], - "timeFrom": null, - "timeShift": null, "title": "No text", "type": "stat" + }, + { + "collapsed": false, + "gridPos": { + "h": 1, + "w": 24, + "x": 0, + "y": 39 + }, + "id": 19, + "panels": [], + "title": "Metrics Display", + "type": "row" + }, + { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "blue", + "value": null + }, + { + "color": "green", + "value": 10 + }, + { + "color": "purple", + "value": 20 + }, + { + "color": "orange", + "value": 40 + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "areaM2" + }, + "overrides": [] + }, + "gridPos": { + "h": 3, + "w": 24, + "x": 0, + "y": 40 + }, + "id": 20, + "interval": "6m", + "options": { + "colorMode": "background", + "graphMode": "area", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showPercentChange": true, + "sparkline": { + "show": true + }, + "textMode": "auto", + "wideLayout": true + }, + "pluginVersion": "10.3.0-pre", + "targets": [ + { + "alias": "__house_locations", + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "labels": "", + "min": 0, + "noise": 5, + "refId": "A", + "scenarioId": "random_walk", + "seriesCount": 6, + "spread": 100 + } + ], + "type": "stat" + }, + { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "blue", + "value": null + }, + { + "color": "green", + "value": 10 + }, + { + "color": "purple", + "value": 20 + }, + { + "color": "orange", + "value": 40 + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "areaM2" + }, + "overrides": [] + }, + "gridPos": { + "h": 6, + "w": 24, + "x": 0, + "y": 43 + }, + "id": 21, + "interval": "7m", + "options": { + "colorMode": "background", + "graphMode": "area", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showPercentChange": true, + "sparkline": { + "show": true + }, + "textMode": "auto", + "wideLayout": true + }, + "pluginVersion": "10.3.0-pre", + "targets": [ + { + "alias": "__house_locations", + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "min": 0, + "noise": 10, + "refId": "A", + "scenarioId": "random_walk", + "seriesCount": 6, + "spread": 10 + } + ], + "title": "Panel Title", + "type": "stat" + }, + { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "blue", + "value": null + }, + { + "color": "green", + "value": 10 + }, + { + "color": "purple", + "value": 20 + }, + { + "color": "orange", + "value": 40 + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "areaM2" + }, + "overrides": [] + }, + "gridPos": { + "h": 6, + "w": 24, + "x": 0, + "y": 49 + }, + "id": 22, + "interval": "7m", + "options": { + "colorMode": "value", + "graphMode": "area", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showPercentChange": true, + "sparkline": { + "show": true + }, + "textMode": "auto", + "wideLayout": true + }, + "pluginVersion": "10.3.0-pre", + "targets": [ + { + "alias": "__house_locations", + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "min": 0, + "noise": 10, + "refId": "A", + "scenarioId": "random_walk", + "seriesCount": 6, + "spread": 10 + } + ], + "title": "Panel Title", + "type": "stat" + }, + { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "blue", + "value": null + }, + { + "color": "green", + "value": 10 + }, + { + "color": "purple", + "value": 20 + }, + { + "color": "orange", + "value": 40 + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "areaM2" + }, + "overrides": [] + }, + "gridPos": { + "h": 18, + "w": 6, + "x": 0, + "y": 55 + }, + "id": 23, + "interval": "5m", + "options": { + "colorMode": "background", + "graphMode": "area", + "justifyMode": "auto", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showPercentChange": true, + "sparkline": { + "show": true + }, + "textMode": "auto", + "wideLayout": true + }, + "pluginVersion": "10.3.0-pre", + "targets": [ + { + "alias": "__server_names", + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "min": 0, + "refId": "A", + "scenarioId": "random_walk", + "seriesCount": 7, + "spread": 100 + } + ], + "title": "Horizontal with graph", + "type": "stat" + }, + { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "blue", + "value": null + }, + { + "color": "green", + "value": 10 + }, + { + "color": "purple", + "value": 20 + }, + { + "color": "orange", + "value": 40 + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "areaM2" + }, + "overrides": [] + }, + "gridPos": { + "h": 9, + "w": 4, + "x": 6, + "y": 55 + }, + "id": 24, + "interval": "10m", + "options": { + "colorMode": "background", + "graphMode": "line", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showPercentChange": true, + "sparkline": { + "show": true + }, + "textMode": "auto", + "wideLayout": true + }, + "pluginVersion": "10.3.0-pre", + "targets": [ + { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "refId": "A", + "scenarioId": "random_walk" + }, + { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "refId": "B", + "scenarioId": "random_walk" + }, + { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "refId": "C", + "scenarioId": "random_walk" + }, + { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "refId": "D", + "scenarioId": "random_walk" + }, + { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "refId": "E", + "scenarioId": "random_walk" + }, + { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "refId": "F", + "scenarioId": "random_walk" + }, + { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "refId": "G", + "scenarioId": "random_walk" + } + ], + "title": "Auto grid", + "type": "stat" + }, + { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "blue", + "value": null + }, + { + "color": "green", + "value": 10 + }, + { + "color": "purple", + "value": 20 + }, + { + "color": "orange", + "value": 40 + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "areaM2" + }, + "overrides": [] + }, + "gridPos": { + "h": 9, + "w": 6, + "x": 10, + "y": 55 + }, + "id": 25, + "interval": "10m", + "options": { + "colorMode": "background", + "graphMode": "line", + "justifyMode": "auto", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showPercentChange": true, + "sparkline": { + "show": true + }, + "textMode": "auto", + "wideLayout": true + }, + "pluginVersion": "10.3.0-pre", + "targets": [ + { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "refId": "A", + "scenarioId": "random_walk" + }, + { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "refId": "B", + "scenarioId": "random_walk" + }, + { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "refId": "C", + "scenarioId": "random_walk" + }, + { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "refId": "D", + "scenarioId": "random_walk" + }, + { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "refId": "E", + "scenarioId": "random_walk" + }, + { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "refId": "F", + "scenarioId": "random_walk" + }, + { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "refId": "G", + "scenarioId": "random_walk" + } + ], + "title": "Horizontal", + "type": "stat" + }, + { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [], + "max": 200, + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "blue", + "value": null + }, + { + "color": "green", + "value": 10 + }, + { + "color": "purple", + "value": 20 + }, + { + "color": "orange", + "value": 40 + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "areaM2" + }, + "overrides": [] + }, + "gridPos": { + "h": 9, + "w": 8, + "x": 16, + "y": 55 + }, + "id": 26, + "interval": "5m", + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "auto", + "orientation": "horizontal", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showPercentChange": true, + "sparkline": { + "show": true + }, + "textMode": "name", + "wideLayout": true + }, + "pluginVersion": "10.3.0-pre", + "targets": [ + { + "alias": "__server_names", + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "max": 200, + "min": 0, + "noise": 5, + "refId": "A", + "scenarioId": "random_walk", + "seriesCount": 7, + "spread": 20, + "startValue": 0 + } + ], + "title": "Text mode name", + "type": "stat" + }, + { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [], + "max": 200, + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "blue", + "value": null + }, + { + "color": "green", + "value": 10 + }, + { + "color": "purple", + "value": 20 + }, + { + "color": "orange", + "value": 40 + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "areaM2" + }, + "overrides": [] + }, + "gridPos": { + "h": 9, + "w": 18, + "x": 6, + "y": 64 + }, + "id": 27, + "interval": "5m", + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showPercentChange": true, + "sparkline": { + "show": true + }, + "textMode": "value", + "wideLayout": true + }, + "pluginVersion": "10.3.0-pre", + "targets": [ + { + "alias": "__server_names", + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "max": 200, + "min": 0, + "noise": 15, + "refId": "A", + "scenarioId": "random_walk", + "seriesCount": 45, + "spread": 1, + "startValue": 0 + } + ], + "title": "Value only", + "type": "stat" + }, + { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [], + "max": 200, + "min": 0, + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "blue", + "value": null + }, + { + "color": "green", + "value": 10 + }, + { + "color": "purple", + "value": 20 + }, + { + "color": "orange", + "value": 40 + }, + { + "color": "red", + "value": 80 + } + ] + }, + "unit": "areaM2" + }, + "overrides": [] + }, + "gridPos": { + "h": 5, + "w": 24, + "x": 0, + "y": 73 + }, + "id": 28, + "interval": "5m", + "options": { + "colorMode": "background", + "graphMode": "none", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "mean" + ], + "fields": "", + "values": false + }, + "showPercentChange": true, + "sparkline": { + "show": true + }, + "textMode": "none", + "wideLayout": true + }, + "pluginVersion": "10.3.0-pre", + "targets": [ + { + "alias": "__server_names", + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "max": 200, + "min": 0, + "noise": 15, + "refId": "A", + "scenarioId": "random_walk", + "seriesCount": 50, + "spread": 1, + "startValue": 0 + } + ], + "title": "No text", + "type": "stat" + }, + { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + } + }, + "overrides": [] + }, + "gridPos": { + "h": 8, + "w": 8, + "x": 0, + "y": 78 + }, + "id": 29, + "options": { + "colorMode": "value", + "graphMode": "area", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "showPercentChange": true, + "textMode": "value", + "wideLayout": true + }, + "pluginVersion": "10.3.0-pre", + "targets": [ + { + "csvContent": "time, value\n2023-12-13T00:00:00Z, 0\n2023-12-13T00:00:00Z, 100", + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "refId": "A", + "scenarioId": "csv_content" + } + ], + "title": "Infinity Percent Change", + "type": "stat" + }, + { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + } + }, + "overrides": [] + }, + "gridPos": { + "h": 8, + "w": 8, + "x": 8, + "y": 78 + }, + "id": 30, + "options": { + "colorMode": "value", + "graphMode": "area", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": false + }, + "showPercentChange": true, + "textMode": "value", + "wideLayout": true + }, + "pluginVersion": "10.3.0-pre", + "targets": [ + { + "csvContent": "time, value\n2023-12-13T00:00:00Z, 0\n2023-12-13T00:00:00Z, 0", + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "refId": "A", + "scenarioId": "csv_content" + } + ], + "title": "NaN Percent Change", + "type": "stat" + }, + { + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + } + }, + "overrides": [] + }, + "gridPos": { + "h": 8, + "w": 8, + "x": 16, + "y": 78 + }, + "id": 31, + "options": { + "colorMode": "value", + "graphMode": "area", + "justifyMode": "auto", + "orientation": "auto", + "reduceOptions": { + "calcs": [ + "lastNotNull" + ], + "fields": "", + "values": true + }, + "showPercentChange": false, + "textMode": "auto", + "wideLayout": true + }, + "pluginVersion": "10.3.0-pre", + "targets": [ + { + "csvContent": "Name, value\nName1, 10\nName2, 20", + "datasource": { + "type": "grafana-testdata-datasource", + "uid": "PD8C576611E62080A" + }, + "refId": "A", + "scenarioId": "csv_content" + } + ], + "title": "Value Options All", + "type": "stat" } ], - "schemaVersion": 26, + "refresh": "", + "schemaVersion": 39, "tags": [ "gdev", "panel-tests", @@ -784,10 +2001,22 @@ "to": "now" }, "timepicker": { - "refresh_intervals": ["5s", "10s", "30s", "1m", "5m", "15m", "30m", "1h", "2h", "1d"] + "refresh_intervals": [ + "5s", + "10s", + "30s", + "1m", + "5m", + "15m", + "30m", + "1h", + "2h", + "1d" + ] }, "timezone": "", "title": "Panel Tests - Stat", "uid": "EJ8_d9jZk", - "version": 1 -} + "version": 11, + "weekStart": "" +} \ No newline at end of file diff --git a/docs/sources/developers/kinds/composable/stat/panelcfg/schema-reference.md b/docs/sources/developers/kinds/composable/stat/panelcfg/schema-reference.md index b5e134bc426..51fac3c3120 100644 --- a/docs/sources/developers/kinds/composable/stat/panelcfg/schema-reference.md +++ b/docs/sources/developers/kinds/composable/stat/panelcfg/schema-reference.md @@ -26,16 +26,17 @@ title: StatPanelCfg kind It extends [SingleStatBaseOptions](#singlestatbaseoptions). -| Property | Type | Required | Default | Description | -|-----------------|-------------------------------------------------|----------|---------|---------------------------------------------------------------------------------------------------------------------------------------------| -| `colorMode` | string | **Yes** | | TODO docs
Possible values are: `value`, `background`, `background_solid`, `none`. | -| `graphMode` | string | **Yes** | | TODO docs
Possible values are: `none`, `line`, `area`. | -| `justifyMode` | string | **Yes** | | TODO docs
Possible values are: `auto`, `center`. | -| `textMode` | string | **Yes** | | TODO docs
Possible values are: `auto`, `value`, `value_and_name`, `name`, `none`. | -| `wideLayout` | boolean | **Yes** | `true` | | -| `orientation` | string | No | | *(Inherited from [SingleStatBaseOptions](#singlestatbaseoptions))*
TODO docs
Possible values are: `auto`, `vertical`, `horizontal`. | -| `reduceOptions` | [ReduceDataOptions](#reducedataoptions) | No | | *(Inherited from [SingleStatBaseOptions](#singlestatbaseoptions))*
TODO docs | -| `text` | [VizTextDisplayOptions](#viztextdisplayoptions) | No | | *(Inherited from [SingleStatBaseOptions](#singlestatbaseoptions))*
TODO docs | +| Property | Type | Required | Default | Description | +|---------------------|-------------------------------------------------|----------|---------|---------------------------------------------------------------------------------------------------------------------------------------------| +| `colorMode` | string | **Yes** | | TODO docs
Possible values are: `value`, `background`, `background_solid`, `none`. | +| `graphMode` | string | **Yes** | | TODO docs
Possible values are: `none`, `line`, `area`. | +| `justifyMode` | string | **Yes** | | TODO docs
Possible values are: `auto`, `center`. | +| `showPercentChange` | boolean | **Yes** | `false` | | +| `textMode` | string | **Yes** | | TODO docs
Possible values are: `auto`, `value`, `value_and_name`, `name`, `none`. | +| `wideLayout` | boolean | **Yes** | `true` | | +| `orientation` | string | No | | *(Inherited from [SingleStatBaseOptions](#singlestatbaseoptions))*
TODO docs
Possible values are: `auto`, `vertical`, `horizontal`. | +| `reduceOptions` | [ReduceDataOptions](#reducedataoptions) | No | | *(Inherited from [SingleStatBaseOptions](#singlestatbaseoptions))*
TODO docs | +| `text` | [VizTextDisplayOptions](#viztextdisplayoptions) | No | | *(Inherited from [SingleStatBaseOptions](#singlestatbaseoptions))*
TODO docs | ### ReduceDataOptions diff --git a/docs/sources/panels-visualizations/visualizations/stat/index.md b/docs/sources/panels-visualizations/visualizations/stat/index.md index 81574aa5ae5..ca51b1c7745 100644 --- a/docs/sources/panels-visualizations/visualizations/stat/index.md +++ b/docs/sources/panels-visualizations/visualizations/stat/index.md @@ -122,6 +122,14 @@ Choose an alignment mode. - **Auto -** If only a single value is shown (no repeat), then the value is centered. If multiple series or rows are shown, then the value is left-aligned. - **Center -** Stat value is centered. +### Show percent change + +Set whether percent change is displayed or not. Disabled by default. + +{{% admonition type="note" %}} +This option is not applicable when the **Show** setting, under **Value options**, is set to **All values**. +{{% /admonition %}} + ## Text size Adjust the sizes of the gauge text. diff --git a/packages/grafana-data/src/field/fieldDisplay.ts b/packages/grafana-data/src/field/fieldDisplay.ts index 9830cf20048..9833f10e2a7 100644 --- a/packages/grafana-data/src/field/fieldDisplay.ts +++ b/packages/grafana-data/src/field/fieldDisplay.ts @@ -72,6 +72,7 @@ export interface GetFieldDisplayValuesOptions { fieldConfig: FieldConfigSource; replaceVariables: InterpolateFunction; sparkline?: boolean; // Calculate the sparkline + percentChange?: boolean; // Calculate percent change theme: GrafanaTheme2; timeZone?: TimeZone; } @@ -186,6 +187,9 @@ export const getFieldDisplayValues = (options: GetFieldDisplayValuesOptions): Fi } else { displayValue.title = getFieldDisplayName(field, dataFrame, data); } + displayValue.percentChange = options.percentChange + ? reduceField({ field: field, reducers: [ReducerID.diffperc] }).diffperc + : undefined; let sparkline: FieldSparkline | undefined = undefined; if (options.sparkline) { diff --git a/packages/grafana-data/src/types/displayValue.ts b/packages/grafana-data/src/types/displayValue.ts index f0b9457e34b..845b4bce482 100644 --- a/packages/grafana-data/src/types/displayValue.ts +++ b/packages/grafana-data/src/types/displayValue.ts @@ -11,6 +11,10 @@ export interface DisplayValue extends FormattedValue { * 0-1 between min & max */ percent?: number; + /** + * 0-1 percent change across range + */ + percentChange?: number; /** * Color based on mappings or threshold */ diff --git a/packages/grafana-schema/src/raw/composable/stat/panelcfg/x/StatPanelCfg_types.gen.ts b/packages/grafana-schema/src/raw/composable/stat/panelcfg/x/StatPanelCfg_types.gen.ts index f372445d382..d0abdbb27fe 100644 --- a/packages/grafana-schema/src/raw/composable/stat/panelcfg/x/StatPanelCfg_types.gen.ts +++ b/packages/grafana-schema/src/raw/composable/stat/panelcfg/x/StatPanelCfg_types.gen.ts @@ -17,6 +17,7 @@ export interface Options extends common.SingleStatBaseOptions { colorMode: common.BigValueColorMode; graphMode: common.BigValueGraphMode; justifyMode: common.BigValueJustifyMode; + showPercentChange: boolean; textMode: common.BigValueTextMode; wideLayout: boolean; } @@ -25,6 +26,7 @@ export const defaultOptions: Partial = { colorMode: common.BigValueColorMode.Value, graphMode: common.BigValueGraphMode.Area, justifyMode: common.BigValueJustifyMode.Auto, + showPercentChange: false, textMode: common.BigValueTextMode.Auto, wideLayout: true, }; diff --git a/packages/grafana-ui/src/components/BigValue/BigValue.test.tsx b/packages/grafana-ui/src/components/BigValue/BigValue.test.tsx index 645d40a1e48..a5e6fa46e1e 100644 --- a/packages/grafana-ui/src/components/BigValue/BigValue.test.tsx +++ b/packages/grafana-ui/src/components/BigValue/BigValue.test.tsx @@ -5,17 +5,19 @@ import { createTheme } from '@grafana/data'; import { BigValue, BigValueColorMode, BigValueGraphMode, Props } from './BigValue'; +const valueObject = { + text: '25', + numeric: 25, + color: 'red', +}; + function getProps(propOverrides?: Partial): Props { const props: Props = { colorMode: BigValueColorMode.Background, graphMode: BigValueGraphMode.Line, height: 300, width: 300, - value: { - text: '25', - numeric: 25, - color: 'red', - }, + value: valueObject, theme: createTheme(), }; @@ -30,5 +32,22 @@ describe('BigValue', () => { expect(screen.getByText('25')).toBeInTheDocument(); }); + + it('should render with percent change', () => { + render( + + ); + + expect(screen.getByText('50%')).toBeInTheDocument(); + }); + + it('should render without percent change', () => { + render(); + expect(screen.queryByText('%')).toBeNull(); + }); }); }); diff --git a/packages/grafana-ui/src/components/BigValue/BigValue.tsx b/packages/grafana-ui/src/components/BigValue/BigValue.tsx index bfa8cd382b1..dea9b428f56 100644 --- a/packages/grafana-ui/src/components/BigValue/BigValue.tsx +++ b/packages/grafana-ui/src/components/BigValue/BigValue.tsx @@ -9,6 +9,7 @@ import { clearButtonStyles } from '../Button'; import { FormattedValueDisplay } from '../FormattedValueDisplay/FormattedValueDisplay'; import { buildLayout } from './BigValueLayout'; +import { PercentChange } from './PercentChange'; export enum BigValueColorMode { Background = 'background', @@ -92,6 +93,8 @@ export class BigValue extends PureComponent { const valueStyles = layout.getValueStyles(); const titleStyles = layout.getTitleStyles(); const textValues = layout.textValues; + const percentChange = this.props.value.percentChange; + const showPercentChange = percentChange != null && !Number.isNaN(percentChange); // When there is an outer data link this tooltip will override the outer native tooltip const tooltip = hasLinks ? undefined : textValues.tooltip; @@ -102,6 +105,9 @@ export class BigValue extends PureComponent {
{textValues.title &&
{textValues.title}
} + {showPercentChange && ( + + )}
{layout.renderChart()} diff --git a/packages/grafana-ui/src/components/BigValue/BigValueLayout.tsx b/packages/grafana-ui/src/components/BigValue/BigValueLayout.tsx index d5662b9b2be..db0d506f86e 100644 --- a/packages/grafana-ui/src/components/BigValue/BigValueLayout.tsx +++ b/packages/grafana-ui/src/components/BigValue/BigValueLayout.tsx @@ -9,6 +9,7 @@ import { calculateFontSize } from '../../utils/measureText'; import { Sparkline } from '../Sparkline/Sparkline'; import { BigValueColorMode, Props, BigValueJustifyMode, BigValueTextMode } from './BigValue'; +import { percentChangeString } from './PercentChange'; const LINE_HEIGHT = 1.2; const MAX_TITLE_SIZE = 30; @@ -102,9 +103,75 @@ export abstract class BigValueLayout { return styles; } + getPercentChangeStyles(percentChange: number): PercentChangeStyles { + const VALUE_TO_PERCENT_CHANGE_RATIO = 2.5; + const valueContainerStyles = this.getValueAndTitleContainerStyles(); + const percentFontSize = Math.max(this.valueFontSize / VALUE_TO_PERCENT_CHANGE_RATIO, 12); + let iconSize = Math.max(this.valueFontSize / 3, 10); + + const color = + percentChange > 0 + ? this.props.theme.visualization.getColorByName('green') + : this.props.theme.visualization.getColorByName('red'); + + const containerStyles: CSSProperties = { + fontSize: percentFontSize, + fontWeight: VALUE_FONT_WEIGHT, + lineHeight: LINE_HEIGHT, + position: 'relative', + display: 'flex', + alignItems: 'center', + gap: Math.max(percentFontSize / 3, 4), + zIndex: 1, + color, + }; + + if (this.justifyCenter) { + containerStyles.textAlign = 'center'; + } + + if (valueContainerStyles.flexDirection === 'column' && percentFontSize > 12) { + containerStyles.marginTop = -(percentFontSize / 4); + } + + if (valueContainerStyles.flexDirection === 'row') { + containerStyles.alignItems = 'baseline'; + + // Center the percent change vertically relative to the value + // This approach seems to work the best for all edge cases + // Note: the fixed min font size causes this to be off for a few edge cases + containerStyles.lineHeight = LINE_HEIGHT * VALUE_TO_PERCENT_CHANGE_RATIO; + } + + switch (this.props.colorMode) { + case BigValueColorMode.Background: + case BigValueColorMode.BackgroundSolid: + containerStyles.color = getTextColorForAlphaBackground(this.valueColor, this.props.theme.isDark); + break; + } + + if (this.props.textMode === BigValueTextMode.None) { + containerStyles.fontSize = calculateFontSize( + percentChangeString(percentChange), + this.maxTextWidth * 0.8, + this.maxTextHeight * 0.8, + LINE_HEIGHT, + undefined, + VALUE_FONT_WEIGHT + ); + iconSize = containerStyles.fontSize * 0.8; + } + + return { + containerStyles, + iconSize: iconSize, + }; + } + getValueAndTitleContainerStyles() { const styles: CSSProperties = { display: 'flex', + flexWrap: 'wrap', }; if (this.justifyCenter) { @@ -118,12 +185,12 @@ export abstract class BigValueLayout { } getPanelStyles(): CSSProperties { - const { width, height, theme, colorMode } = this.props; + const { width, height, theme, colorMode, textMode } = this.props; const panelStyles: CSSProperties = { width: `${width}px`, height: `${height}px`, - padding: `${this.panelPadding}px`, + padding: `${textMode === BigValueTextMode.None ? 2 : this.panelPadding}px`, borderRadius: theme.shape.radius.default, position: 'relative', display: 'flex', @@ -525,3 +592,8 @@ function getTextValues(props: Props): BigValueTextValues { }; } } + +export interface PercentChangeStyles { + containerStyles: CSSProperties; + iconSize: number; +} diff --git a/packages/grafana-ui/src/components/BigValue/PercentChange.tsx b/packages/grafana-ui/src/components/BigValue/PercentChange.tsx new file mode 100644 index 00000000000..b492dfb6398 --- /dev/null +++ b/packages/grafana-ui/src/components/BigValue/PercentChange.tsx @@ -0,0 +1,28 @@ +import React from 'react'; + +import { Icon } from '../Icon/Icon'; + +import { PercentChangeStyles } from './BigValueLayout'; + +export interface Props { + percentChange: number; + styles: PercentChangeStyles; +} + +export const PercentChange = ({ percentChange, styles }: Props) => { + const percentChangeIcon = + percentChange && (percentChange > 0 ? 'arrow-up' : percentChange < 0 ? 'arrow-down' : undefined); + + return ( +
+ {percentChangeIcon && ( + + )} + {percentChangeString(percentChange)} +
+ ); +}; + +export const percentChangeString = (percentChange: number) => { + return percentChange?.toLocaleString(undefined, { style: 'percent', maximumSignificantDigits: 3 }) ?? ''; +}; diff --git a/public/app/plugins/panel/stat/StatPanel.tsx b/public/app/plugins/panel/stat/StatPanel.tsx index 91733d4091c..4e1b45849b8 100644 --- a/public/app/plugins/panel/stat/StatPanel.tsx +++ b/public/app/plugins/panel/stat/StatPanel.tsx @@ -112,6 +112,7 @@ export class StatPanel extends PureComponent> { theme: config.theme2, data: data.series, sparkline: options.graphMode !== BigValueGraphMode.None, + percentChange: options.showPercentChange, timeZone, }); }; diff --git a/public/app/plugins/panel/stat/module.tsx b/public/app/plugins/panel/stat/module.tsx index f401feb8024..5d0a5757c05 100644 --- a/public/app/plugins/panel/stat/module.tsx +++ b/public/app/plugins/panel/stat/module.tsx @@ -87,6 +87,13 @@ export const plugin = new PanelPlugin(StatPanel) { value: BigValueJustifyMode.Center, label: 'Center' }, ], }, + }) + .addBooleanSwitch({ + path: 'showPercentChange', + name: 'Show percent change', + defaultValue: defaultOptions.showPercentChange, + category: mainCategory, + showIf: (config) => !config.reduceOptions.values, }); }) .setNoPadding() diff --git a/public/app/plugins/panel/stat/panelcfg.cue b/public/app/plugins/panel/stat/panelcfg.cue index a3f1476d28f..c38de15d9b1 100644 --- a/public/app/plugins/panel/stat/panelcfg.cue +++ b/public/app/plugins/panel/stat/panelcfg.cue @@ -27,11 +27,12 @@ composableKinds: PanelCfg: { schema: { Options: { common.SingleStatBaseOptions - graphMode: common.BigValueGraphMode & (*"area" | _) - colorMode: common.BigValueColorMode & (*"value" | _) - justifyMode: common.BigValueJustifyMode & (*"auto" | _) - textMode: common.BigValueTextMode & (*"auto" | _) - wideLayout: bool | *true + graphMode: common.BigValueGraphMode & (*"area" | _) + colorMode: common.BigValueColorMode & (*"value" | _) + justifyMode: common.BigValueJustifyMode & (*"auto" | _) + textMode: common.BigValueTextMode & (*"auto" | _) + wideLayout: bool | *true + showPercentChange: bool | *false } @cuetsy(kind="interface") } }] diff --git a/public/app/plugins/panel/stat/panelcfg.gen.ts b/public/app/plugins/panel/stat/panelcfg.gen.ts index 62634532009..9d860c655d0 100644 --- a/public/app/plugins/panel/stat/panelcfg.gen.ts +++ b/public/app/plugins/panel/stat/panelcfg.gen.ts @@ -14,6 +14,7 @@ export interface Options extends common.SingleStatBaseOptions { colorMode: common.BigValueColorMode; graphMode: common.BigValueGraphMode; justifyMode: common.BigValueJustifyMode; + showPercentChange: boolean; textMode: common.BigValueTextMode; wideLayout: boolean; } @@ -22,6 +23,7 @@ export const defaultOptions: Partial = { colorMode: common.BigValueColorMode.Value, graphMode: common.BigValueGraphMode.Area, justifyMode: common.BigValueJustifyMode.Auto, + showPercentChange: false, textMode: common.BigValueTextMode.Auto, wideLayout: true, };