mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
HeatmapNG: support y min/max config (#50900)
Co-authored-by: Ryan McKinley <ryantxu@gmail.com>
This commit is contained in:
parent
c1550d1f07
commit
7c175e019c
@ -1,14 +1,16 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
|
||||||
import { FieldConfigProperty, FieldType, identityOverrideProcessor, PanelPlugin } from '@grafana/data';
|
import { FieldConfigProperty, FieldType, identityOverrideProcessor, PanelData, PanelPlugin } from '@grafana/data';
|
||||||
import { config } from '@grafana/runtime';
|
import { config } from '@grafana/runtime';
|
||||||
import { AxisPlacement, GraphFieldConfig, ScaleDistribution, ScaleDistributionConfig } from '@grafana/schema';
|
import { AxisPlacement, GraphFieldConfig, ScaleDistribution, ScaleDistributionConfig } from '@grafana/schema';
|
||||||
import { addHideFrom, ScaleDistributionEditor } from '@grafana/ui/src/options/builder';
|
import { addHideFrom, ScaleDistributionEditor } from '@grafana/ui/src/options/builder';
|
||||||
import { ColorScale } from 'app/core/components/ColorScale/ColorScale';
|
import { ColorScale } from 'app/core/components/ColorScale/ColorScale';
|
||||||
import { addHeatmapCalculationOptions } from 'app/features/transformers/calculateHeatmap/editor/helper';
|
import { addHeatmapCalculationOptions } from 'app/features/transformers/calculateHeatmap/editor/helper';
|
||||||
|
import { readHeatmapScanlinesCustomMeta } from 'app/features/transformers/calculateHeatmap/heatmap';
|
||||||
import { HeatmapCellLayout } from 'app/features/transformers/calculateHeatmap/models.gen';
|
import { HeatmapCellLayout } from 'app/features/transformers/calculateHeatmap/models.gen';
|
||||||
|
|
||||||
import { HeatmapPanel } from './HeatmapPanel';
|
import { HeatmapPanel } from './HeatmapPanel';
|
||||||
|
import { prepareHeatmapData } from './fields';
|
||||||
import { heatmapChangedHandler, heatmapMigrationHandler } from './migrations';
|
import { heatmapChangedHandler, heatmapMigrationHandler } from './migrations';
|
||||||
import { PanelOptions, defaultPanelOptions, HeatmapColorMode, HeatmapColorScale } from './models.gen';
|
import { PanelOptions, defaultPanelOptions, HeatmapColorMode, HeatmapColorScale } from './models.gen';
|
||||||
import { colorSchemes, quantizeScheme } from './palettes';
|
import { colorSchemes, quantizeScheme } from './palettes';
|
||||||
@ -46,6 +48,13 @@ export const plugin = new PanelPlugin<PanelOptions, GraphFieldConfig>(HeatmapPan
|
|||||||
.setPanelOptions((builder, context) => {
|
.setPanelOptions((builder, context) => {
|
||||||
const opts = context.options ?? defaultPanelOptions;
|
const opts = context.options ?? defaultPanelOptions;
|
||||||
|
|
||||||
|
let isOrdinalY = false;
|
||||||
|
|
||||||
|
try {
|
||||||
|
const v = prepareHeatmapData({ series: context.data } as PanelData, opts, config.theme2);
|
||||||
|
isOrdinalY = readHeatmapScanlinesCustomMeta(v.heatmap).yOrdinalDisplay != null;
|
||||||
|
} catch {}
|
||||||
|
|
||||||
let category = ['Heatmap'];
|
let category = ['Heatmap'];
|
||||||
|
|
||||||
builder.addRadio({
|
builder.addRadio({
|
||||||
@ -81,8 +90,8 @@ export const plugin = new PanelPlugin<PanelOptions, GraphFieldConfig>(HeatmapPan
|
|||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
// TODO: support clamping the min/max range when there is a real axis
|
if (!isOrdinalY) {
|
||||||
if (false && opts.calculate) {
|
// if undefined, then show the min+max
|
||||||
builder
|
builder
|
||||||
.addNumberInput({
|
.addNumberInput({
|
||||||
path: 'yAxis.min',
|
path: 'yAxis.min',
|
||||||
|
@ -260,6 +260,7 @@ export function prepConfig(opts: PrepConfigOpts) {
|
|||||||
const yScale = yFieldConfig?.scaleDistribution ?? { type: ScaleDistribution.Linear };
|
const yScale = yFieldConfig?.scaleDistribution ?? { type: ScaleDistribution.Linear };
|
||||||
const yAxisReverse = Boolean(yAxisConfig.reverse);
|
const yAxisReverse = Boolean(yAxisConfig.reverse);
|
||||||
const shouldUseLogScale = yScale.type !== ScaleDistribution.Linear || heatmapType === DataFrameType.HeatmapSparse;
|
const shouldUseLogScale = yScale.type !== ScaleDistribution.Linear || heatmapType === DataFrameType.HeatmapSparse;
|
||||||
|
const isOrdianalY = readHeatmapScanlinesCustomMeta(dataRef.current?.heatmap).yOrdinalDisplay != null;
|
||||||
|
|
||||||
// random to prevent syncing y in other heatmaps
|
// random to prevent syncing y in other heatmaps
|
||||||
// TODO: try to match TimeSeries y keygen algo to sync with TimeSeries panels (when not isOrdianalY)
|
// TODO: try to match TimeSeries y keygen algo to sync with TimeSeries panels (when not isOrdianalY)
|
||||||
@ -275,11 +276,34 @@ export function prepConfig(opts: PrepConfigOpts) {
|
|||||||
distribution: shouldUseLogScale ? ScaleDistribution.Log : ScaleDistribution.Linear,
|
distribution: shouldUseLogScale ? ScaleDistribution.Log : ScaleDistribution.Linear,
|
||||||
log: yScale.log ?? 2,
|
log: yScale.log ?? 2,
|
||||||
range:
|
range:
|
||||||
// sparse already accounts for le/ge by explicit yMin & yMax cell bounds, so use default log ranging
|
// sparse already accounts for le/ge by explicit yMin & yMax cell bounds, so no need to expand y range
|
||||||
heatmapType === DataFrameType.HeatmapSparse
|
heatmapType === DataFrameType.HeatmapSparse
|
||||||
? undefined
|
? (u, dataMin, dataMax) => {
|
||||||
|
let scaleMin: number | null, scaleMax: number | null;
|
||||||
|
|
||||||
|
[scaleMin, scaleMax] = shouldUseLogScale
|
||||||
|
? uPlot.rangeLog(dataMin, dataMax, (yScale.log ?? 2) as unknown as uPlot.Scale.LogBase, true)
|
||||||
|
: [dataMin, dataMax];
|
||||||
|
|
||||||
|
if (shouldUseLogScale && !isOrdianalY) {
|
||||||
|
let { min: explicitMin, max: explicitMax } = yAxisConfig;
|
||||||
|
|
||||||
|
// guard against <= 0
|
||||||
|
if (explicitMin != null && explicitMin > 0) {
|
||||||
|
scaleMin = explicitMin;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (explicitMax != null && explicitMax > 0) {
|
||||||
|
scaleMax = explicitMax;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return [scaleMin, scaleMax];
|
||||||
|
}
|
||||||
: // dense and ordinal only have one of yMin|yMax|y, so expand range by one cell in the direction of le/ge/unknown
|
: // dense and ordinal only have one of yMin|yMax|y, so expand range by one cell in the direction of le/ge/unknown
|
||||||
(u, dataMin, dataMax) => {
|
(u, dataMin, dataMax) => {
|
||||||
|
let { min: explicitMin, max: explicitMax } = yAxisConfig;
|
||||||
|
|
||||||
// logarithmic expansion
|
// logarithmic expansion
|
||||||
if (shouldUseLogScale) {
|
if (shouldUseLogScale) {
|
||||||
let yExp = u.scales[yScaleKey].log!;
|
let yExp = u.scales[yScaleKey].log!;
|
||||||
@ -316,6 +340,17 @@ export function prepConfig(opts: PrepConfigOpts) {
|
|||||||
dataMin /= yExp / 2;
|
dataMin /= yExp / 2;
|
||||||
dataMax *= yExp / 2;
|
dataMax *= yExp / 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (!isOrdianalY) {
|
||||||
|
// guard against <= 0
|
||||||
|
if (explicitMin != null && explicitMin > 0) {
|
||||||
|
dataMin = explicitMin;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (explicitMax != null && explicitMax > 0) {
|
||||||
|
dataMax = explicitMax;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
// linear expansion
|
// linear expansion
|
||||||
else {
|
else {
|
||||||
@ -337,12 +372,17 @@ export function prepConfig(opts: PrepConfigOpts) {
|
|||||||
} else {
|
} else {
|
||||||
// how to expand scale range if inferred non-regular or log buckets?
|
// how to expand scale range if inferred non-regular or log buckets?
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (!isOrdianalY) {
|
||||||
|
dataMin = explicitMin ?? dataMin;
|
||||||
|
dataMax = explicitMax ?? dataMax;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
return [dataMin, dataMax];
|
return [dataMin, dataMax];
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
const isOrdianalY = readHeatmapScanlinesCustomMeta(dataRef.current?.heatmap).yOrdinalDisplay != null;
|
|
||||||
const disp = dataRef.current?.heatmap?.fields[1].display ?? getValueFormat('short');
|
const disp = dataRef.current?.heatmap?.fields[1].display ?? getValueFormat('short');
|
||||||
|
|
||||||
builder.addAxis({
|
builder.addAxis({
|
||||||
|
Loading…
Reference in New Issue
Block a user