BarGauge: Fix for negative min values (#17192)

This commit is contained in:
Torkel Ödegaard 2019-05-21 13:10:23 +02:00 committed by GitHub
parent fa9ffe38d2
commit 874039992f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
8 changed files with 1177 additions and 1375 deletions

View File

@ -48,28 +48,6 @@
"y": 0 "y": 0
}, },
"headings": false, "headings": false,
"id": 8,
"limit": 1000,
"links": [],
"query": "",
"recent": false,
"search": true,
"starred": false,
"tags": ["panel-demo"],
"timeFrom": null,
"timeShift": null,
"title": "tag: panel-demo",
"type": "dashlist"
},
{
"folderId": null,
"gridPos": {
"h": 13,
"w": 6,
"x": 12,
"y": 0
},
"headings": false,
"id": 2, "id": 2,
"limit": 1000, "limit": 1000,
"links": [], "links": [],
@ -83,6 +61,28 @@
"title": "tag: panel-tests", "title": "tag: panel-tests",
"type": "dashlist" "type": "dashlist"
}, },
{
"folderId": null,
"gridPos": {
"h": 26,
"w": 6,
"x": 12,
"y": 0
},
"headings": false,
"id": 3,
"limit": 1000,
"links": [],
"query": "",
"recent": false,
"search": true,
"starred": false,
"tags": ["gdev", "demo"],
"timeFrom": null,
"timeShift": null,
"title": "tag: dashboard-demo",
"type": "dashlist"
},
{ {
"folderId": null, "folderId": null,
"gridPos": { "gridPos": {
@ -114,28 +114,6 @@
"y": 13 "y": 13
}, },
"headings": false, "headings": false,
"id": 3,
"limit": 1000,
"links": [],
"query": "",
"recent": false,
"search": true,
"starred": false,
"tags": ["gdev", "demo"],
"timeFrom": null,
"timeShift": null,
"title": "tag: dashboard-demo",
"type": "dashlist"
},
{
"folderId": null,
"gridPos": {
"h": 13,
"w": 6,
"x": 12,
"y": 13
},
"headings": false,
"id": 4, "id": 4,
"limit": 1000, "limit": 1000,
"links": [], "links": [],
@ -146,7 +124,7 @@
"tags": ["templating", "gdev"], "tags": ["templating", "gdev"],
"timeFrom": null, "timeFrom": null,
"timeShift": null, "timeShift": null,
"title": "tag: templating", "title": "tag: templating ",
"type": "dashlist" "type": "dashlist"
} }
], ],
@ -167,5 +145,5 @@
"timezone": "", "timezone": "",
"title": "Grafana Dev Overview & Home", "title": "Grafana Dev Overview & Home",
"uid": "j6T00KRZz", "uid": "j6T00KRZz",
"version": 1 "version": 2
} }

View File

