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