mirror of https://github.com/grafana/grafana
DashboardQuery: Expand query options (#53998)
parent
4dc0d49025
commit
17b2fb04e8
@ -0,0 +1,536 @@ |
|||||||
|
{ |
||||||
|
"annotations": { |
||||||
|
"list": [ |
||||||
|
{ |
||||||
|
"builtIn": 1, |
||||||
|
"datasource": { |
||||||
|
"type": "grafana", |
||||||
|
"uid": "-- Grafana --" |
||||||
|
}, |
||||||
|
"enable": true, |
||||||
|
"hide": true, |
||||||
|
"iconColor": "rgba(0, 211, 255, 1)", |
||||||
|
"name": "Annotations & Alerts", |
||||||
|
"target": { |
||||||
|
"limit": 100, |
||||||
|
"matchAny": false, |
||||||
|
"tags": [], |
||||||
|
"type": "dashboard" |
||||||
|
}, |
||||||
|
"type": "dashboard" |
||||||
|
} |
||||||
|
] |
||||||
|
}, |
||||||
|
"editable": true, |
||||||
|
"fiscalYearStartMonth": 0, |
||||||
|
"graphTooltip": 0, |
||||||
|
"id": 1394, |
||||||
|
"links": [], |
||||||
|
"liveNow": false, |
||||||
|
"panels": [ |
||||||
|
{ |
||||||
|
"datasource": { |
||||||
|
"type": "testdata", |
||||||
|
"uid": "PD8C576611E62080A" |
||||||
|
}, |
||||||
|
"gridPos": { |
||||||
|
"h": 3, |
||||||
|
"w": 24, |
||||||
|
"x": 0, |
||||||
|
"y": 0 |
||||||
|
}, |
||||||
|
"id": 9, |
||||||
|
"options": { |
||||||
|
"content": "Dashboard queries allow re-using the same results from one panel in another panel context.\n\nThis dashboard shows a single panel that makes a real query and applies transformations. The other panels, all use the same results rather than make their own query requests.", |
||||||
|
"mode": "markdown" |
||||||
|
}, |
||||||
|
"pluginVersion": "9.2.0-pre", |
||||||
|
"type": "text" |
||||||
|
}, |
||||||
|
{ |
||||||
|
"datasource": { |
||||||
|
"type": "testdata", |
||||||
|
"uid": "PD8C576611E62080A" |
||||||
|
}, |
||||||
|
"fieldConfig": { |
||||||
|
"defaults": { |
||||||
|
"color": { |
||||||
|
"mode": "thresholds" |
||||||
|
}, |
||||||
|
"custom": { |
||||||
|
"align": "auto", |
||||||
|
"displayMode": "auto", |
||||||
|
"inspect": false |
||||||
|
}, |
||||||
|
"mappings": [], |
||||||
|
"thresholds": { |
||||||
|
"mode": "absolute", |
||||||
|
"steps": [ |
||||||
|
{ |
||||||
|
"color": "green" |
||||||
|
}, |
||||||
|
{ |
||||||
|
"color": "red", |
||||||
|
"value": 80 |
||||||
|
} |
||||||
|
] |
||||||
|
} |
||||||
|
}, |
||||||
|
"overrides": [] |
||||||
|
}, |
||||||
|
"gridPos": { |
||||||
|
"h": 18, |
||||||
|
"w": 7, |
||||||
|
"x": 0, |
||||||
|
"y": 3 |
||||||
|
}, |
||||||
|
"id": 2, |
||||||
|
"options": { |
||||||
|
"footer": { |
||||||
|
"fields": "", |
||||||
|
"reducer": [ |
||||||
|
"sum" |
||||||
|
], |
||||||
|
"show": false |
||||||
|
}, |
||||||
|
"showHeader": true |
||||||
|
}, |
||||||
|
"pluginVersion": "9.2.0-pre", |
||||||
|
"targets": [ |
||||||
|
{ |
||||||
|
"csvFileName": "flight_info_by_state.csv", |
||||||
|
"datasource": { |
||||||
|
"type": "testdata", |
||||||
|
"uid": "PD8C576611E62080A" |
||||||
|
}, |
||||||
|
"refId": "A", |
||||||
|
"scenarioId": "csv_file" |
||||||
|
}, |
||||||
|
{ |
||||||
|
"csvFileName": "population_by_state.csv", |
||||||
|
"datasource": { |
||||||
|
"type": "testdata", |
||||||
|
"uid": "PD8C576611E62080A" |
||||||
|
}, |
||||||
|
"refId": "B", |
||||||
|
"scenarioId": "csv_file" |
||||||
|
} |
||||||
|
], |
||||||
|
"title": "Raw data -- with outer join", |
||||||
|
"transformations": [ |
||||||
|
{ |
||||||
|
"id": "seriesToColumns", |
||||||
|
"options": { |
||||||
|
"byField": "State", |
||||||
|
"mode": "outer" |
||||||
|
} |
||||||
|
}, |
||||||
|
{ |
||||||
|
"id": "organize", |
||||||
|
"options": { |
||||||
|
"excludeByName": { |
||||||
|
"1980 population_by_state.csv": true, |
||||||
|
"2000 population_by_state.csv": true, |
||||||
|
"DestLocation flight_info_by_state.csv": true, |
||||||
|
"Lat flight_info_by_state.csv": true, |
||||||
|
"Lng flight_info_by_state.csv": true, |
||||||
|
"Price flight_info_by_state.csv": true |
||||||
|
}, |
||||||
|
"indexByName": {}, |
||||||
|
"renameByName": { |
||||||
|
"2020 population_by_state.csv": "2020 population", |
||||||
|
"Count flight_info_by_state.csv": "Flight count", |
||||||
|
"Price flight_info_by_state.csv": "" |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
], |
||||||
|
"type": "table" |
||||||
|
}, |
||||||
|
{ |
||||||
|
"datasource": { |
||||||
|
"type": "datasource", |
||||||
|
"uid": "-- Dashboard --" |
||||||
|
}, |
||||||
|
"fieldConfig": { |
||||||
|
"defaults": { |
||||||
|
"color": { |
||||||
|
"mode": "thresholds" |
||||||
|
}, |
||||||
|
"custom": { |
||||||
|
"align": "auto", |
||||||
|
"displayMode": "auto", |
||||||
|
"inspect": false |
||||||
|
}, |
||||||
|
"mappings": [], |
||||||
|
"thresholds": { |
||||||
|
"mode": "absolute", |
||||||
|
"steps": [ |
||||||
|
{ |
||||||
|
"color": "green" |
||||||
|
}, |
||||||
|
{ |
||||||
|
"color": "red", |
||||||
|
"value": 80 |
||||||
|
} |
||||||
|
] |
||||||
|
} |
||||||
|
}, |
||||||
|
"overrides": [] |
||||||
|
}, |
||||||
|
"gridPos": { |
||||||
|
"h": 9, |
||||||
|
"w": 11, |
||||||
|
"x": 7, |
||||||
|
"y": 3 |
||||||
|
}, |
||||||
|
"id": 4, |
||||||
|
"options": { |
||||||
|
"footer": { |
||||||
|
"fields": "", |
||||||
|
"reducer": [ |
||||||
|
"sum" |
||||||
|
], |
||||||
|
"show": false |
||||||
|
}, |
||||||
|
"showHeader": true |
||||||
|
}, |
||||||
|
"pluginVersion": "9.2.0-pre", |
||||||
|
"targets": [ |
||||||
|
{ |
||||||
|
"datasource": { |
||||||
|
"type": "datasource", |
||||||
|
"uid": "-- Dashboard --" |
||||||
|
}, |
||||||
|
"panelId": 2, |
||||||
|
"refId": "A" |
||||||
|
} |
||||||
|
], |
||||||
|
"title": "Reused data (without transform)", |
||||||
|
"type": "table" |
||||||
|
}, |
||||||
|
{ |
||||||
|
"datasource": { |
||||||
|
"type": "datasource", |
||||||
|
"uid": "-- Dashboard --" |
||||||
|
}, |
||||||
|
"fieldConfig": { |
||||||
|
"defaults": { |
||||||
|
"color": { |
||||||
|
"mode": "thresholds" |
||||||
|
}, |
||||||
|
"custom": { |
||||||
|
"hideFrom": { |
||||||
|
"legend": false, |
||||||
|
"tooltip": false, |
||||||
|
"viz": false |
||||||
|
} |
||||||
|
}, |
||||||
|
"mappings": [], |
||||||
|
"thresholds": { |
||||||
|
"mode": "absolute", |
||||||
|
"steps": [ |
||||||
|
{ |
||||||
|
"color": "green" |
||||||
|
}, |
||||||
|
{ |
||||||
|
"color": "red", |
||||||
|
"value": 80 |
||||||
|
} |
||||||
|
] |
||||||
|
} |
||||||
|
}, |
||||||
|
"overrides": [] |
||||||
|
}, |
||||||
|
"gridPos": { |
||||||
|
"h": 9, |
||||||
|
"w": 6, |
||||||
|
"x": 18, |
||||||
|
"y": 3 |
||||||
|
}, |
||||||
|
"id": 5, |
||||||
|
"options": { |
||||||
|
"basemap": { |
||||||
|
"config": {}, |
||||||
|
"name": "Layer 0", |
||||||
|
"type": "default" |
||||||
|
}, |
||||||
|
"controls": { |
||||||
|
"mouseWheelZoom": true, |
||||||
|
"showAttribution": true, |
||||||
|
"showDebug": false, |
||||||
|
"showMeasure": false, |
||||||
|
"showScale": false, |
||||||
|
"showZoom": true |
||||||
|
}, |
||||||
|
"layers": [ |
||||||
|
{ |
||||||
|
"config": { |
||||||
|
"showLegend": true, |
||||||
|
"style": { |
||||||
|
"color": { |
||||||
|
"fixed": "dark-green" |
||||||
|
}, |
||||||
|
"opacity": 0.4, |
||||||
|
"rotation": { |
||||||
|
"fixed": 0, |
||||||
|
"max": 360, |
||||||
|
"min": -360, |
||||||
|
"mode": "mod" |
||||||
|
}, |
||||||
|
"size": { |
||||||
|
"field": "Flight count", |
||||||
|
"fixed": 5, |
||||||
|
"max": 15, |
||||||
|
"min": 2 |
||||||
|
}, |
||||||
|
"symbol": { |
||||||
|
"fixed": "img/icons/marker/circle.svg", |
||||||
|
"mode": "fixed" |
||||||
|
}, |
||||||
|
"textConfig": { |
||||||
|
"fontSize": 12, |
||||||
|
"offsetX": 0, |
||||||
|
"offsetY": 0, |
||||||
|
"textAlign": "center", |
||||||
|
"textBaseline": "middle" |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
"location": { |
||||||
|
"gazetteer": "public/gazetteer/usa-states.json", |
||||||
|
"lookup": "State", |
||||||
|
"mode": "lookup" |
||||||
|
}, |
||||||
|
"name": "Flight count", |
||||||
|
"tooltip": true, |
||||||
|
"type": "markers" |
||||||
|
} |
||||||
|
], |
||||||
|
"tooltip": { |
||||||
|
"mode": "details" |
||||||
|
}, |
||||||
|
"view": { |
||||||
|
"id": "coords", |
||||||
|
"lat": 35.70008, |
||||||
|
"lon": -93.558296, |
||||||
|
"zoom": 3.09 |
||||||
|
} |
||||||
|
}, |
||||||
|
"pluginVersion": "9.2.0-pre", |
||||||
|
"targets": [ |
||||||
|
{ |
||||||
|
"datasource": { |
||||||
|
"type": "datasource", |
||||||
|
"uid": "-- Dashboard --" |
||||||
|
}, |
||||||
|
"panelId": 2, |
||||||
|
"refId": "A", |
||||||
|
"withTransforms": true |
||||||
|
} |
||||||
|
], |
||||||
|
"title": "Reused data (without transform)", |
||||||
|
"type": "geomap" |
||||||
|
}, |
||||||
|
{ |
||||||
|
"datasource": { |
||||||
|
"type": "datasource", |
||||||
|
"uid": "-- Dashboard --" |
||||||
|
}, |
||||||
|
"fieldConfig": { |
||||||
|
"defaults": { |
||||||
|
"color": { |
||||||
|
"mode": "thresholds" |
||||||
|
}, |
||||||
|
"custom": { |
||||||
|
"align": "auto", |
||||||
|
"displayMode": "auto", |
||||||
|
"inspect": false |
||||||
|
}, |
||||||
|
"mappings": [], |
||||||
|
"thresholds": { |
||||||
|
"mode": "absolute", |
||||||
|
"steps": [ |
||||||
|
{ |
||||||
|
"color": "green" |
||||||
|
}, |
||||||
|
{ |
||||||
|
"color": "red", |
||||||
|
"value": 80 |
||||||
|
} |
||||||
|
] |
||||||
|
} |
||||||
|
}, |
||||||
|
"overrides": [] |
||||||
|
}, |
||||||
|
"gridPos": { |
||||||
|
"h": 9, |
||||||
|
"w": 11, |
||||||
|
"x": 7, |
||||||
|
"y": 12 |
||||||
|
}, |
||||||
|
"id": 6, |
||||||
|
"options": { |
||||||
|
"footer": { |
||||||
|
"fields": "", |
||||||
|
"reducer": [ |
||||||
|
"sum" |
||||||
|
], |
||||||
|
"show": false |
||||||
|
}, |
||||||
|
"showHeader": true |
||||||
|
}, |
||||||
|
"pluginVersion": "9.2.0-pre", |
||||||
|
"targets": [ |
||||||
|
{ |
||||||
|
"datasource": { |
||||||
|
"type": "datasource", |
||||||
|
"uid": "-- Dashboard --" |
||||||
|
}, |
||||||
|
"panelId": 2, |
||||||
|
"refId": "A", |
||||||
|
"withTransforms": true |
||||||
|
} |
||||||
|
], |
||||||
|
"title": "Reused data (with transform)", |
||||||
|
"type": "table" |
||||||
|
}, |
||||||
|
{ |
||||||
|
"datasource": { |
||||||
|
"type": "datasource", |
||||||
|
"uid": "-- Dashboard --" |
||||||
|
}, |
||||||
|
"fieldConfig": { |
||||||
|
"defaults": { |
||||||
|
"color": { |
||||||
|
"mode": "thresholds" |
||||||
|
}, |
||||||
|
"custom": { |
||||||
|
"hideFrom": { |
||||||
|
"legend": false, |
||||||
|
"tooltip": false, |
||||||
|
"viz": false |
||||||
|
} |
||||||
|
}, |
||||||
|
"mappings": [], |
||||||
|
"thresholds": { |
||||||
|
"mode": "absolute", |
||||||
|
"steps": [ |
||||||
|
{ |
||||||
|
"color": "green" |
||||||
|
}, |
||||||
|
{ |
||||||
|
"color": "red", |
||||||
|
"value": 80 |
||||||
|
} |
||||||
|
] |
||||||
|
} |
||||||
|
}, |
||||||
|
"overrides": [] |
||||||
|
}, |
||||||
|
"gridPos": { |
||||||
|
"h": 9, |
||||||
|
"w": 6, |
||||||
|
"x": 18, |
||||||
|
"y": 12 |
||||||
|
}, |
||||||
|
"id": 7, |
||||||
|
"options": { |
||||||
|
"basemap": { |
||||||
|
"config": {}, |
||||||
|
"name": "Layer 0", |
||||||
|
"type": "default" |
||||||
|
}, |
||||||
|
"controls": { |
||||||
|
"mouseWheelZoom": true, |
||||||
|
"showAttribution": true, |
||||||
|
"showDebug": false, |
||||||
|
"showMeasure": false, |
||||||
|
"showScale": false, |
||||||
|
"showZoom": true |
||||||
|
}, |
||||||
|
"layers": [ |
||||||
|
{ |
||||||
|
"config": { |
||||||
|
"showLegend": true, |
||||||
|
"style": { |
||||||
|
"color": { |
||||||
|
"fixed": "dark-green" |
||||||
|
}, |
||||||
|
"opacity": 0.4, |
||||||
|
"rotation": { |
||||||
|
"fixed": 0, |
||||||
|
"max": 360, |
||||||
|
"min": -360, |
||||||
|
"mode": "mod" |
||||||
|
}, |
||||||
|
"size": { |
||||||
|
"field": "2020 population", |
||||||
|
"fixed": 5, |
||||||
|
"max": 15, |
||||||
|
"min": 2 |
||||||
|
}, |
||||||
|
"symbol": { |
||||||
|
"fixed": "img/icons/marker/circle.svg", |
||||||
|
"mode": "fixed" |
||||||
|
}, |
||||||
|
"textConfig": { |
||||||
|
"fontSize": 12, |
||||||
|
"offsetX": 0, |
||||||
|
"offsetY": 0, |
||||||
|
"textAlign": "center", |
||||||
|
"textBaseline": "middle" |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
"location": { |
||||||
|
"gazetteer": "public/gazetteer/usa-states.json", |
||||||
|
"lookup": "State", |
||||||
|
"mode": "lookup" |
||||||
|
}, |
||||||
|
"name": "2022 Population", |
||||||
|
"tooltip": true, |
||||||
|
"type": "markers" |
||||||
|
} |
||||||
|
], |
||||||
|
"tooltip": { |
||||||
|
"mode": "details" |
||||||
|
}, |
||||||
|
"view": { |
||||||
|
"id": "coords", |
||||||
|
"lat": 35.70008, |
||||||
|
"lon": -93.558296, |
||||||
|
"zoom": 3.09 |
||||||
|
} |
||||||
|
}, |
||||||
|
"pluginVersion": "9.2.0-pre", |
||||||
|
"targets": [ |
||||||
|
{ |
||||||
|
"datasource": { |
||||||
|
"type": "datasource", |
||||||
|
"uid": "-- Dashboard --" |
||||||
|
}, |
||||||
|
"panelId": 2, |
||||||
|
"refId": "A", |
||||||
|
"withTransforms": true |
||||||
|
} |
||||||
|
], |
||||||
|
"title": "Reused data (with transform)", |
||||||
|
"type": "geomap" |
||||||
|
} |
||||||
|
], |
||||||
|
"schemaVersion": 37, |
||||||
|
"style": "dark", |
||||||
|
"tags": ["devenv"], |
||||||
|
"templating": { |
||||||
|
"list": [] |
||||||
|
}, |
||||||
|
"time": { |
||||||
|
"from": "now-6h", |
||||||
|
"to": "now" |
||||||
|
}, |
||||||
|
"timepicker": {}, |
||||||
|
"timezone": "", |
||||||
|
"title": "Reuse dashboard queries", |
||||||
|
"uid": "fYGWTVW4k" |
||||||
|
} |
||||||
@ -1,49 +0,0 @@ |
|||||||
import { css } from '@emotion/css'; |
|
||||||
import React, { ReactElement } from 'react'; |
|
||||||
|
|
||||||
import { GrafanaTheme } from '@grafana/data'; |
|
||||||
import { Icon, useStyles } from '@grafana/ui'; |
|
||||||
|
|
||||||
import { ResultInfo } from './types'; |
|
||||||
|
|
||||||
interface Props { |
|
||||||
editURL: string; |
|
||||||
target: ResultInfo; |
|
||||||
} |
|
||||||
|
|
||||||
export function DashboardQueryRow({ editURL, target }: Props): ReactElement { |
|
||||||
const style = useStyles(getStyles); |
|
||||||
|
|
||||||
return ( |
|
||||||
<div className={style.queryEditorRowHeader}> |
|
||||||
<div> |
|
||||||
<img src={target.img} width={16} className={style.logo} /> |
|
||||||
<span>{`${target.refId}:`}</span> |
|
||||||
</div> |
|
||||||
<div> |
|
||||||
<a href={editURL}> |
|
||||||
{target.query} |
|
||||||
|
|
||||||
<Icon name="external-link-alt" /> |
|
||||||
</a> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
); |
|
||||||
} |
|
||||||
|
|
||||||
function getStyles(theme: GrafanaTheme) { |
|
||||||
return { |
|
||||||
logo: css` |
|
||||||
label: logo; |
|
||||||
margin-right: ${theme.spacing.sm}; |
|
||||||
`,
|
|
||||||
queryEditorRowHeader: css` |
|
||||||
label: queryEditorRowHeader; |
|
||||||
display: flex; |
|
||||||
padding: 4px 8px; |
|
||||||
flex-flow: row wrap; |
|
||||||
background: ${theme.colors.bg2}; |
|
||||||
align-items: center; |
|
||||||
`,
|
|
||||||
}; |
|
||||||
} |
|
||||||
Loading…
Reference in new issue