Skip to content

PanelBuilder🔗

Constructor🔗

new PanelBuilder()

Methods🔗

build🔗

Builds the object.

build()

axisBorderShow🔗

axisBorderShow(axisBorderShow: boolean)

axisCenteredZero🔗

axisCenteredZero(axisCenteredZero: boolean)

axisColorMode🔗

axisColorMode(axisColorMode: common.AxisColorMode)

axisGridShow🔗

axisGridShow(axisGridShow: boolean)

axisLabel🔗

axisLabel(axisLabel: string)

axisPlacement🔗

axisPlacement(axisPlacement: common.AxisPlacement)

axisSoftMax🔗

axisSoftMax(axisSoftMax: number)

axisSoftMin🔗

axisSoftMin(axisSoftMin: number)

axisWidth🔗

axisWidth(axisWidth: number)

barRadius🔗

Controls the radius of each bar.

barRadius(barRadius: number)

barWidth🔗

Controls the width of bars. 1 = Max width, 0 = Min width.

barWidth(barWidth: number)

cacheTimeout🔗

Sets panel queries cache timeout.

cacheTimeout(cacheTimeout: string)

colorByField🔗

Use the color value for a sibling field to color each bar value.

colorByField(colorByField: string)

colorScheme🔗

Panel color configuration

colorScheme(color: cog.Builder<dashboard.FieldColor>)

datasource🔗

The datasource used in all targets.

datasource(datasource: dashboard.DataSourceRef)

decimals🔗

Specify the number of decimals Grafana includes in the rendered value.

If you leave this field blank, Grafana automatically truncates the number of decimals based on the value.

For example 1.1234 will display as 1.12 and 100.456 will display as 100.

To display all decimals, set the unit to String.

decimals(decimals: number)

description🔗

Panel description.

description(description: string)

displayName🔗

The display value for this field. This supports template variables blank is auto

displayName(displayName: string)

fillOpacity🔗

Controls the fill opacity of the bars.

fillOpacity(fillOpacity: number)

fullHighlight🔗

Enables mode which highlights the entire bar area and shows tooltip when cursor

hovers over highlighted area

fullHighlight(fullHighlight: boolean)

gradientMode🔗

Set the mode of the gradient fill. Fill gradient is based on the line color. To change the color, use the standard color scheme field option.

Gradient appearance is influenced by the Fill opacity setting.

gradientMode(gradientMode: common.GraphGradientMode)

gridPos🔗

Grid position.

gridPos(gridPos: dashboard.GridPos)

groupWidth🔗

Controls the width of groups. 1 = max with, 0 = min width.

groupWidth(groupWidth: number)

height🔗

Panel height. The height is the number of rows from the top edge of the panel.

height(h: number)

hideFrom🔗

hideFrom(hideFrom: cog.Builder<common.HideSeriesConfig>)

hideTimeOverride🔗

Controls if the timeFrom or timeShift overrides are shown in the panel header

hideTimeOverride(hideTimeOverride: boolean)

id🔗

Unique identifier of the panel. Generated by Grafana when creating a new panel. It must be unique within a dashboard, but not globally.

id(id: number)

interval🔗

The min time interval setting defines a lower limit for the $__interval and $__interval_ms variables.

This value must be formatted as a number followed by a valid time

identifier like: "40s", "3d", etc.

See: https://grafana.com/docs/grafana/latest/panels-visualizations/query-transform-data/#query-options

interval(interval: string)

legend🔗

legend(legend: cog.Builder<common.VizLegendOptions>)

libraryPanel🔗

Dynamically load the panel

libraryPanel(libraryPanel: dashboard.LibraryPanelRef)

lineWidth🔗

Controls line width of the bars.

lineWidth(lineWidth: number)

Panel links.

links(links: cog.Builder<dashboard.DashboardLink>[])

mappings🔗

Convert input values into a display string

mappings(mappings: dashboard.ValueMapping[])

max🔗

The maximum value used in percentage threshold calculations. Leave blank for auto calculation based on all series and fields.

max(max: number)

maxDataPoints🔗

The maximum number of data points that the panel queries are retrieving.

maxDataPoints(maxDataPoints: number)

maxPerRow🔗

Option for repeated panels that controls max items per row

Only relevant for horizontally repeated panels

maxPerRow(maxPerRow: number)

min🔗

The minimum value used in percentage threshold calculations. Leave blank for auto calculation based on all series and fields.

min(min: number)

noValue🔗

Alternative to empty string

noValue(noValue: string)

orientation🔗

Controls the orientation of the bar chart, either vertical or horizontal.

orientation(orientation: common.VizOrientation)

overrides🔗

Overrides are the options applied to specific fields overriding the defaults.

overrides(overrides: {
    matcher: dashboard.MatcherConfig;
    properties: dashboard.DynamicConfigValue[];
}[])

