mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
BigValue: Updated test dashboard and made some chart sizing tweaks (#21616)
This commit is contained in:
Torkel Ödegaard
GitHub
parent
2732aca05c
commit
a0b04559e4
@ -20,44 +20,50 @@
|
|||||||
{
|
{
|
||||||
"datasource": null,
|
"datasource": null,
|
||||||
"gridPos": {
|
"gridPos": {
|
||||||
"h": 2,
|
"h": 3,
|
||||||
"w": 24,
|
"w": 24,
|
||||||
"x": 0,
|
"x": 0,
|
||||||
"y": 0
|
"y": 0
|
||||||
},
|
},
|
||||||
"id": 6,
|
"id": 6,
|
||||||
"interval": "10m",
|
"interval": "6m",
|
||||||
"options": {
|
"options": {
|
||||||
"colorMode": "background",
|
"colorMode": "background",
|
||||||
"fieldOptions": {
|
"fieldOptions": {
|
||||||
"calcs": ["mean"],
|
"calcs": ["mean"],
|
||||||
"defaults": {
|
"defaults": {
|
||||||
|
"color": {
|
||||||
|
"mode": "thresholds"
|
||||||
|
},
|
||||||
"mappings": [],
|
"mappings": [],
|
||||||
"thresholds": [
|
"thresholds": {
|
||||||
{
|
"mode": "absolute",
|
||||||
"color": "blue",
|
"steps": [
|
||||||
"value": null
|
{
|
||||||
},
|
"color": "blue",
|
||||||
{
|
"value": null
|
||||||
"color": "green",
|
},
|
||||||
"value": 10
|
{
|
||||||
},
|
"color": "green",
|
||||||
{
|
"value": 10
|
||||||
"color": "purple",
|
},
|
||||||
"value": 20
|
{
|
||||||
},
|
"color": "purple",
|
||||||
{
|
"value": 20
|
||||||
"color": "orange",
|
},
|
||||||
"value": 40
|
{
|
||||||
},
|
"color": "orange",
|
||||||
{
|
"value": 40
|
||||||
"color": "red",
|
},
|
||||||
"value": 80
|
{
|
||||||
}
|
"color": "red",
|
||||||
],
|
"value": 80
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
"unit": "areaM2"
|
"unit": "areaM2"
|
||||||
},
|
},
|
||||||
"override": {},
|
"overrides": [],
|
||||||
"values": false
|
"values": false
|
||||||
},
|
},
|
||||||
"graphMode": "area",
|
"graphMode": "area",
|
||||||
@ -67,38 +73,17 @@
|
|||||||
"show": true
|
"show": true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"pluginVersion": "6.5.0-pre",
|
"pluginVersion": "6.6.0-pre",
|
||||||
"targets": [
|
"targets": [
|
||||||
{
|
{
|
||||||
"alias": "A longer title",
|
"alias": "__house_locations",
|
||||||
"refId": "A",
|
|
||||||
"scenarioId": "random_walk"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"alias": "AB",
|
|
||||||
"refId": "C",
|
|
||||||
"scenarioId": "random_walk"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"alias": "CPU",
|
|
||||||
"refId": "D",
|
|
||||||
"scenarioId": "random_walk"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"alias": "Google",
|
|
||||||
"labels": "",
|
"labels": "",
|
||||||
"refId": "E",
|
"min": 0,
|
||||||
"scenarioId": "random_walk"
|
"noise": 5,
|
||||||
},
|
"refId": "A",
|
||||||
{
|
"scenarioId": "random_walk",
|
||||||
"alias": "Even longer road title",
|
"seriesCount": 6,
|
||||||
"refId": "F",
|
"spread": 100
|
||||||
"scenarioId": "random_walk"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"alias": "Why does it have to",
|
|
||||||
"refId": "G",
|
|
||||||
"scenarioId": "random_walk"
|
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
"timeFrom": null,
|
"timeFrom": null,
|
||||||
@ -109,44 +94,50 @@
|
|||||||
{
|
{
|
||||||
"datasource": null,
|
"datasource": null,
|
||||||
"gridPos": {
|
"gridPos": {
|
||||||
"h": 5,
|
"h": 6,
|
||||||
"w": 24,
|
"w": 24,
|
||||||
"x": 0,
|
"x": 0,
|
||||||
"y": 2
|
"y": 3
|
||||||
},
|
},
|
||||||
"id": 10,
|
"id": 10,
|
||||||
"interval": "10m",
|
"interval": "7m",
|
||||||
"options": {
|
"options": {
|
||||||
"colorMode": "background",
|
"colorMode": "background",
|
||||||
"fieldOptions": {
|
"fieldOptions": {
|
||||||
"calcs": ["mean"],
|
"calcs": ["mean"],
|
||||||
"defaults": {
|
"defaults": {
|
||||||
|
"color": {
|
||||||
|
"mode": "thresholds"
|
||||||
|
},
|
||||||
"mappings": [],
|
"mappings": [],
|
||||||
"thresholds": [
|
"thresholds": {
|
||||||
{
|
"mode": "absolute",
|
||||||
"color": "blue",
|
"steps": [
|
||||||
"value": null
|
{
|
||||||
},
|
"color": "blue",
|
||||||
{
|
"value": null
|
||||||
"color": "green",
|
},
|
||||||
"value": 10
|
{
|
||||||
},
|
"color": "green",
|
||||||
{
|
"value": 10
|
||||||
"color": "purple",
|
},
|
||||||
"value": 20
|
{
|
||||||
},
|
"color": "purple",
|
||||||
{
|
"value": 20
|
||||||
"color": "orange",
|
},
|
||||||
"value": 40
|
{
|
||||||
},
|
"color": "orange",
|
||||||
{
|
"value": 40
|
||||||
"color": "red",
|
},
|
||||||
"value": 80
|
{
|
||||||
}
|
"color": "red",
|
||||||
],
|
"value": 80
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
"unit": "areaM2"
|
"unit": "areaM2"
|
||||||
},
|
},
|
||||||
"override": {},
|
"overrides": [],
|
||||||
"values": false
|
"values": false
|
||||||
},
|
},
|
||||||
"graphMode": "area",
|
"graphMode": "area",
|
||||||
@ -156,38 +147,16 @@
|
|||||||
"show": true
|
"show": true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"pluginVersion": "6.5.0-pre",
|
"pluginVersion": "6.6.0-pre",
|
||||||
"targets": [
|
"targets": [
|
||||||
{
|
{
|
||||||
"alias": "AB",
|
"alias": "__house_locations",
|
||||||
|
"min": 0,
|
||||||
|
"noise": 10,
|
||||||
"refId": "A",
|
"refId": "A",
|
||||||
"scenarioId": "random_walk"
|
"scenarioId": "random_walk",
|
||||||
},
|
"seriesCount": 6,
|
||||||
{
|
"spread": 10
|
||||||
"alias": "CPU",
|
|
||||||
"labels": "",
|
|
||||||
"refId": "C",
|
|
||||||
"scenarioId": "random_walk"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"alias": "Longer title",
|
|
||||||
"refId": "D",
|
|
||||||
"scenarioId": "random_walk"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"alias": "Even longer title",
|
|
||||||
"refId": "E",
|
|
||||||
"scenarioId": "random_walk"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"alias": "Outside",
|
|
||||||
"refId": "F",
|
|
||||||
"scenarioId": "random_walk"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"alias": "Inside",
|
|
||||||
"refId": "G",
|
|
||||||
"scenarioId": "random_walk"
|
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
"timeFrom": null,
|
"timeFrom": null,
|
||||||
@ -198,44 +167,50 @@
|
|||||||
{
|
{
|
||||||
"datasource": null,
|
"datasource": null,
|
||||||
"gridPos": {
|
"gridPos": {
|
||||||
"h": 5,
|
"h": 6,
|
||||||
"w": 24,
|
"w": 24,
|
||||||
"x": 0,
|
"x": 0,
|
||||||
"y": 7
|
"y": 9
|
||||||
},
|
},
|
||||||
"id": 11,
|
"id": 14,
|
||||||
"interval": "10m",
|
"interval": "7m",
|
||||||
"options": {
|
"options": {
|
||||||
"colorMode": "value",
|
"colorMode": "value",
|
||||||
"fieldOptions": {
|
"fieldOptions": {
|
||||||
"calcs": ["mean"],
|
"calcs": ["mean"],
|
||||||
"defaults": {
|
"defaults": {
|
||||||
|
"color": {
|
||||||
|
"mode": "thresholds"
|
||||||
|
},
|
||||||
"mappings": [],
|
"mappings": [],
|
||||||
"thresholds": [
|
"thresholds": {
|
||||||
{
|
"mode": "absolute",
|
||||||
"color": "blue",
|
"steps": [
|
||||||
"value": null
|
{
|
||||||
},
|
"color": "blue",
|
||||||
{
|
"value": null
|
||||||
"color": "green",
|
},
|
||||||
"value": 10
|
{
|
||||||
},
|
"color": "green",
|
||||||
{
|
"value": 10
|
||||||
"color": "purple",
|
},
|
||||||
"value": 20
|
{
|
||||||
},
|
"color": "purple",
|
||||||
{
|
"value": 20
|
||||||
"color": "orange",
|
},
|
||||||
"value": 40
|
{
|
||||||
},
|
"color": "orange",
|
||||||
{
|
"value": 40
|
||||||
"color": "red",
|
},
|
||||||
"value": 80
|
{
|
||||||
}
|
"color": "red",
|
||||||
],
|
"value": 80
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
"unit": "areaM2"
|
"unit": "areaM2"
|
||||||
},
|
},
|
||||||
"override": {},
|
"overrides": [],
|
||||||
"values": false
|
"values": false
|
||||||
},
|
},
|
||||||
"graphMode": "area",
|
"graphMode": "area",
|
||||||
@ -245,37 +220,21 @@
|
|||||||
"show": true
|
"show": true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"pluginVersion": "6.5.0-pre",
|
"pluginVersion": "6.6.0-pre",
|
||||||
"targets": [
|
"targets": [
|
||||||
{
|
{
|
||||||
|
"alias": "__house_locations",
|
||||||
|
"min": 0,
|
||||||
|
"noise": 10,
|
||||||
"refId": "A",
|
"refId": "A",
|
||||||
"scenarioId": "random_walk"
|
"scenarioId": "random_walk",
|
||||||
},
|
"seriesCount": 6,
|
||||||
{
|
"spread": 10
|
||||||
"refId": "C",
|
|
||||||
"scenarioId": "random_walk"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"refId": "D",
|
|
||||||
"scenarioId": "random_walk"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"refId": "E",
|
|
||||||
"scenarioId": "random_walk"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"refId": "F",
|
|
||||||
"scenarioId": "random_walk"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"refId": "G",
|
|
||||||
"scenarioId": "random_walk"
|
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
"timeFrom": null,
|
"timeFrom": null,
|
||||||
"timeShift": null,
|
"timeShift": null,
|
||||||
"title": "Panel Title",
|
"title": "Panel Title",
|
||||||
"transparent": true,
|
|
||||||
"type": "stat"
|
"type": "stat"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@ -284,79 +243,65 @@
|
|||||||
"h": 14,
|
"h": 14,
|
||||||
"w": 6,
|
"w": 6,
|
||||||
"x": 0,
|
"x": 0,
|
||||||
"y": 12
|
"y": 15
|
||||||
},
|
},
|
||||||
"id": 13,
|
"id": 13,
|
||||||
"interval": "10m",
|
"interval": "5m",
|
||||||
"options": {
|
"options": {
|
||||||
"colorMode": "background",
|
"colorMode": "background",
|
||||||
"fieldOptions": {
|
"fieldOptions": {
|
||||||
"calcs": ["mean"],
|
"calcs": ["mean"],
|
||||||
"defaults": {
|
"defaults": {
|
||||||
|
"color": {
|
||||||
|
"mode": "thresholds"
|
||||||
|
},
|
||||||
"mappings": [],
|
"mappings": [],
|
||||||
"thresholds": [
|
"thresholds": {
|
||||||
{
|
"mode": "absolute",
|
||||||
"color": "blue",
|
"steps": [
|
||||||
"value": null
|
{
|
||||||
},
|
"color": "blue",
|
||||||
{
|
"value": null
|
||||||
"color": "green",
|
},
|
||||||
"value": 10
|
{
|
||||||
},
|
"color": "green",
|
||||||
{
|
"value": 10
|
||||||
"color": "purple",
|
},
|
||||||
"value": 20
|
{
|
||||||
},
|
"color": "purple",
|
||||||
{
|
"value": 20
|
||||||
"color": "orange",
|
},
|
||||||
"value": 40
|
{
|
||||||
},
|
"color": "orange",
|
||||||
{
|
"value": 40
|
||||||
"color": "red",
|
},
|
||||||
"value": 80
|
{
|
||||||
}
|
"color": "red",
|
||||||
],
|
"value": 80
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
"unit": "areaM2"
|
"unit": "areaM2"
|
||||||
},
|
},
|
||||||
"override": {},
|
"overrides": [],
|
||||||
"values": false
|
"values": false
|
||||||
},
|
},
|
||||||
"graphMode": "area",
|
"graphMode": "area",
|
||||||
"justifyMode": "auto",
|
"justifyMode": "auto",
|
||||||
"orientation": "auto",
|
"orientation": "horizontal",
|
||||||
"sparkline": {
|
"sparkline": {
|
||||||
"show": true
|
"show": true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"pluginVersion": "6.5.0-pre",
|
"pluginVersion": "6.6.0-pre",
|
||||||
"targets": [
|
"targets": [
|
||||||
{
|
{
|
||||||
|
"alias": "__server_names",
|
||||||
|
"min": 0,
|
||||||
"refId": "A",
|
"refId": "A",
|
||||||
"scenarioId": "random_walk"
|
"scenarioId": "random_walk",
|
||||||
},
|
"seriesCount": 7,
|
||||||
{
|
"spread": 100
|
||||||
"refId": "B",
|
|
||||||
"scenarioId": "random_walk"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"refId": "C",
|
|
||||||
"scenarioId": "random_walk"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"refId": "D",
|
|
||||||
"scenarioId": "random_walk"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"refId": "E",
|
|
||||||
"scenarioId": "random_walk"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"refId": "F",
|
|
||||||
"scenarioId": "random_walk"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"refId": "G",
|
|
||||||
"scenarioId": "random_walk"
|
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
"timeFrom": null,
|
"timeFrom": null,
|
||||||
@ -370,7 +315,7 @@
|
|||||||
"h": 11,
|
"h": 11,
|
||||||
"w": 4,
|
"w": 4,
|
||||||
"x": 6,
|
"x": 6,
|
||||||
"y": 12
|
"y": 15
|
||||||
},
|
},
|
||||||
"id": 8,
|
"id": 8,
|
||||||
"interval": "10m",
|
"interval": "10m",
|
||||||
@ -379,32 +324,38 @@
|
|||||||
"fieldOptions": {
|
"fieldOptions": {
|
||||||
"calcs": ["mean"],
|
"calcs": ["mean"],
|
||||||
"defaults": {
|
"defaults": {
|
||||||
|
"color": {
|
||||||
|
"mode": "thresholds"
|
||||||
|
},
|
||||||
"mappings": [],
|
"mappings": [],
|
||||||
"thresholds": [
|
"thresholds": {
|
||||||
{
|
"mode": "absolute",
|
||||||
"color": "blue",
|
"steps": [
|
||||||
"value": null
|
{
|
||||||
},
|
"color": "blue",
|
||||||
{
|
"value": null
|
||||||
"color": "green",
|
},
|
||||||
"value": 10
|
{
|
||||||
},
|
"color": "green",
|
||||||
{
|
"value": 10
|
||||||
"color": "purple",
|
},
|
||||||
"value": 20
|
{
|
||||||
},
|
"color": "purple",
|
||||||
{
|
"value": 20
|
||||||
"color": "orange",
|
},
|
||||||
"value": 40
|
{
|
||||||
},
|
"color": "orange",
|
||||||
{
|
"value": 40
|
||||||
"color": "red",
|
},
|
||||||
"value": 80
|
{
|
||||||
}
|
"color": "red",
|
||||||
],
|
"value": 80
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
"unit": "areaM2"
|
"unit": "areaM2"
|
||||||
},
|
},
|
||||||
"override": {},
|
"overrides": [],
|
||||||
"values": false
|
"values": false
|
||||||
},
|
},
|
||||||
"graphMode": "line",
|
"graphMode": "line",
|
||||||
@ -414,7 +365,7 @@
|
|||||||
"show": true
|
"show": true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"pluginVersion": "6.5.0-pre",
|
"pluginVersion": "6.6.0-pre",
|
||||||
"targets": [
|
"targets": [
|
||||||
{
|
{
|
||||||
"refId": "A",
|
"refId": "A",
|
||||||
@ -456,7 +407,7 @@
|
|||||||
"h": 9,
|
"h": 9,
|
||||||
"w": 8,
|
"w": 8,
|
||||||
"x": 10,
|
"x": 10,
|
||||||
"y": 12
|
"y": 15
|
||||||
},
|
},
|
||||||
"id": 12,
|
"id": 12,
|
||||||
"interval": "10m",
|
"interval": "10m",
|
||||||
@ -465,32 +416,38 @@
|
|||||||
"fieldOptions": {
|
"fieldOptions": {
|
||||||
"calcs": ["mean"],
|
"calcs": ["mean"],
|
||||||
"defaults": {
|
"defaults": {
|
||||||
|
"color": {
|
||||||
|
"mode": "thresholds"
|
||||||
|
},
|
||||||
"mappings": [],
|
"mappings": [],
|
||||||
"thresholds": [
|
"thresholds": {
|
||||||
{
|
"mode": "absolute",
|
||||||
"color": "blue",
|
"steps": [
|
||||||
"value": null
|
{
|
||||||
},
|
"color": "blue",
|
||||||
{
|
"value": null
|
||||||
"color": "green",
|
},
|
||||||
"value": 10
|
{
|
||||||
},
|
"color": "green",
|
||||||
{
|
"value": 10
|
||||||
"color": "purple",
|
},
|
||||||
"value": 20
|
{
|
||||||
},
|
"color": "purple",
|
||||||
{
|
"value": 20
|
||||||
"color": "orange",
|
},
|
||||||
"value": 40
|
{
|
||||||
},
|
"color": "orange",
|
||||||
{
|
"value": 40
|
||||||
"color": "red",
|
},
|
||||||
"value": 80
|
{
|
||||||
}
|
"color": "red",
|
||||||
],
|
"value": 80
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
"unit": "areaM2"
|
"unit": "areaM2"
|
||||||
},
|
},
|
||||||
"override": {},
|
"overrides": [],
|
||||||
"values": false
|
"values": false
|
||||||
},
|
},
|
||||||
"graphMode": "line",
|
"graphMode": "line",
|
||||||
@ -500,7 +457,7 @@
|
|||||||
"show": true
|
"show": true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"pluginVersion": "6.5.0-pre",
|
"pluginVersion": "6.6.0-pre",
|
||||||
"targets": [
|
"targets": [
|
||||||
{
|
{
|
||||||
"refId": "A",
|
"refId": "A",
|
||||||
@ -537,7 +494,7 @@
|
|||||||
"type": "stat"
|
"type": "stat"
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
"schemaVersion": 21,
|
"schemaVersion": 22,
|
||||||
"style": "dark",
|
"style": "dark",
|
||||||
"tags": ["gdev", "panel-tests"],
|
"tags": ["gdev", "panel-tests"],
|
||||||
"templating": {
|
"templating": {
|
||||||
@ -551,7 +508,5 @@
|
|||||||
"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": "",
|
"timezone": "",
|
||||||
"title": "Panel Tests - Stat",
|
"title": "Panel Tests - Stat"
|
||||||
"uid": "jWWHNJpWz",
|
|
||||||
"version": 25
|
|
||||||
}
|
}
|
||||||
|
|||||||
@ -363,6 +363,8 @@ export class StackedWithChartLayout extends BigValueLayout {
|
|||||||
|
|
||||||
// make title fontsize it's a bit smaller than valueFontSize
|
// make title fontsize it's a bit smaller than valueFontSize
|
||||||
this.titleFontSize = Math.min(this.valueFontSize * 0.7, this.titleFontSize);
|
this.titleFontSize = Math.min(this.valueFontSize * 0.7, this.titleFontSize);
|
||||||
|
// make chart take up onused space
|
||||||
|
this.chartHeight = height - this.titleFontSize * LINE_HEIGHT - this.valueFontSize * LINE_HEIGHT + height * 0.05;
|
||||||
}
|
}
|
||||||
|
|
||||||
getValueAndTitleContainerStyles() {
|
getValueAndTitleContainerStyles() {
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user