@ -15,26 +15,27 @@
"editable": true, "editable": true,
"gnetId": null, "gnetId": null,
"graphTooltip": 0, "graphTooltip": 0,
"id": 7501,
"links": [], "links": [],
"panels": [ "panels": [
{ {
"datasource": "gdev-testdata",
"gridPos": { "gridPos": {
"h": 7, "h": 7,
"w": 18, "w": 24,
"x": 0, "x": 0,
"y": 0 "y": 0
}, },
"id": 7, "id": 2,
"links": [], "links": [],
"options": { "options": {
"displayMode": "gradient", "displayMode": "lcd",
"fieldOptions": { "fieldOptions": {
"calcs": ["mean"], "calcs": ["mean"],
"defaults": { "defaults": {
"decimals": null,
"max": 100, "max": 100,
"min": 0, "min": 0,
"unit": "watt" "unit": "decgbytes"
}, },
"mappings": [], "mappings": [],
"override": {}, "override": {},
@ -47,7 +48,7 @@
{ {
"color": "orange", "color": "orange",
"index": 1, "index": 1,
"value": 40 "value": 60
}, },
{ {
"color": "red", "color": "red",
@ -59,95 +60,188 @@
}, },
"orientation": "vertical" "orientation": "vertical"
}, },
"pluginVersion": "6.2.0-pre",
"targets": [ "targets": [
{ {
"alias": "sda1",
"refId": "A", "refId": "A",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "sda2",
"refId": "B", "refId": "B",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "sda3",
"refId": "C", "refId": "C",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "sda4",
"refId": "D", "refId": "D",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "sda5",
"refId": "E", "refId": "E",
"scenarioId": "csv_metric_values", "scenarioId": "random_walk"
"stringInput": "10003,33333"
}, },
{ {
"alias": "sda6",
"refId": "F", "refId": "F",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "sda7",
"refId": "G", "refId": "G",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "sda8",
"refId": "H", "refId": "H",
"scenarioId": "csv_metric_values", "scenarioId": "random_walk"
"stringInput": "100,100,100"
}, },
{ {
"alias": "sda9",
"refId": "I", "refId": "I",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "sda10",
"refId": "J", "refId": "J",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "sda11",
"refId": "K", "refId": "K",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "sda12",
"refId": "L", "refId": "L",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "sda13",
"refId": "M", "refId": "M",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "sda14",
"refId": "N", "refId": "N",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "sda15",
"refId": "O", "refId": "O",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "sda16",
"refId": "P", "refId": "P",
"scenarioId": "random_walk" "scenarioId": "random_walk"
},
{
"refId": "Q",
"scenarioId": "random_walk"
} }
], ],
"timeFrom": null, "timeFrom": null,
"timeShift": null, "timeShift": null,
"title": "Usage", "title": "",
"transparent": true,
"type": "bargauge" "type": "bargauge"
}, },
{ {
"datasource": "gdev-testdata",
"gridPos": { "gridPos": {
"h": 22, "h": 10,
"w": 6, "w": 16,
"x": 18, "x": 0,
"y": 0 "y": 7
}, },
"id": 8, "id": 4,
"links": [], "links": [],
"options": { "options": {
"displayMode": "gradient", "displayMode": "gradient",
"fieldOptions": {
"calcs": ["mean"],
"defaults": {
"decimals": null,
"max": 100,
"min": 0,
"unit": "celsius"
},
"mappings": [],
"override": {},
"thresholds": [
{
"color": "blue",
"index": 0,
"value": null
},
{
"color": "green",
"index": 1,
"value": 20
},
{
"color": "orange",
"index": 2,
"value": 40
},
{
"color": "red",
"index": 3,
"value": 80
}
],
"values": false
},
"orientation": "horizontal"
},
"pluginVersion": "6.2.0-pre",
"targets": [
{
"alias": "Inside",
"refId": "H",
"scenarioId": "csv_metric_values",
"stringInput": "100,100,100"
},
{
"alias": "Outhouse",
"refId": "A",
"scenarioId": "random_walk"
},
{
"alias": "Area B",
"refId": "B",
"scenarioId": "random_walk"
},
{
"alias": "Basement",
"refId": "C",
"scenarioId": "random_walk"
},
{
"alias": "Garage",
"refId": "D",
"scenarioId": "random_walk"
}
],
"timeFrom": null,
"timeShift": null,
"title": "Gradient mode",
"type": "bargauge"
},
{
"datasource": "gdev-testdata",
"gridPos": {
"h": 10,
"w": 6,
"x": 16,
"y": 7
},
"id": 6,
"links": [],
"options": {
"displayMode": "basic",
"fieldOptions": { "fieldOptions": {
"calcs": ["mean"], "calcs": ["mean"],
"defaults": { "defaults": {
@ -160,19 +254,24 @@
"override": {}, "override": {},
"thresholds": [ "thresholds": [
{ {
"color": "green", "color": "blue",
"index": 0, "index": 0,
"value": null "value": null
}, },
{ {
"color": "orange", "color": "green",
"index": 1, "index": 1,
"value": 55 "value": 42.5
},
{
"color": "orange",
"index": 2,
"value": 80
}, },
{ {
"color": "red", "color": "red",
"index": 2, "index": 3,
"value": 95 "value": 90
} }
], ],
"values": false "values": false
@ -181,10 +280,6 @@
}, },
"pluginVersion": "6.2.0-pre", "pluginVersion": "6.2.0-pre",
"targets": [ "targets": [
{
"refId": "E",
"scenarioId": "random_walk"
},
{ {
"refId": "H", "refId": "H",
"scenarioId": "csv_metric_values", "scenarioId": "csv_metric_values",
@ -194,22 +289,6 @@
"refId": "A", "refId": "A",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{
"refId": "B",
"scenarioId": "random_walk"
},
{
"refId": "C",
"scenarioId": "random_walk"
},
{
"refId": "D",
"scenarioId": "random_walk"
},
{
"refId": "I",
"scenarioId": "random_walk"
},
{ {
"refId": "J", "refId": "J",
"scenarioId": "random_walk" "scenarioId": "random_walk"
@ -241,47 +320,78 @@
{ {
"refId": "Q", "refId": "Q",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}
],
"timeFrom": null,
"timeShift": null,
"title": "Basic",
"type": "bargauge"
},
{
"datasource": "gdev-testdata",
"gridPos": {
"h": 22,
"w": 2,
"x": 22,
"y": 7
},
"id": 8,
"links": [],
"options": {
"displayMode": "lcd",
"fieldOptions": {
"calcs": ["mean"],
"defaults": {
"max": 100,
"min": 0
},
"mappings": [],
"override": {},
"thresholds": [
{
"color": "red",
"index": 0,
"value": null
},
{
"color": "red",
"index": 1,
"value": 90
}
],
"values": false
}, },
"orientation": "vertical"
},
"targets": [
{ {
"refId": "F", "refId": "A",
"scenarioId": "random_walk"
},
{
"refId": "G",
"scenarioId": "random_walk"
},
{
"refId": "R",
"scenarioId": "random_walk"
},
{
"refId": "S",
"scenarioId": "random_walk" "scenarioId": "random_walk"
} }
], ],
"timeFrom": null, "timeFrom": null,
"timeShift": null, "timeShift": null,
"title": "Usage", "title": "Completion",
"type": "bargauge" "type": "bargauge"
}, },
{ {
"datasource": "gdev-testdata",
"gridPos": { "gridPos": {
"h": 15, "h": 12,
"w": 11, "w": 22,
"x": 0, "x": 0,
"y": 7 "y": 17
}, },
"id": 6, "id": 10,
"links": [], "links": [],
"options": { "options": {
"displayMode": "gradient", "displayMode": "gradient",
"fieldOptions": { "fieldOptions": {
"calcs": ["mean"], "calcs": ["mean"],
"defaults": { "defaults": {
"decimals": null,
"max": 100, "max": 100,
"min": 0, "min": 0,
"unit": "celsius" "unit": "decgbytes"
}, },
"mappings": [], "mappings": [],
"override": {}, "override": {},
@ -294,12 +404,12 @@
{ {
"color": "green", "color": "green",
"index": 1, "index": 1,
"value": 20 "value": 30
}, },
{ {
"color": "orange", "color": "orange",
"index": 2, "index": 2,
"value": 40 "value": 60
}, },
{ {
"color": "red", "color": "red",
@ -309,69 +419,113 @@
], ],
"values": false "values": false
}, },
"orientation": "horizontal" "orientation": "vertical"
}, },
"pluginVersion": "6.2.0-pre",
"targets": [ "targets": [
{ {
"alias": "Inside", "alias": "sda1",
"refId": "H",
"scenarioId": "csv_metric_values",
"stringInput": "100,100,100"
},
{
"alias": "Outhouse",
"refId": "A", "refId": "A",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "Area B", "alias": "sda2",
"refId": "B", "refId": "B",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "Basement", "alias": "sda3",
"refId": "C", "refId": "C",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "Garage", "alias": "sda4",
"refId": "D", "refId": "D",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "Attic", "alias": "sda5",
"refId": "E", "refId": "E",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "sda6",
"refId": "F", "refId": "F",
"scenarioId": "random_walk" "scenarioId": "random_walk"
},
{
"alias": "sda7",
"refId": "G",
"scenarioId": "random_walk"
},
{
"alias": "sda8",
"refId": "H",
"scenarioId": "random_walk"
},
{
"alias": "sda9",
"refId": "I",
"scenarioId": "random_walk"
},
{
"alias": "sda10",
"refId": "J",
"scenarioId": "random_walk"
},
{
"alias": "sda11",
"refId": "K",
"scenarioId": "random_walk"
},
{
"alias": "sda12",
"refId": "L",
"scenarioId": "random_walk"
},
{
"alias": "sda13",
"refId": "M",
"scenarioId": "random_walk"
},
{
"alias": "sda14",
"refId": "N",
"scenarioId": "random_walk"
},
{
"alias": "sda15",
"refId": "O",
"scenarioId": "random_walk"
},
{
"alias": "sda16",
"refId": "P",
"scenarioId": "random_walk"
} }
], ],
"timeFrom": null, "timeFrom": null,
"timeShift": null, "timeShift": null,
"title": "Temperature", "title": "",
"type": "bargauge" "type": "bargauge"
}, },
{ {
"datasource": "gdev-testdata",
"gridPos": { "gridPos": {
"h": 15, "h": 8,
"w": 7, "w": 24,
"x": 11, "x": 0,
"y": 7 "y": 29
}, },
"id": 9, "id": 11,
"links": [], "links": [],
"options": { "options": {
"displayMode": "basic", "displayMode": "basic",
"fieldOptions": { "fieldOptions": {
"calcs": ["mean"], "calcs": ["mean"],
"defaults": { "defaults": {
"decimals": null,
"max": 100, "max": 100,
"min": 0, "min": 0,
"unit": "celsius" "unit": "decgbytes"
}, },
"mappings": [], "mappings": [],
"override": {}, "override": {},
@ -384,12 +538,12 @@
{ {
"color": "green", "color": "green",
"index": 1, "index": 1,
"value": 20 "value": 30
}, },
{ {
"color": "orange", "color": "orange",
"index": 2, "index": 2,
"value": 40 "value": 60
}, },
{ {
"color": "red", "color": "red",
@ -399,89 +553,113 @@
], ],
"values": false "values": false
}, },
"orientation": "horizontal" "orientation": "vertical"
}, },
"pluginVersion": "6.2.0-pre",
"targets": [ "targets": [
{ {
"alias": "Inside", "alias": "sda1",
"refId": "H",
"scenarioId": "csv_metric_values",
"stringInput": "100,100,100"
},
{
"alias": "Outhouse",
"refId": "A", "refId": "A",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "Area B", "alias": "sda2",
"refId": "B", "refId": "B",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "Basement", "alias": "sda3",
"refId": "C", "refId": "C",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "Garage", "alias": "sda4",
"refId": "D", "refId": "D",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "Attic", "alias": "sda5",
"refId": "E", "refId": "E",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "sda6",
"refId": "F", "refId": "F",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "sda7",
"refId": "G", "refId": "G",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "sda8",
"refId": "H",
"scenarioId": "random_walk"
},
{
"alias": "sda9",
"refId": "I", "refId": "I",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "sda10",
"refId": "J", "refId": "J",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "sda11",
"refId": "K", "refId": "K",
"scenarioId": "random_walk" "scenarioId": "random_walk"
}, },
{ {
"alias": "sda12",
"refId": "L", "refId": "L",
"scenarioId": "random_walk" "scenarioId": "random_walk"
},
{
"alias": "sda13",
"refId": "M",
"scenarioId": "random_walk"
},
{
"alias": "sda14",
"refId": "N",
"scenarioId": "random_walk"
},
{
"alias": "sda15",
"refId": "O",
"scenarioId": "random_walk"
},
{
"alias": "sda16",
"refId": "P",
"scenarioId": "random_walk"
} }
], ],
"timeFrom": null, "timeFrom": null,
"timeShift": null, "timeShift": null,
"title": "Temperature", "title": "",
"type": "bargauge" "type": "bargauge"
} }
], ],
"refresh": false, "refresh": "10s",
"schemaVersion": 18, "schemaVersion": 18,
"style": "dark", "style": "dark",
"tags": ["gdev", "bargauge", "panel-demo"], "tags": ["gdev", "demo"],
"templating": { "templating": {
"list": [] "list": []
}, },
"time": { "time": {
"from": "now-30m", "from": "now-6h",
"to": "now" "to": "now"
}, },
"timepicker": { "timepicker": {
"refresh_intervals": ["1s", "5s", "10s", "30s", "1m", "5m", "15m", "30m", "1h", "2h", "1d"], "refresh_intervals": ["2s", "5s", "10s", "30s", "1m", "5m", "15m", "30m", "1h", "2h", "1d"],
"time_options": ["5m", "15m", "1h", "6h", "12h", "24h", "2d", "7d", "30d"] "time_options": ["5m", "15m", "1h", "6h", "12h", "24h", "2d", "7d", "30d"]
}, },
"timezone": "", "timezone": "",
"title": "Bar Gauge Animated Demo", "title": "Bar Gauge Demo",
"uid": "k5IUwQeikaa", "uid": "vmie2cmWz",
"version": 1 "version": 3
} }

View File

@ -1,376 +0,0 @@
{
"annotations": {
"list": [
{
"builtIn": 1,
"datasource": "-- Grafana --",
"enable": true,
"hide": true,
"iconColor": "rgba(0, 211, 255, 1)",
"name": "Annotations & Alerts",
"type": "dashboard"
}
]
},
"editable": true,
"gnetId": null,
"graphTooltip": 0,
"links": [],
"panels": [
{
"gridPos": {
"h": 7,
"w": 18,
"x": 0,
"y": 0
},
"id": 7,
"links": [],
"options": {
"displayMode": "gradient",
"fieldOptions": {
"calcs": ["mean"],
"defaults": {
"decimals": null,
"max": 100,
"min": 0,
"unit": "watt"
},
"mappings": [],
"override": {},
"thresholds": [
{
"color": "green",
"index": 0,
"value": null
},
{
"color": "orange",
"index": 1,
"value": 40
},
{
"color": "red",
"index": 2,
"value": 80
}
],
"values": false
},
"orientation": "vertical"
},
"pluginVersion": "6.2.0-pre",
"targets": [
{
"refId": "A",
"scenarioId": "random_walk"
},
{
"refId": "B",
"scenarioId": "random_walk"
},
{
"refId": "C",
"scenarioId": "random_walk"
},
{
"refId": "D",
"scenarioId": "random_walk"
},
{
"refId": "E",
"scenarioId": "csv_metric_values",
"stringInput": "10003,33333"
},
{
"refId": "F",
"scenarioId": "random_walk"
},
{
"refId": "G",
"scenarioId": "random_walk"
},
{
"refId": "H",
"scenarioId": "csv_metric_values",
"stringInput": "100,100,100"
},
{
"refId": "I",
"scenarioId": "random_walk"
},
{
"refId": "J",
"scenarioId": "random_walk"
},
{
"refId": "K",
"scenarioId": "random_walk"
},
{
"refId": "L",
"scenarioId": "random_walk"
},
{
"refId": "M",
"scenarioId": "random_walk"
},
{
"refId": "N",
"scenarioId": "random_walk"
},
{
"refId": "O",
"scenarioId": "random_walk"
},
{
"refId": "P",
"scenarioId": "random_walk"
},
{
"refId": "Q",
"scenarioId": "random_walk"
}
],
"timeFrom": null,
"timeShift": null,
"title": "Usage",
"type": "bargauge"
},
{
"gridPos": {
"h": 20,
"w": 6,
"x": 18,
"y": 0
},
"id": 8,
"links": [],
"options": {
"displayMode": "gradient",
"fieldOptions": {
"calcs": ["mean"],
"defaults": {
"decimals": null,
"max": 100,
"min": 0,
"unit": "watt"
},
"mappings": [],
"override": {},
"thresholds": [
{
"color": "green",
"index": 0,
"value": null
},
{
"color": "orange",
"index": 1,
"value": 65
},
{
"color": "red",
"index": 2,
"value": 95
}
],
"values": false
},
"orientation": "horizontal"
},
"pluginVersion": "6.2.0-pre",
"targets": [
{
"refId": "E",
"scenarioId": "random_walk"
},
{
"refId": "H",
"scenarioId": "csv_metric_values",
"stringInput": "100,100,100"
},
{
"refId": "A",
"scenarioId": "random_walk"
},
{
"refId": "B",
"scenarioId": "random_walk"
},
{
"refId": "C",
"scenarioId": "random_walk"
},
{
"refId": "D",
"scenarioId": "random_walk"
},
{
"refId": "I",
"scenarioId": "random_walk"
},
{
"refId": "J",
"scenarioId": "random_walk"
},
{
"refId": "K",
"scenarioId": "random_walk"
},
{
"refId": "L",
"scenarioId": "random_walk"
},
{
"refId": "M",
"scenarioId": "random_walk"
},
{
"refId": "N",
"scenarioId": "random_walk"
},
{
"refId": "O",
"scenarioId": "random_walk"
},
{
"refId": "P",
"scenarioId": "random_walk"
},
{
"refId": "Q",
"scenarioId": "random_walk"
},
{
"refId": "F",
"scenarioId": "random_walk"
},
{
"refId": "G",
"scenarioId": "random_walk"
},
{
"refId": "R",
"scenarioId": "random_walk"
},
{
"refId": "S",
"scenarioId": "random_walk"
}
],
"timeFrom": null,
"timeShift": null,
"title": "Usage",
"type": "bargauge"
},
{
"gridPos": {
"h": 13,
"w": 18,
"x": 0,
"y": 7
},
"id": 6,
"links": [],
"options": {
"displayMode": "gradient",
"fieldOptions": {
"calcs": ["mean"],
"defaults": {
"decimals": null,
"max": 100,
"min": 0,
"unit": "celsius"
},
"mappings": [],
"override": {},
"thresholds": [
{
"color": "blue",
"index": 0,
"value": null
},
{
"color": "green",
"index": 1,
"value": 20
},
{
"color": "orange",
"index": 2,
"value": 40
},
{
"color": "red",
"index": 3,
"value": 80
}
],
"values": false
},
"orientation": "horizontal"
},
"pluginVersion": "6.2.0-pre",
"targets": [
{
"alias": "Inside",
"refId": "H",
"scenarioId": "csv_metric_values",
"stringInput": "100,100,100"
},
{
"alias": "Outhouse",
"refId": "A",
"scenarioId": "random_walk"
},
{
"alias": "Area B",
"refId": "B",
"scenarioId": "random_walk"
},
{
"alias": "Basement",
"refId": "C",
"scenarioId": "random_walk"
},
{
"alias": "Garage",
"refId": "D",
"scenarioId": "random_walk"
},
{
"alias": "Attic",
"refId": "E",
"scenarioId": "random_walk"
},
{
"refId": "F",
"scenarioId": "random_walk"
}
],
"timeFrom": null,
"timeShift": null,
"title": "Temperature",
"type": "bargauge"
}
],
"schemaVersion": 18,
"style": "dark",
"tags": ["gdev", "bargauge", "panel-demo"],
"templating": {
"list": []
},
"time": {
"from": "now-6h",
"to": "now"
},
"timepicker": {
"refresh_intervals": ["5s", "10s", "30s", "1m", "5m", "15m", "30m", "1h", "2h", "1d"],
"time_options": ["5m", "15m", "1h", "6h", "12h", "24h", "2d", "7d", "30d"]
},
"timezone": "",
"title": "Bar Gauge Gradient Demo",
"uid": "RndRQw6mz",
"version": 1
}

View File

@ -1,405 +0,0 @@
{
"annotations": {
"list": [
{
"builtIn": 1,
"datasource": "-- Grafana --",
"enable": true,
"hide": true,
"iconColor": "rgba(0, 211, 255, 1)",
"name": "Annotations & Alerts",
"type": "dashboard"
}
]
},
"editable": true,
"gnetId": null,
"graphTooltip": 0,
"links": [],
"panels": [
{
"gridPos": {
"h": 7,
"w": 22,
"x": 0,
"y": 0
},
"id": 7,
"links": [],
"options": {
"displayMode": "lcd",
"fieldOptions": {
"calcs": ["mean"],
"defaults": {
"decimals": null,
"max": 100,
"min": 0,
"unit": "watt"
},
"mappings": [],
"override": {},
"thresholds": [
{
"color": "green",
"index": 0,
"value": null
},
{
"color": "orange",
"index": 1,
"value": 40
},
{
"color": "red",
"index": 2,
"value": 80
}
],
"values": false
},
"orientation": "vertical"
},
"pluginVersion": "6.2.0-pre",
"targets": [
{
"refId": "A",
"scenarioId": "random_walk"
},
{
"refId": "B",
"scenarioId": "random_walk"
},
{
"refId": "C",
"scenarioId": "random_walk"
},
{
"refId": "D",
"scenarioId": "random_walk"
},
{
"refId": "E",
"scenarioId": "csv_metric_values",
"stringInput": "10003,33333"
},
{
"refId": "F",
"scenarioId": "random_walk"
},
{
"refId": "G",
"scenarioId": "random_walk"
},
{
"refId": "H",
"scenarioId": "csv_metric_values",
"stringInput": "100,100,100"
},
{
"refId": "I",
"scenarioId": "random_walk"
},
{
"refId": "J",
"scenarioId": "random_walk"
},
{
"refId": "K",
"scenarioId": "random_walk"
},
{
"refId": "L",
"scenarioId": "random_walk"
},
{
"refId": "M",
"scenarioId": "random_walk"
},
{
"refId": "N",
"scenarioId": "random_walk"
},
{
"refId": "O",
"scenarioId": "random_walk"
},
{
"refId": "P",
"scenarioId": "random_walk"
},
{
"refId": "Q",
"scenarioId": "random_walk"
}
],
"timeFrom": null,
"timeShift": null,
"title": "Usage",
"type": "bargauge"
},
{
"gridPos": {
"h": 20,
"w": 2,
"x": 22,
"y": 0
},
"id": 11,
"links": [],
"options": {
"displayMode": "lcd",
"fieldOptions": {
"calcs": ["mean"],
"defaults": {
"decimals": null,
"max": 100,
"min": 0,
"unit": "percent"
},
"mappings": [],
"override": {},
"thresholds": [
{
"color": "green",
"index": 0,
"value": null
},
{
"color": "red",
"index": 1,
"value": 80
}
],
"values": false
},
"orientation": "vertical"
},
"pluginVersion": "6.2.0-pre",
"targets": [
{
"refId": "A",
"scenarioId": "random_walk"
}
],
"timeFrom": null,
"timeShift": null,
"title": "Progress",
"type": "bargauge"
},
{
"gridPos": {
"h": 13,
"w": 10,
"x": 0,
"y": 7
},
"id": 6,
"links": [],
"options": {
"displayMode": "gradient",
"fieldOptions": {
"calcs": ["mean"],
"defaults": {
"decimals": null,
"max": 100,
"min": 0,
"unit": "celsius"
},
"mappings": [],
"override": {},
"thresholds": [
{
"color": "blue",
"index": 0,
"value": null
},
{
"color": "green",
"index": 1,
"value": 20
},
{
"color": "orange",
"index": 2,
"value": 40
},
{
"color": "red",
"index": 3,
"value": 80
}
],
"values": false
},
"orientation": "horizontal"
},
"pluginVersion": "6.2.0-pre",
"targets": [
{
"alias": "Inside",
"refId": "H",
"scenarioId": "csv_metric_values",
"stringInput": "100,100,100"
},
{
"alias": "Outhouse",
"refId": "A",
"scenarioId": "random_walk"
},
{
"alias": "Area B",
"refId": "B",
"scenarioId": "random_walk"
},
{
"alias": "Basement",
"refId": "C",
"scenarioId": "random_walk"
},
{
"alias": "Garage",
"refId": "D",
"scenarioId": "random_walk"
},
{
"alias": "Attic",
"refId": "E",
"scenarioId": "random_walk"
},
{
"refId": "F",
"scenarioId": "random_walk"
}
],
"timeFrom": null,
"timeShift": null,
"title": "Temperature",
"type": "bargauge"
},
{
"gridPos": {
"h": 13,
"w": 12,
"x": 10,
"y": 7
},
"id": 8,
"links": [],
"options": {
"displayMode": "basic",
"fieldOptions": {
"calcs": ["mean"],
"defaults": {
"decimals": null,
"max": 100,
"min": 0,
"unit": "watt"
},
"mappings": [],
"override": {},
"thresholds": [
{
"color": "green",
"index": 0,
"value": null
},
{
"color": "purple",
"index": 1,
"value": 50
},
{
"color": "blue",
"index": 2,
"value": 70
}
],
"values": false
},
"orientation": "horizontal"
},
"pluginVersion": "6.2.0-pre",
"targets": [
{
"refId": "H",
"scenarioId": "csv_metric_values",
"stringInput": "100,100,100"
},
{
"refId": "A",
"scenarioId": "random_walk"
},
{
"refId": "B",
"scenarioId": "random_walk"
},
{
"refId": "C",
"scenarioId": "random_walk"
},
{
"refId": "D",
"scenarioId": "random_walk"
},
{
"refId": "I",
"scenarioId": "random_walk"
},
{
"refId": "J",
"scenarioId": "random_walk"
},
{
"refId": "K",
"scenarioId": "random_walk"
},
{
"refId": "L",
"scenarioId": "random_walk"
},
{
"refId": "M",
"scenarioId": "random_walk"
},
{
"refId": "N",
"scenarioId": "random_walk"
},
{
"refId": "O",
"scenarioId": "random_walk"
},
{
"refId": "P",
"scenarioId": "random_walk"
},
{
"refId": "Q",
"scenarioId": "random_walk"
}
],
"timeFrom": null,
"timeShift": null,
"title": "Usage",
"type": "bargauge"
}
],
"schemaVersion": 18,
"style": "dark",
"tags": ["gdev", "bargauge", "panel-demo"],
"templating": {
"list": []
},
"time": {
"from": "now-6h",
"to": "now"
},
"timepicker": {
"refresh_intervals": ["5s", "10s", "30s", "1m", "5m", "15m", "30m", "1h", "2h", "1d"],
"time_options": ["5m", "15m", "1h", "6h", "12h", "24h", "2d", "7d", "30d"]
},
"timezone": "",
"title": "Bar Gauge All Modes Demo",
"uid": "zt2f6NgZzaa",
"version": 1
}

View File

@ -0,0 +1,829 @@
{
"annotations": {
"list": [
{
"builtIn": 1,
"datasource": "-- Grafana --",
"enable": true,
"hide": true,
"iconColor": "rgba(0, 211, 255, 1)",
"name": "Annotations & Alerts",
"type": "dashboard"
}
]
},
"editable": true,
"gnetId": null,
"graphTooltip": 0,
"links": [],
"panels": [
{
"gridPos": {
"h": 7,
"w": 6,
"x": 0,
"y": 0
},
"id": 6,
"links": [],
"options": {
"displayMode": "gradient",
"fieldOptions": {
"calcs": ["mean"],
"defaults": {
"decimals": null,
"max": 100,
"min": 0,
"unit": "celsius"
},
"mappings": [],
"override": {},
"thresholds": [
{
"color": "blue",
"index": 0,
"value": null
},
{
"color": "green",
"index": 1,
"value": 20
},
{
"color": "orange",
"index": 2,
"value": 40
},
{
"color": "red",
"index": 3,
"value": 80
}
],
"values": false
},
"orientation": "horizontal"
},
"pluginVersion": "6.2.0-pre",
"targets": [
{
"alias": "Inside",
"refId": "H",
"scenarioId": "csv_metric_values",
"stringInput": "100,100,100"
},
{
"alias": "Outhouse",
"refId": "A",
"scenarioId": "random_walk"
},
{
"refId": "F",
"scenarioId": "random_walk"
}
],
"timeFrom": null,
"timeShift": null,
"title": "Title above bar",
"type": "bargauge"
},
{
"gridPos": {
"h": 7,
"w": 5,
"x": 6,
"y": 0
},
"id": 12,
"links": [],
"options": {
"displayMode": "gradient",
"fieldOptions": {
"calcs": ["mean"],
"defaults": {
"decimals": null,
"max": 100,
"min": 0,
"unit": "celsius"
},
"mappings": [],
"override": {},
"thresholds": [
{
"color": "blue",
"index": 0,
"value": null
},
{
"color": "green",
"index": 1,
"value": 20
},
{
"color": "orange",
"index": 2,
"value": 40
},
{
"color": "red",
"index": 3,
"value": 80
}
],
"values": false
},
"orientation": "horizontal"
},
"pluginVersion": "6.2.0-pre",
"targets": [
{
"alias": "Inside",
"refId": "H",
"scenarioId": "csv_metric_values",
"stringInput": "100,100,100"
},
{
"alias": "Outhouse",
"refId": "A",
"scenarioId": "random_walk"
},
{
"refId": "F",
"scenarioId": "random_walk"
},
{
"refId": "B",
"scenarioId": "random_walk"
},
{
"refId": "C",
"scenarioId": "random_walk"
}
],
"timeFrom": null,
"timeShift": null,
"title": "Title to left of bar",
"type": "bargauge"
},
{
"gridPos": {
"h": 7,
"w": 7,
"x": 11,
"y": 0
},
"id": 13,
"links": [],
"options": {
"displayMode": "basic",
"fieldOptions": {
"calcs": ["mean"],
"defaults": {
"decimals": null,
"max": 100,
"min": 0,
"unit": "celsius"
},
"mappings": [],
"override": {},
"thresholds": [
{
"color": "blue",
"index": 0,
"value": null
},
{
"color": "green",
"index": 1,
"value": 20
},
{
"color": "orange",
"index": 2,
"value": 40
},
{
"color": "red",
"index": 3,
"value": 80
}
],
"values": false
},
"orientation": "horizontal"
},
"pluginVersion": "6.2.0-pre",
"targets": [
{
"alias": "Inside",
"refId": "H",
"scenarioId": "csv_metric_values",
"stringInput": "100,100,100"
},
{
"alias": "Outhouse",
"refId": "A",
"scenarioId": "random_walk"
},
{
"refId": "F",
"scenarioId": "random_walk"
},
{
"refId": "B",
"scenarioId": "random_walk"
},
{
"refId": "C",
"scenarioId": "random_walk"
}
],
"timeFrom": null,
"timeShift": null,
"title": "Basic mode",
"type": "bargauge"
},
{
"gridPos": {
"h": 7,
"w": 6,
"x": 18,
"y": 0
},
"id": 14,
"links": [],
"options": {
"displayMode": "lcd",
"fieldOptions": {
"calcs": ["mean"],
"defaults": {
"decimals": null,
"max": 100,
"min": 0,
"unit": "celsius"
},
"mappings": [],
"override": {},
"thresholds": [
{
"color": "blue",
"index": 0,
"value": null
},
{
"color": "green",
"index": 1,
"value": 20
},
{
"color": "orange",
"index": 2,
"value": 40
},
{
"color": "red",
"index": 3,
"value": 80
}
],
"values": false
},
"orientation": "horizontal"
},
"pluginVersion": "6.2.0-pre",
"targets": [
{
"alias": "Inside",
"refId": "H",
"scenarioId": "csv_metric_values",
"stringInput": "100,100,100"
},
{
"alias": "Outhouse",
"refId": "A",
"scenarioId": "random_walk"
},
{
"refId": "F",
"scenarioId": "random_walk"
},
{
"refId": "B",
"scenarioId": "random_walk"
},
{
"refId": "C",
"scenarioId": "random_walk"
}
],
"timeFrom": null,
"timeShift": null,
"title": "LED",
"type": "bargauge"
},
{
"gridPos": {
"h": 9,
"w": 11,
"x": 0,
"y": 7
},
"id": 7,
"links": [],
"options": {
"displayMode": "lcd",
"fieldOptions": {
"calcs": ["mean"],
"defaults": {
"decimals": null,
"max": 100,
"min": 0,
"unit": "watt"
},
"mappings": [],
"override": {},
"thresholds": [
{
"color": "green",
"index": 0,
"value": null
},
{
"color": "orange",
"index": 1,
"value": 40
},
{
"color": "red",
"index": 2,
"value": 80
}
],
"values": false
},
"orientation": "vertical"
},
"pluginVersion": "6.2.0-pre",
"targets": [
{
"refId": "E",
"scenarioId": "csv_metric_values",
"stringInput": "10003,33333"
},
{
"refId": "F",
"scenarioId": "random_walk"
},
{
"refId": "G",
"scenarioId": "random_walk"
},
{
"refId": "H",
"scenarioId": "csv_metric_values",
"stringInput": "100,100,100"
},
{
"refId": "I",
"scenarioId": "random_walk"
},
{
"refId": "J",
"scenarioId": "random_walk"
},
{
"refId": "K",
"scenarioId": "random_walk"
},
{
"refId": "L",
"scenarioId": "random_walk"
},
{
"refId": "M",
"scenarioId": "random_walk"
},
{
"refId": "N",
"scenarioId": "random_walk"
},
{
"refId": "O",
"scenarioId": "random_walk"
},
{
"refId": "P",
"scenarioId": "random_walk"
},
{
"refId": "Q",
"scenarioId": "random_walk"
}
],
"timeFrom": null,
"timeShift": null,
"title": "LED Vertical",
"type": "bargauge"
},
{
"gridPos": {
"h": 9,
"w": 13,
"x": 11,
"y": 7
},
"id": 8,
"links": [],
"options": {
"displayMode": "basic",
"fieldOptions": {
"calcs": ["mean"],
"defaults": {
"decimals": null,
"max": 100,
"min": 0,
"unit": "watt"
},
"mappings": [],
"override": {},
"thresholds": [
{
"color": "green",
"index": 0,
"value": null
},
{
"color": "purple",
"index": 1,
"value": 50
},
{
"color": "blue",
"index": 2,
"value": 70
}
],
"values": false
},
"orientation": "vertical"
},
"pluginVersion": "6.2.0-pre",
"targets": [
{
"refId": "H",
"scenarioId": "csv_metric_values",
"stringInput": "100,100,100"
},
{
"refId": "A",
"scenarioId": "random_walk"
},
{
"refId": "B",
"scenarioId": "random_walk"
},
{
"refId": "C",
"scenarioId": "random_walk"
},
{
"refId": "D",
"scenarioId": "random_walk"
},
{
"refId": "I",
"scenarioId": "random_walk"
},
{
"refId": "J",
"scenarioId": "random_walk"
},
{
"refId": "K",
"scenarioId": "random_walk"
},
{
"refId": "L",
"scenarioId": "random_walk"
},
{
"refId": "M",
"scenarioId": "random_walk"
},
{
"refId": "N",
"scenarioId": "random_walk"
},
{
"refId": "O",
"scenarioId": "random_walk"
},
{
"refId": "P",
"scenarioId": "random_walk"
},
{
"refId": "Q",
"scenarioId": "random_walk"
}
],
"timeFrom": null,
"timeShift": null,
"title": "Basic vertical ",
"type": "bargauge"
},
{
"gridPos": {
"h": 7,
"w": 11,
"x": 0,
"y": 16
},
"id": 16,
"links": [],
"options": {
"displayMode": "lcd",
"fieldOptions": {
"calcs": ["last"],
"defaults": {
"max": 100,
"min": 0
},
"mappings": [],
"override": {},
"thresholds": [
{
"color": "green",
"index": 0,
"value": null
},
{
"color": "blue",
"index": 1,
"value": 40
},
{
"color": "red",
"index": 2,
"value": 80
}
],
"values": false
},
"orientation": "horizontal"
},
"pluginVersion": "6.3.0-pre",
"targets": [
{
"refId": "A",
"scenarioId": "csv_metric_values",
"stringInput": "1,20,90,30,5,0,-100"
}
],
"timeFrom": null,
"timeShift": null,
"title": "Negative value below min",
"type": "bargauge"
},
{
"gridPos": {
"h": 7,
"w": 3,
"x": 11,
"y": 16
},
"id": 17,
"links": [],
"options": {
"displayMode": "lcd",
"fieldOptions": {
"calcs": ["last"],
"defaults": {
"max": 100,
"min": 0
},
"mappings": [],
"override": {},
"thresholds": [
{
"color": "green",
"index": 0,
"value": null
},
{
"color": "blue",
"index": 1,
"value": 40
},
{
"color": "red",
"index": 2,
"value": 80
}
],
"values": false
},
"orientation": "vertical"
},
"pluginVersion": "6.3.0-pre",
"targets": [
{
"refId": "A",
"scenarioId": "csv_metric_values",
"stringInput": "1,20,90,30,5,0,-100"
}
],
"timeFrom": null,
"timeShift": null,
"title": "Negative value below min",
"type": "bargauge"
},
{
"gridPos": {
"h": 7,
"w": 3,
"x": 14,
"y": 16
},
"id": 18,
"links": [],
"options": {
"displayMode": "lcd",
"fieldOptions": {
"calcs": ["last"],
"defaults": {
"max": 100,
"min": -10
},
"mappings": [],
"override": {},
"thresholds": [
{
"color": "green",
"index": 0,
"value": null
},
{
"color": "blue",
"index": 1,
"value": 40
},
{
"color": "red",
"index": 2,
"value": 80
}
],
"values": false
},
"orientation": "vertical"
},
"pluginVersion": "6.3.0-pre",
"targets": [
{
"refId": "A",
"scenarioId": "csv_metric_values",
"stringInput": "1,20,90,30,5,6"
}
],
"timeFrom": null,
"timeShift": null,
"title": "Positive value above min",
"type": "bargauge"
},
{
"gridPos": {
"h": 7,
"w": 3,
"x": 17,
"y": 16
},
"id": 19,
"links": [],
"options": {
"displayMode": "lcd",
"fieldOptions": {
"calcs": ["last"],
"defaults": {
"max": 35,
"min": -20
},
"mappings": [],
"override": {},
"thresholds": [
{
"color": "blue",
"index": 0,
"value": null
},
{
"color": "green",
"index": 1,
"value": 5
},
{
"color": "#EAB839",
"index": 2,
"value": 25
},
{
"color": "red",
"index": 3,
"value": 30
}
],
"values": false
},
"orientation": "vertical"
},
"pluginVersion": "6.3.0-pre",
"targets": [
{
"refId": "A",
"scenarioId": "csv_metric_values",
"stringInput": "1,20,90,30,5,6"
}
],
"timeFrom": null,
"timeShift": null,
"title": "Negative min ",
"type": "bargauge"
},
{
"gridPos": {
"h": 7,
"w": 4,
"x": 20,
"y": 16
},
"id": 20,
"links": [],
"options": {
"displayMode": "gradient",
"fieldOptions": {
"calcs": ["last"],
"defaults": {
"max": 35,
"min": -20
},
"mappings": [],
"override": {},
"thresholds": [
{
"color": "blue",
"index": 0,
"value": null
},
{
"color": "green",
"index": 1,
"value": 5
},
{
"color": "#EAB839",
"index": 2,
"value": 25
},
{
"color": "red",
"index": 3,
"value": 30
}
],
"values": false
},
"orientation": "vertical"
},
"pluginVersion": "6.3.0-pre",
"targets": [
{
"refId": "A",
"scenarioId": "csv_metric_values",
"stringInput": "30,30"
}
],
"timeFrom": null,
"timeShift": null,
"title": "Negative min",
"type": "bargauge"
}
],
"schemaVersion": 18,
"style": "dark",
"tags": ["gdev", "panel-tests"],
"templating": {
"list": []
},
"time": {
"from": "now-6h",
"to": "now"
},
"timepicker": {
"refresh_intervals": ["5s", "10s", "30s", "1m", "5m", "15m", "30m", "1h", "2h", "1d"],
"time_options": ["5m", "15m", "1h", "6h", "12h", "24h", "2d", "7d", "30d"]
},
"timezone": "",
"title": "Panel Tests - Bar Gauge",
"uid": "O6f11TZWk",
"version": 12
}

View File

@ -1,400 +0,0 @@
{
"annotations": {
"list": [
{
"builtIn": 1,
"datasource": "-- Grafana --",
"enable": true,
"hide": true,
"iconColor": "rgba(0, 211, 255, 1)",
"name": "Annotations & Alerts",
"type": "dashboard"
}
]
},
"editable": true,
"gnetId": null,
"graphTooltip": 0,
"links": [],
"panels": [
{
"gridPos": {
"h": 8,
"w": 22,
"x": 0,
"y": 0
},
"id": 7,
"links": [],
"options": {
"displayMode": "lcd",
"fieldOptions": {
"calcs": ["mean"],
"defaults": {
"decimals": null,
"max": 100,
"min": 0,
"unit": "watt"
},
"mappings": [],
"override": {},
"thresholds": [
{
"color": "green",
"index": 0,
"value": null
},
{
"color": "orange",
"index": 1,
"value": 40
},
{
"color": "red",
"index": 2,
"value": 80
}
],
"values": false
},
"orientation": "vertical"
},
"pluginVersion": "6.2.0-pre",
"targets": [
{
"refId": "A",
"scenarioId": "random_walk"
},
{
"refId": "B",
"scenarioId": "random_walk"
},
{
"refId": "C",
"scenarioId": "random_walk"
},
{
"refId": "D",
"scenarioId": "random_walk"
},
{
"refId": "E",
"scenarioId": "csv_metric_values",
"stringInput": "10003,33333"
},
{
"refId": "F",
"scenarioId": "random_walk"
},
{
"refId": "G",
"scenarioId": "random_walk"
},
{
"refId": "H",
"scenarioId": "csv_metric_values",
"stringInput": "100,100,100"
},
{
"refId": "I",
"scenarioId": "random_walk"
},
{
"refId": "J",
"scenarioId": "random_walk"
},
{
"refId": "K",
"scenarioId": "random_walk"
},
{
"refId": "L",
"scenarioId": "random_walk"
},
{
"refId": "M",
"scenarioId": "random_walk"
},
{
"refId": "N",
"scenarioId": "random_walk"
},
{
"refId": "O",
"scenarioId": "random_walk"
},
{
"refId": "P",
"scenarioId": "random_walk"
},
{
"refId": "Q",
"scenarioId": "random_walk"
}
],
"timeFrom": null,
"timeShift": null,
"title": "Usage",
"type": "bargauge"
},
{
"gridPos": {
"h": 21,
"w": 2,
"x": 22,
"y": 0
},
"id": 11,
"links": [],
"options": {
"displayMode": "lcd",
"fieldOptions": {
"calcs": ["mean"],
"defaults": {
"decimals": null,
"max": 100,
"min": 0,
"unit": "percent"
},
"mappings": [],
"override": {},
"thresholds": [
{
"color": "green",
"index": 0,
"value": null
},
{
"color": "red",
"index": 1,
"value": 80
}
],
"values": false
},
"orientation": "vertical"
},
"pluginVersion": "6.2.0-pre",
"targets": [
{
"refId": "A",
"scenarioId": "random_walk"
}
],
"timeFrom": null,
"timeShift": null,
"title": "Progress",
"type": "bargauge"
},
{
"gridPos": {
"h": 13,
"w": 10,
"x": 0,
"y": 8
},
"id": 6,
"links": [],
"options": {
"displayMode": "lcd",
"fieldOptions": {
"calcs": ["mean"],
"defaults": {
"decimals": null,
"max": 100,
"min": 0,
"unit": "celsius"
},
"mappings": [],
"override": {},
"thresholds": [
{
"color": "green",
"index": 0,
"value": null
},
{
"color": "orange",
"index": 1,
"value": 40
},
{
"color": "red",
"index": 2,
"value": 80
}
],
"values": false
},
"orientation": "horizontal"
},
"pluginVersion": "6.2.0-pre",
"targets": [
{
"alias": "Inside",
"refId": "H",
"scenarioId": "csv_metric_values",
"stringInput": "100,100,100"
},
{
"alias": "Outhouse",
"refId": "A",
"scenarioId": "random_walk"
},
{
"alias": "Area B",
"refId": "B",
"scenarioId": "random_walk"
},
{
"alias": "Basement",
"refId": "C",
"scenarioId": "random_walk"
},
{
"alias": "Garage",
"refId": "D",
"scenarioId": "random_walk"
},
{
"alias": "Attic",
"refId": "E",
"scenarioId": "random_walk"
},
{
"refId": "F",
"scenarioId": "random_walk"
}
],
"timeFrom": null,
"timeShift": null,
"title": "Temperature",
"type": "bargauge"
},
{
"gridPos": {
"h": 13,
"w": 12,
"x": 10,
"y": 8
},
"id": 8,
"links": [],
"options": {
"displayMode": "lcd",
"fieldOptions": {
"calcs": ["mean"],
"defaults": {
"decimals": null,
"max": 100,
"min": 0,
"unit": "watt"
},
"mappings": [],
"override": {},
"thresholds": [
{
"color": "green",
"index": 0,
"value": null
},
{
"color": "orange",
"index": 1,
"value": 85
},
{
"color": "red",
"index": 2,
"value": 95
}
],
"values": false
},
"orientation": "horizontal"
},
"pluginVersion": "6.2.0-pre",
"targets": [
{
"refId": "H",
"scenarioId": "csv_metric_values",
"stringInput": "100,100,100"
},
{
"refId": "A",
"scenarioId": "random_walk"
},
{
"refId": "B",
"scenarioId": "random_walk"
},
{
"refId": "C",
"scenarioId": "random_walk"
},
{
"refId": "D",
"scenarioId": "random_walk"
},
{
"refId": "I",
"scenarioId": "random_walk"
},
{
"refId": "J",
"scenarioId": "random_walk"
},
{
"refId": "K",
"scenarioId": "random_walk"
},
{
"refId": "L",
"scenarioId": "random_walk"
},
{
"refId": "M",
"scenarioId": "random_walk"
},
{
"refId": "N",
"scenarioId": "random_walk"
},
{
"refId": "O",
"scenarioId": "random_walk"
},
{
"refId": "P",
"scenarioId": "random_walk"
},
{
"refId": "Q",
"scenarioId": "random_walk"
}
],
"timeFrom": null,
"timeShift": null,
"title": "Usage",
"type": "bargauge"
}
],
"schemaVersion": 18,
"style": "dark",
"tags": ["gdev", "bargauge", "panel-demo"],
"templating": {
"list": []
},
"time": {
"from": "now-6h",
"to": "now"
},
"timepicker": {
"refresh_intervals": ["5s", "10s", "30s", "1m", "5m", "15m", "30m", "1h", "2h", "1d"],
"time_options": ["5m", "15m", "1h", "6h", "12h", "24h", "2d", "7d", "30d"]
},
"timezone": "",
"title": "Bar Gauge LED Demo",
"uid": "0G3rbkqmkaa",
"version": 1
}

View File

@ -1,6 +1,14 @@
import React from 'react'; import React from 'react';
import { shallow } from 'enzyme'; import { shallow } from 'enzyme';
import { BarGauge, Props, getValueColor, getBasicAndGradientStyles, getBarGradient, getTitleStyles } from './BarGauge'; import {
BarGauge,
Props,
getValueColor,
getBasicAndGradientStyles,
getBarGradient,
getTitleStyles,
getValuePercent,
} from './BarGauge';
import { VizOrientation, DisplayValue } from '../../types'; import { VizOrientation, DisplayValue } from '../../types';
import { getTheme } from '../../themes'; import { getTheme } from '../../themes';
@ -63,6 +71,24 @@ describe('BarGauge', () => {
}); });
}); });
describe('Get value percent', () => {
it('0 to 100 and value 40', () => {
expect(getValuePercent(40, 0, 100)).toEqual(0.4);
});
it('50 to 100 and value 75', () => {
expect(getValuePercent(75, 50, 100)).toEqual(0.5);
});
it('-30 to 30 and value 0', () => {
expect(getValuePercent(0, -30, 30)).toEqual(0.5);
});
it('-30 to 30 and value 30', () => {
expect(getValuePercent(30, -30, 30)).toEqual(1);
});
});
describe('Vertical bar without title', () => { describe('Vertical bar without title', () => {
it('should not include title height in height', () => { it('should not include title height in height', () => {
const props = getProps({ const props = getProps({

View File

@ -161,7 +161,7 @@ export class BarGauge extends PureComponent<Props> {
const cells: JSX.Element[] = []; const cells: JSX.Element[] = [];
for (let i = 0; i < cellCount; i++) { for (let i = 0; i < cellCount; i++) {
const currentValue = (valueRange / cellCount) * i; const currentValue = minValue + (valueRange / cellCount) * i;
const cellColor = this.getCellColor(currentValue); const cellColor = this.getCellColor(currentValue);
const cellStyles: CSSProperties = { const cellStyles: CSSProperties = {
borderRadius: '2px', borderRadius: '2px',
@ -345,11 +345,6 @@ function calculateBarAndValueDimensions(props: Props): BarAndValueDimensions {
} }
} }
// console.log('titleDim', titleDim);
// console.log('valueWidth', valueWidth);
// console.log('width', width);
// console.log('total', titleDim.width + maxBarWidth + valueWidth);
return { return {
valueWidth, valueWidth,
valueHeight, valueHeight,
@ -360,6 +355,10 @@ function calculateBarAndValueDimensions(props: Props): BarAndValueDimensions {
}; };
} }
export function getValuePercent(value: number, minValue: number, maxValue: number): number {
return Math.min((value - minValue) / (maxValue - minValue), 1);
}
/** /**
* Only exported to for unit test * Only exported to for unit test
*/ */
@ -367,7 +366,7 @@ export function getBasicAndGradientStyles(props: Props): BasicAndGradientStyles
const { displayMode, maxValue, minValue, value } = props; const { displayMode, maxValue, minValue, value } = props;
const { valueWidth, valueHeight, maxBarHeight, maxBarWidth } = calculateBarAndValueDimensions(props); const { valueWidth, valueHeight, maxBarHeight, maxBarWidth } = calculateBarAndValueDimensions(props);
const valuePercent = Math.min(value.numeric / (maxValue - minValue), 1); const valuePercent = getValuePercent(value.numeric, minValue, maxValue);
const valueColor = getValueColor(props); const valueColor = getValueColor(props);
const valueStyles = getValueStyles(value.text, valueColor, valueWidth, valueHeight); const valueStyles = getValueStyles(value.text, valueColor, valueWidth, valueHeight);
const isBasic = displayMode === 'basic'; const isBasic = displayMode === 'basic';
@ -450,7 +449,7 @@ export function getBarGradient(props: Props, maxSize: number): string {
for (let i = 0; i < thresholds.length; i++) { for (let i = 0; i < thresholds.length; i++) {
const threshold = thresholds[i]; const threshold = thresholds[i];
const color = getColorFromHexRgbOrName(threshold.color); const color = getColorFromHexRgbOrName(threshold.color);
const valuePercent = Math.min(threshold.value / (maxValue - minValue), 1); const valuePercent = getValuePercent(threshold.value, minValue, maxValue);
const pos = valuePercent * maxSize; const pos = valuePercent * maxSize;
const offset = Math.round(pos - (pos - lastpos) / 2); const offset = Math.round(pos - (pos - lastpos) / 2);
@ -499,30 +498,3 @@ function getValueStyles(value: string, color: string, width: number, height: num
fontSize: fontSize.toFixed(2) + 'px', fontSize: fontSize.toFixed(2) + 'px',
}; };
} }
// let canvasElement: HTMLCanvasElement | null = null;
//
// interface TextDimensions {
// width: number;
// height: number;
// }
//
// /**
// * Uses canvas.measureText to compute and return the width of the given text of given font in pixels.
// *
// * @param {String} text The text to be rendered.
// * @param {String} font The css font descriptor that text is to be rendered with (e.g. "bold 14px verdana").
// *
// * @see https://stackoverflow.com/questions/118241/calculate-text-width-with-javascript/21015393#21015393
// */
// function getTextWidth(text: string): number {
// // re-use canvas object for better performance
// canvasElement = canvasElement || document.createElement('canvas');
// const context = canvasElement.getContext('2d');
// if (context) {
// context.font = 'normal 16px Roboto';
// const metrics = context.measureText(text);
// return metrics.width;
// }
// return 16;
// }