queryCachingTTL🔗

Overrides the data source configured time-to-live for a query cache item in milliseconds

queryCachingTTL(queryCachingTTL: number)

repeat🔗

Name of template variable to repeat for.

repeat(repeat: string)

repeatDirection🔗

Direction to repeat in if 'repeat' is set.

h for horizontal, v for vertical.

repeatDirection(repeatDirection: "h" | "v")

scaleDistribution🔗

scaleDistribution(scaleDistribution: cog.Builder<common.ScaleDistributionConfig>)

showValue🔗

This controls whether values are shown on top or to the left of bars.

showValue(showValue: common.VisibilityMode)

span🔗

Panel width. The width is the number of columns from the left edge of the panel.

span(w: number)

stacking🔗

Controls whether bars are stacked or not, either normally or in percent mode.

stacking(stacking: common.StackingMode)

targets🔗

Depends on the panel plugin. See the plugin documentation for details.

targets(targets: cog.Builder<cog.Dataquery>[])

text🔗

text(text: cog.Builder<common.VizTextDisplayOptions>)

thresholds🔗

Map numeric values to states

thresholds(thresholds: cog.Builder<dashboard.ThresholdsConfig>)

thresholdsStyle🔗

Threshold rendering

thresholdsStyle(thresholdsStyle: cog.Builder<common.GraphThresholdsStyleConfig>)

timeFrom🔗

Overrides the relative time range for individual panels,

which causes them to be different than what is selected in

the dashboard time picker in the top-right corner of the dashboard. You can use this to show metrics from different

time periods or days on the same dashboard.

The value is formatted as time operation like: now-5m (Last 5 minutes), now/d (the day so far),

now-5d/d(Last 5 days), now/w (This week so far), now-2y/y (Last 2 years).

Note: Panel time overrides have no effect when the dashboard’s time range is absolute.

See: https://grafana.com/docs/grafana/latest/panels-visualizations/query-transform-data/#query-options

timeFrom(timeFrom: string)

timeShift🔗

Overrides the time range for individual panels by shifting its start and end relative to the time picker.

For example, you can shift the time range for the panel to be two hours earlier than the dashboard time picker setting 2h.

Note: Panel time overrides have no effect when the dashboard’s time range is absolute.

See: https://grafana.com/docs/grafana/latest/panels-visualizations/query-transform-data/#query-options

timeShift(timeShift: string)

title🔗

Panel title.

title(title: string)

tooltip🔗

tooltip(tooltip: cog.Builder<common.VizTooltipOptions>)

transformations🔗

List of transformations that are applied to the panel data before rendering.

When there are multiple transformations, Grafana applies them in the order they are listed.

Each transformation creates a result set that then passes on to the next transformation in the processing pipeline.

transformations(transformations: dashboard.DataTransformerConfig[])

transparent🔗

Whether to display the panel without a background.

transparent(transparent: boolean)

unit🔗

Unit a field should use. The unit you select is applied to all fields except time.

You can use the units ID availables in Grafana or a custom unit.

Available units in Grafana: https://github.com/grafana/grafana/blob/main/packages/grafana-data/src/valueFormats/categories.ts

As custom unit, you can use the following formats:

suffix:<suffix> for custom unit that should go after value.

prefix:<prefix> for custom unit that should go before value.

time:<format> For custom date time formats type for example time:YYYY-MM-DD.

si:<base scale><unit characters> for custom SI units. For example: si: mF. This one is a bit more advanced as you can specify both a unit and the source data scale. So if your source data is represented as milli (thousands of) something prefix the unit with that SI scale character.

count:<unit> for a custom count unit.

currency:<unit> for custom a currency unit.

unit(unit: string)

withOverride🔗

Overrides are the options applied to specific fields overriding the defaults.

withOverride(override: {
    matcher: dashboard.MatcherConfig;
    properties: dashboard.DynamicConfigValue[];
})

withTarget🔗

Depends on the panel plugin. See the plugin documentation for details.

withTarget(target: cog.Builder<cog.Dataquery>)

withTransformation🔗

List of transformations that are applied to the panel data before rendering.

When there are multiple transformations, Grafana applies them in the order they are listed.

Each transformation creates a result set that then passes on to the next transformation in the processing pipeline.

withTransformation(transformation: dashboard.DataTransformerConfig)

xField🔗

Manually select which field from the dataset to represent the x field.

xField(xField: string)

xTickLabelMaxLength🔗

Sets the max length that a label can have before it is truncated.

xTickLabelMaxLength(xTickLabelMaxLength: number)

xTickLabelRotation🔗

Controls the rotation of the x axis labels.

xTickLabelRotation(xTickLabelRotation: number)

xTickLabelSpacing🔗

Controls the spacing between x axis labels.

negative values indicate backwards skipping behavior

xTickLabelSpacing(xTickLabelSpacing: number)

See also🔗