mirror of https://github.com/grafana/grafana
TimeSeries: Support coloring series and line by thresholds or gradient color scales (#35910)
* TimeSeries: Adds support for color scheme series and line colors * Updates * fixed device issue * Evaluate series color in legend * two fixes * It works with points * Added test dashboard * Minor fix * Reset color mode to palette when switching to panel that supports by series mode * Add support for relative thresholds * Updated snapshotspull/36440/head
Torkel Ödegaard
4 years ago
committed by
GitHub
parent
333d520528
commit
a241f03167
@ -0,0 +1,593 @@ |
||||
{ |
||||
"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": [ |
||||
{ |
||||
"datasource": "-- Dashboard --", |
||||
"fieldConfig": { |
||||
"defaults": { |
||||
"color": { |
||||
"mode": "thresholds" |
||||
}, |
||||
"custom": { |
||||
"axisLabel": "", |
||||
"axisPlacement": "auto", |
||||
"barAlignment": 0, |
||||
"drawStyle": "line", |
||||
"fillOpacity": 5, |
||||
"gradientMode": "scheme", |
||||
"hideFrom": { |
||||
"legend": false, |
||||
"tooltip": false, |
||||
"viz": false |
||||
}, |
||||
"lineInterpolation": "smooth", |
||||
"lineWidth": 3, |
||||
"pointSize": 5, |
||||
"scaleDistribution": { |
||||
"type": "linear" |
||||
}, |
||||
"showPoints": "never", |
||||
"spanNulls": false, |
||||
"stacking": { |
||||
"group": "A", |
||||
"mode": "none" |
||||
}, |
||||
"thresholdsStyle": { |
||||
"mode": "off" |
||||
} |
||||
}, |
||||
"mappings": [], |
||||
"max": 50, |
||||
"min": 0, |
||||
"thresholds": { |
||||
"mode": "absolute", |
||||
"steps": [ |
||||
{ |
||||
"color": "green", |
||||
"value": null |
||||
}, |
||||
{ |
||||
"color": "orange", |
||||
"value": 20 |
||||
}, |
||||
{ |
||||
"color": "red", |
||||
"value": 30 |
||||
} |
||||
] |
||||
}, |
||||
"unit": "degree" |
||||
}, |
||||
"overrides": [] |
||||
}, |
||||
"gridPos": { |
||||
"h": 7, |
||||
"w": 11, |
||||
"x": 0, |
||||
"y": 0 |
||||
}, |
||||
"id": 9, |
||||
"maxDataPoints": 45, |
||||
"options": { |
||||
"legend": { |
||||
"calcs": [], |
||||
"displayMode": "list", |
||||
"placement": "bottom" |
||||
}, |
||||
"tooltip": { |
||||
"mode": "single" |
||||
} |
||||
}, |
||||
"targets": [ |
||||
{ |
||||
"panelId": 4, |
||||
"refId": "A" |
||||
} |
||||
], |
||||
"title": "Color line by discrete tresholds", |
||||
"type": "timeseries" |
||||
}, |
||||
{ |
||||
"datasource": null, |
||||
"fieldConfig": { |
||||
"defaults": { |
||||
"color": { |
||||
"mode": "thresholds" |
||||
}, |
||||
"custom": { |
||||
"axisLabel": "", |
||||
"axisPlacement": "auto", |
||||
"barAlignment": 0, |
||||
"drawStyle": "bars", |
||||
"fillOpacity": 84, |
||||
"gradientMode": "scheme", |
||||
"hideFrom": { |
||||
"legend": false, |
||||
"tooltip": false, |
||||
"viz": false |
||||
}, |
||||
"lineInterpolation": "smooth", |
||||
"lineWidth": 0, |
||||
"pointSize": 5, |
||||
"scaleDistribution": { |
||||
"type": "linear" |
||||
}, |
||||
"showPoints": "never", |
||||
"spanNulls": false, |
||||
"stacking": { |
||||
"group": "A", |
||||
"mode": "none" |
||||
}, |
||||
"thresholdsStyle": { |
||||
"mode": "off" |
||||
} |
||||
}, |
||||
"mappings": [], |
||||
"max": 50, |
||||
"min": 0, |
||||
"thresholds": { |
||||
"mode": "absolute", |
||||
"steps": [ |
||||
{ |
||||
"color": "green", |
||||
"value": null |
||||
}, |
||||
{ |
||||
"color": "orange", |
||||
"value": 20 |
||||
}, |
||||
{ |
||||
"color": "red", |
||||
"value": 30 |
||||
} |
||||
] |
||||
}, |
||||
"unit": "degree" |
||||
}, |
||||
"overrides": [] |
||||
}, |
||||
"gridPos": { |
||||
"h": 7, |
||||
"w": 13, |
||||
"x": 11, |
||||
"y": 0 |
||||
}, |
||||
"id": 4, |
||||
"interval": "80s", |
||||
"maxDataPoints": 42, |
||||
"options": { |
||||
"legend": { |
||||
"calcs": [], |
||||
"displayMode": "list", |
||||
"placement": "bottom" |
||||
}, |
||||
"tooltip": { |
||||
"mode": "single" |
||||
} |
||||
}, |
||||
"targets": [ |
||||
{ |
||||
"max": 40, |
||||
"min": 0, |
||||
"noise": 1, |
||||
"refId": "A", |
||||
"scenarioId": "random_walk", |
||||
"spread": 20, |
||||
"startValue": 1 |
||||
} |
||||
], |
||||
"timeFrom": null, |
||||
"title": "Color bars by discrete thresholds", |
||||
"type": "timeseries" |
||||
}, |
||||
{ |
||||
"datasource": "-- Dashboard --", |
||||
"fieldConfig": { |
||||
"defaults": { |
||||
"color": { |
||||
"mode": "continuous-GrYlRd" |
||||
}, |
||||
"custom": { |
||||
"axisLabel": "", |
||||
"axisPlacement": "auto", |
||||
"barAlignment": 0, |
||||
"drawStyle": "line", |
||||
"fillOpacity": 10, |
||||
"gradientMode": "scheme", |
||||
"hideFrom": { |
||||
"legend": false, |
||||
"tooltip": false, |
||||
"viz": false |
||||
}, |
||||
"lineInterpolation": "smooth", |
||||
"lineWidth": 3, |
||||
"pointSize": 5, |
||||
"scaleDistribution": { |
||||
"type": "linear" |
||||
}, |
||||
"showPoints": "never", |
||||
"spanNulls": false, |
||||
"stacking": { |
||||
"group": "A", |
||||
"mode": "none" |
||||
}, |
||||
"thresholdsStyle": { |
||||
"mode": "off" |
||||
} |
||||
}, |
||||
"mappings": [], |
||||
"max": 50, |
||||
"min": 1, |
||||
"thresholds": { |
||||
"mode": "absolute", |
||||
"steps": [ |
||||
{ |
||||
"color": "blue", |
||||
"value": null |
||||
}, |
||||
{ |
||||
"color": "green", |
||||
"value": 0 |
||||
}, |
||||
{ |
||||
"color": "orange", |
||||
"value": 20 |
||||
}, |
||||
{ |
||||
"color": "red", |
||||
"value": 30 |
||||
} |
||||
] |
||||
}, |
||||
"unit": "degree" |
||||
}, |
||||
"overrides": [] |
||||
}, |
||||
"gridPos": { |
||||
"h": 8, |
||||
"w": 11, |
||||
"x": 0, |
||||
"y": 7 |
||||
}, |
||||
"id": 6, |
||||
"maxDataPoints": 50, |
||||
"options": { |
||||
"legend": { |
||||
"calcs": [], |
||||
"displayMode": "list", |
||||
"placement": "bottom" |
||||
}, |
||||
"tooltip": { |
||||
"mode": "single" |
||||
} |
||||
}, |
||||
"targets": [ |
||||
{ |
||||
"panelId": 4, |
||||
"refId": "A" |
||||
} |
||||
], |
||||
"title": "Color line by color scale", |
||||
"type": "timeseries" |
||||
}, |
||||
{ |
||||
"datasource": "-- Dashboard --", |
||||
"fieldConfig": { |
||||
"defaults": { |
||||
"color": { |
||||
"mode": "continuous-GrYlRd" |
||||
}, |
||||
"custom": { |
||||
"axisLabel": "", |
||||
"axisPlacement": "auto", |
||||
"barAlignment": 0, |
||||
"drawStyle": "bars", |
||||
"fillOpacity": 64, |
||||
"gradientMode": "scheme", |
||||
"hideFrom": { |
||||
"legend": false, |
||||
"tooltip": false, |
||||
"viz": false |
||||
}, |
||||
"lineInterpolation": "smooth", |
||||
"lineWidth": 1, |
||||
"pointSize": 5, |
||||
"scaleDistribution": { |
||||
"type": "linear" |
||||
}, |
||||
"showPoints": "never", |
||||
"spanNulls": false, |
||||
"stacking": { |
||||
"group": "A", |
||||
"mode": "none" |
||||
}, |
||||
"thresholdsStyle": { |
||||
"mode": "off" |
||||
} |
||||
}, |
||||
"mappings": [], |
||||
"max": 50, |
||||
"min": 1, |
||||
"thresholds": { |
||||
"mode": "absolute", |
||||
"steps": [ |
||||
{ |
||||
"color": "blue", |
||||
"value": null |
||||
}, |
||||
{ |
||||
"color": "green", |
||||
"value": 0 |
||||
}, |
||||
{ |
||||
"color": "orange", |
||||
"value": 20 |
||||
}, |
||||
{ |
||||
"color": "red", |
||||
"value": 30 |
||||
} |
||||
] |
||||
}, |
||||
"unit": "degree" |
||||
}, |
||||
"overrides": [] |
||||
}, |
||||
"gridPos": { |
||||
"h": 8, |
||||
"w": 13, |
||||
"x": 11, |
||||
"y": 7 |
||||
}, |
||||
"id": 10, |
||||
"maxDataPoints": 45, |
||||
"options": { |
||||
"legend": { |
||||
"calcs": [], |
||||
"displayMode": "list", |
||||
"placement": "bottom" |
||||
}, |
||||
"tooltip": { |
||||
"mode": "single" |
||||
} |
||||
}, |
||||
"targets": [ |
||||
{ |
||||
"panelId": 4, |
||||
"refId": "A" |
||||
} |
||||
], |
||||
"title": "Color bars by color scale", |
||||
"type": "timeseries" |
||||
}, |
||||
{ |
||||
"datasource": "-- Dashboard --", |
||||
"fieldConfig": { |
||||
"defaults": { |
||||
"color": { |
||||
"mode": "continuous-GrYlRd" |
||||
}, |
||||
"custom": { |
||||
"axisLabel": "", |
||||
"axisPlacement": "auto", |
||||
"barAlignment": 0, |
||||
"drawStyle": "line", |
||||
"fillOpacity": 64, |
||||
"gradientMode": "scheme", |
||||
"hideFrom": { |
||||
"legend": false, |
||||
"tooltip": false, |
||||
"viz": false |
||||
}, |
||||
"lineInterpolation": "smooth", |
||||
"lineWidth": 1, |
||||
"pointSize": 5, |
||||
"scaleDistribution": { |
||||
"type": "linear" |
||||
}, |
||||
"showPoints": "never", |
||||
"spanNulls": false, |
||||
"stacking": { |
||||
"group": "A", |
||||
"mode": "none" |
||||
}, |
||||
"thresholdsStyle": { |
||||
"mode": "off" |
||||
} |
||||
}, |
||||
"mappings": [], |
||||
"max": 50, |
||||
"min": 1, |
||||
"thresholds": { |
||||
"mode": "absolute", |
||||
"steps": [ |
||||
{ |
||||
"color": "blue", |
||||
"value": null |
||||
}, |
||||
{ |
||||
"color": "green", |
||||
"value": 0 |
||||
}, |
||||
{ |
||||
"color": "orange", |
||||
"value": 20 |
||||
}, |
||||
{ |
||||
"color": "red", |
||||
"value": 30 |
||||
} |
||||
] |
||||
}, |
||||
"unit": "degree" |
||||
}, |
||||
"overrides": [] |
||||
}, |
||||
"gridPos": { |
||||
"h": 6, |
||||
"w": 24, |
||||
"x": 0, |
||||
"y": 15 |
||||
}, |
||||
"id": 7, |
||||
"maxDataPoints": 50, |
||||
"options": { |
||||
"legend": { |
||||
"calcs": [], |
||||
"displayMode": "list", |
||||
"placement": "bottom" |
||||
}, |
||||
"tooltip": { |
||||
"mode": "single" |
||||
} |
||||
}, |
||||
"targets": [ |
||||
{ |
||||
"panelId": 4, |
||||
"refId": "A" |
||||
} |
||||
], |
||||
"title": "Color line by color scale", |
||||
"type": "timeseries" |
||||
}, |
||||
{ |
||||
"datasource": null, |
||||
"fieldConfig": { |
||||
"defaults": { |
||||
"color": { |
||||
"mode": "continuous-GrYlRd" |
||||
}, |
||||
"custom": { |
||||
"axisLabel": "", |
||||
"axisPlacement": "auto", |
||||
"barAlignment": 0, |
||||
"drawStyle": "points", |
||||
"fillOpacity": 10, |
||||
"gradientMode": "scheme", |
||||
"hideFrom": { |
||||
"legend": false, |
||||
"tooltip": false, |
||||
"viz": false |
||||
}, |
||||
"lineInterpolation": "smooth", |
||||
"lineWidth": 3, |
||||
"pointSize": 5, |
||||
"scaleDistribution": { |
||||
"type": "linear" |
||||
}, |
||||
"showPoints": "never", |
||||
"spanNulls": false, |
||||
"stacking": { |
||||
"group": "A", |
||||
"mode": "none" |
||||
}, |
||||
"thresholdsStyle": { |
||||
"mode": "off" |
||||
} |
||||
}, |
||||
"mappings": [], |
||||
"max": 50, |
||||
"min": 1, |
||||
"thresholds": { |
||||
"mode": "absolute", |
||||
"steps": [ |
||||
{ |
||||
"color": "blue", |
||||
"value": null |
||||
}, |
||||
{ |
||||
"color": "green", |
||||
"value": 0 |
||||
}, |
||||
{ |
||||
"color": "orange", |
||||
"value": 20 |
||||
}, |
||||
{ |
||||
"color": "red", |
||||
"value": 30 |
||||
} |
||||
] |
||||
}, |
||||
"unit": "degree" |
||||
}, |
||||
"overrides": [] |
||||
}, |
||||
"gridPos": { |
||||
"h": 13, |
||||
"w": 24, |
||||
"x": 0, |
||||
"y": 21 |
||||
}, |
||||
"id": 8, |
||||
"maxDataPoints": 250, |
||||
"options": { |
||||
"legend": { |
||||
"calcs": [], |
||||
"displayMode": "list", |
||||
"placement": "bottom" |
||||
}, |
||||
"tooltip": { |
||||
"mode": "single" |
||||
} |
||||
}, |
||||
"targets": [ |
||||
{ |
||||
"max": 45, |
||||
"min": 20, |
||||
"noise": 0, |
||||
"refId": "A", |
||||
"scenarioId": "random_walk", |
||||
"spread": 12, |
||||
"startValue": 40 |
||||
}, |
||||
{ |
||||
"hide": false, |
||||
"max": 20, |
||||
"min": 1, |
||||
"noise": 0, |
||||
"refId": "B", |
||||
"scenarioId": "random_walk", |
||||
"spread": 10 |
||||
} |
||||
], |
||||
"title": "Color line by color scale", |
||||
"type": "timeseries" |
||||
} |
||||
], |
||||
"refresh": false, |
||||
"schemaVersion": 30, |
||||
"style": "dark", |
||||
"tags": [ |
||||
"gdev", |
||||
"panel-tests" |
||||
], |
||||
"templating": { |
||||
"list": [] |
||||
}, |
||||
"time": { |
||||
"from": "now-6h", |
||||
"to": "now" |
||||
}, |
||||
"timepicker": {}, |
||||
"timezone": "", |
||||
"title": "Panel Tests - Graph NG - By value color schemes", |
||||
"uid": "aBXrJ0R7z", |
||||
"version": 20 |
||||
} |
||||
Loading…
Reference in new issue