mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Added templating, timepicker, panel docs
This commit is contained in:
Utkarsh Bhatnagar
parent
f54615ed46
commit
e8c9b0806a
@ -77,7 +77,7 @@ Each field in the dashboard JSON is explained below with its usage:
|
||||
|
||||
### rows
|
||||
|
||||
`rows` field represents an array of JSON object representing each row in a dashboard, such as shown below:
|
||||
`rows` field consists of an array of JSON object representing each row in a dashboard, such as shown below:
|
||||
|
||||
```
|
||||
"rows": [
|
||||
@ -110,15 +110,312 @@ Usage of the fields is explained below:
|
||||
|
||||
#### panels
|
||||
|
||||
TODO
|
||||
Panels are the building blocks a dashboard. It consists of datasource queries, type of graphs, aliases, etc. Panel JSON consists of an array of JSON objects, each representing a different panel in a row. Most of the fields are common for all panels but some fields depends on the panel type. Following is an example of panel JSON representing a `graph` panel type:
|
||||
|
||||
```
|
||||
"panels": [
|
||||
{
|
||||
"aliasColors": {},
|
||||
"bars": false,
|
||||
"datasource": null,
|
||||
"editable": true,
|
||||
"error": false,
|
||||
"fill": 0,
|
||||
"grid": {
|
||||
"leftLogBase": 1,
|
||||
"leftMax": null,
|
||||
"leftMin": null,
|
||||
"rightLogBase": 1,
|
||||
"rightMax": null,
|
||||
"rightMin": null,
|
||||
"threshold1": null,
|
||||
"threshold1Color": "rgba(216, 200, 27, 0.27)",
|
||||
"threshold2": null,
|
||||
"threshold2Color": "rgba(234, 112, 112, 0.22)"
|
||||
},
|
||||
"id": 1,
|
||||
"legend": {
|
||||
"avg": false,
|
||||
"current": false,
|
||||
"max": false,
|
||||
"min": false,
|
||||
"show": true,
|
||||
"total": false,
|
||||
"values": false
|
||||
},
|
||||
"lines": true,
|
||||
"linewidth": 1,
|
||||
"links": [],
|
||||
"nullPointMode": "connected",
|
||||
"percentage": false,
|
||||
"pointradius": 5,
|
||||
"points": false,
|
||||
"renderer": "flot",
|
||||
"seriesOverrides": [],
|
||||
"span": 4,
|
||||
"stack": false,
|
||||
"steppedLine": false,
|
||||
"targets": [
|
||||
{
|
||||
"aggregator": "max",
|
||||
"alias": "$tag_instance_id",
|
||||
"currentTagKey": "",
|
||||
"currentTagValue": "",
|
||||
"downsampleAggregator": "avg",
|
||||
"downsampleInterval": "",
|
||||
"errors": {},
|
||||
"metric": "memory.percent-used",
|
||||
"refId": "A",
|
||||
"shouldComputeRate": false,
|
||||
"tags": {
|
||||
"app": "$app",
|
||||
"env": "stage",
|
||||
"instance_id": "*"
|
||||
}
|
||||
}
|
||||
],
|
||||
"timeFrom": null,
|
||||
"timeShift": null,
|
||||
"title": "Memory Utilization",
|
||||
"tooltip": {
|
||||
"shared": true,
|
||||
"value_type": "cumulative"
|
||||
},
|
||||
"type": "graph",
|
||||
"x-axis": true,
|
||||
"y-axis": true,
|
||||
"y_formats": [
|
||||
"percent",
|
||||
"short"
|
||||
]
|
||||
},
|
||||
{
|
||||
"aliasColors": {},
|
||||
"bars": false,
|
||||
"datasource": null,
|
||||
"editable": true,
|
||||
"error": false,
|
||||
"fill": 0,
|
||||
"grid": {
|
||||
"leftLogBase": 1,
|
||||
"leftMax": null,
|
||||
"leftMin": null,
|
||||
"rightLogBase": 1,
|
||||
"rightMax": null,
|
||||
"rightMin": null,
|
||||
"threshold1": null,
|
||||
"threshold1Color": "rgba(216, 200, 27, 0.27)",
|
||||
"threshold2": null,
|
||||
"threshold2Color": "rgba(234, 112, 112, 0.22)"
|
||||
},
|
||||
"id": 2,
|
||||
"legend": {
|
||||
"avg": false,
|
||||
"current": false,
|
||||
"max": false,
|
||||
"min": false,
|
||||
"show": true,
|
||||
"total": false,
|
||||
"values": false
|
||||
},
|
||||
"lines": true,
|
||||
"linewidth": 1,
|
||||
"links": [],
|
||||
"nullPointMode": "connected",
|
||||
"percentage": false,
|
||||
"pointradius": 5,
|
||||
"points": false,
|
||||
"renderer": "flot",
|
||||
"seriesOverrides": [],
|
||||
"span": 4,
|
||||
"stack": false,
|
||||
"steppedLine": false,
|
||||
"targets": [
|
||||
{
|
||||
"aggregator": "avg",
|
||||
"alias": "$tag_instance_id",
|
||||
"currentTagKey": "",
|
||||
"currentTagValue": "",
|
||||
"downsampleAggregator": "avg",
|
||||
"downsampleInterval": "",
|
||||
"errors": {},
|
||||
"metric": "memory.percent-cached",
|
||||
"refId": "A",
|
||||
"shouldComputeRate": false,
|
||||
"tags": {
|
||||
"app": "$app",
|
||||
"env": "prod",
|
||||
"instance_id": "*"
|
||||
}
|
||||
}
|
||||
],
|
||||
"timeFrom": null,
|
||||
"timeShift": null,
|
||||
"title": "Memory Cached",
|
||||
"tooltip": {
|
||||
"shared": true,
|
||||
"value_type": "cumulative"
|
||||
},
|
||||
"type": "graph",
|
||||
"x-axis": true,
|
||||
"y-axis": true,
|
||||
"y_formats": [
|
||||
"short",
|
||||
"short"
|
||||
]
|
||||
},
|
||||
```
|
||||
|
||||
Usage of each field is explained below:
|
||||
|
||||
| Name | Usage |
|
||||
| ---- | ----- |
|
||||
| TODO | TODO |
|
||||
|
||||
### timepicker
|
||||
|
||||
TODO
|
||||
Description: TODO
|
||||
|
||||
```
|
||||
"timepicker": {
|
||||
"collapse": false,
|
||||
"enable": true,
|
||||
"notice": false,
|
||||
"now": true,
|
||||
"refresh_intervals": [
|
||||
"5s",
|
||||
"10s",
|
||||
"30s",
|
||||
"1m",
|
||||
"5m",
|
||||
"15m",
|
||||
"30m",
|
||||
"1h",
|
||||
"2h",
|
||||
"1d"
|
||||
],
|
||||
"status": "Stable",
|
||||
"time_options": [
|
||||
"5m",
|
||||
"15m",
|
||||
"1h",
|
||||
"3h",
|
||||
"6h",
|
||||
"12h",
|
||||
"24h",
|
||||
"2d",
|
||||
"3d",
|
||||
"4d",
|
||||
"7d",
|
||||
"30d"
|
||||
],
|
||||
"type": "timepicker"
|
||||
}
|
||||
```
|
||||
|
||||
Usage of the fields is explained below:
|
||||
|
||||
| Name | Usage |
|
||||
| ---- | ----- |
|
||||
| **collapse** | whether timepicker is collapsed or not |
|
||||
| **enable** | whether timepicker is enabled or not |
|
||||
| **notice** | TODO |
|
||||
| **now** | TODO |
|
||||
| **refresh_intervals** | TODO |
|
||||
| **status** | TODO |
|
||||
| **time_options** | TODO |
|
||||
| **type** | TODO |
|
||||
|
||||
### templating
|
||||
|
||||
TODO
|
||||
`templating` fields contains array of template variables with their saved values along with some other metadata, for example:
|
||||
|
||||
```
|
||||
"templating": {
|
||||
"enable": true,
|
||||
"list": [
|
||||
{
|
||||
"allFormat": "wildcard",
|
||||
"current": {
|
||||
"tags": [],
|
||||
"text": "prod",
|
||||
"value": "prod"
|
||||
},
|
||||
"datasource": null,
|
||||
"includeAll": true,
|
||||
"name": "env",
|
||||
"options": [
|
||||
{
|
||||
"selected": false,
|
||||
"text": "All",
|
||||
"value": "*"
|
||||
},
|
||||
{
|
||||
"selected": false,
|
||||
"text": "stage",
|
||||
"value": "stage"
|
||||
},
|
||||
{
|
||||
"selected": false,
|
||||
"text": "test",
|
||||
"value": "test"
|
||||
}
|
||||
],
|
||||
"query": "tag_values(cpu.utilization.average,env)",
|
||||
"refresh": false,
|
||||
"refresh_on_load": false,
|
||||
"type": "query"
|
||||
},
|
||||
{
|
||||
"allFormat": "wildcard",
|
||||
"current": {
|
||||
"text": "apache",
|
||||
"value": "apache"
|
||||
},
|
||||
"datasource": null,
|
||||
"includeAll": false,
|
||||
"multi": false,
|
||||
"multiFormat": "glob",
|
||||
"name": "app",
|
||||
"options": [
|
||||
{
|
||||
"selected": true,
|
||||
"text": "tomcat",
|
||||
"value": "tomcat"
|
||||
},
|
||||
{
|
||||
"selected": false,
|
||||
"text": "cassandra",
|
||||
"value": "cassandra"
|
||||
}
|
||||
],
|
||||
"query": "tag_values(cpu.utilization.average,app)",
|
||||
"refresh_on_load": false,
|
||||
"regex": "",
|
||||
"type": "query"
|
||||
}
|
||||
]
|
||||
}
|
||||
```
|
||||
|
||||
Usage of the above mentioned fields in the templating section is explained below:
|
||||
|
||||
| Name | Usage |
|
||||
| ---- | ----- |
|
||||
| **enable** | whether templating is enabled or not |
|
||||
| **list** | an array of objects representing, each representing one template variable |
|
||||
| **allFormat** | format to use while fetching all values from datasource, eg: `wildcard`, `glob`, `regex`, `pipe`, etc. |
|
||||
| **current** | shows current selected variable text/value on the dashboard |
|
||||
| **datasource** | shows datasource for the variables |
|
||||
| **includeAll** | whether all value option is available or not |
|
||||
| **multi** | whether multiple values can be selected or not from variable value list |
|
||||
| **multiFormat** | format to use while fetching timeseries from datasource |
|
||||
| **name** | name of variable |
|
||||
| **options** | array of variable text/value pairs available for selection on dashboard |
|
||||
| **query** | datasource query used to fetch values for a variable |
|
||||
| **refresh_on_load** | TODO |
|
||||
| **regex** | TODO |
|
||||
| **type** | type of variable, i.e. `custom`, `query` or `interval` |
|
||||
|
||||
### annotations
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user