mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
HeatmapNG: ensure non-zero y bucket size (#49454)
Co-authored-by: Ryan McKinley <ryantxu@gmail.com>
This commit is contained in:
parent
8b2a3a018d
commit
143f9e2dd9
@ -115,6 +115,7 @@ export const HeatmapPanel: React.FC<HeatmapPanelProps> = ({
|
||||
cellGap: options.cellGap,
|
||||
hideThreshold: options.hideThreshold,
|
||||
exemplarColor: options.exemplars?.color ?? 'rgba(255,0,255,0.7)',
|
||||
yAxisReverse: options.yAxisReverse,
|
||||
});
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, [options, data.structureRev]);
|
||||
|
@ -43,7 +43,7 @@ describe('Heatmap Migrations', () => {
|
||||
"mode": "scheme",
|
||||
"scale": "exponential",
|
||||
"scheme": "BuGn",
|
||||
"steps": 256,
|
||||
"steps": 128,
|
||||
},
|
||||
"exemplars": Object {
|
||||
"color": "rgba(255,0,255,0.7)",
|
||||
|
@ -53,7 +53,7 @@ export function angularToReactHeatmap(angular: any): { fieldConfig: FieldConfigS
|
||||
calculate,
|
||||
color: {
|
||||
...defaultPanelOptions.color,
|
||||
steps: 256, // best match with existing colors
|
||||
steps: 128, // best match with existing colors
|
||||
},
|
||||
cellGap: asNumber(angular.cards?.cardPadding),
|
||||
cellSize: asNumber(angular.cards?.cardRound),
|
||||
|
@ -52,6 +52,7 @@ interface PrepConfigOpts {
|
||||
exemplarColor: string;
|
||||
cellGap?: number | null; // in css pixels
|
||||
hideThreshold?: number;
|
||||
yAxisReverse?: boolean;
|
||||
}
|
||||
|
||||
export function prepConfig(opts: PrepConfigOpts) {
|
||||
@ -67,6 +68,7 @@ export function prepConfig(opts: PrepConfigOpts) {
|
||||
palette,
|
||||
cellGap,
|
||||
hideThreshold,
|
||||
yAxisReverse,
|
||||
} = opts;
|
||||
|
||||
const pxRatio = devicePixelRatio;
|
||||
@ -210,14 +212,18 @@ export function prepConfig(opts: PrepConfigOpts) {
|
||||
isTime: false,
|
||||
// distribution: ScaleDistribution.Ordinal, // does not work with facets/scatter yet
|
||||
orientation: ScaleOrientation.Vertical,
|
||||
direction: ScaleDirection.Up,
|
||||
direction: yAxisReverse ? ScaleDirection.Down : ScaleDirection.Up,
|
||||
// should be tweakable manually
|
||||
distribution: shouldUseLogScale ? ScaleDistribution.Log : ScaleDistribution.Linear,
|
||||
log: 2,
|
||||
range: shouldUseLogScale
|
||||
? undefined
|
||||
: (u, dataMin, dataMax) => {
|
||||
const bucketSize = dataRef.current?.yBucketSize;
|
||||
let bucketSize = dataRef.current?.yBucketSize;
|
||||
|
||||
if (bucketSize === 0) {
|
||||
bucketSize = 1;
|
||||
}
|
||||
|
||||
if (bucketSize) {
|
||||
if (dataRef.current?.yLayout === BucketLayout.le) {
|
||||
@ -302,7 +308,11 @@ export function prepConfig(opts: PrepConfigOpts) {
|
||||
gap: cellGap,
|
||||
hideThreshold,
|
||||
xAlign: dataRef.current?.xLayout === BucketLayout.le ? -1 : dataRef.current?.xLayout === BucketLayout.ge ? 1 : 0,
|
||||
yAlign: dataRef.current?.yLayout === BucketLayout.le ? -1 : dataRef.current?.yLayout === BucketLayout.ge ? 1 : 0,
|
||||
yAlign: ((dataRef.current?.yLayout === BucketLayout.le
|
||||
? -1
|
||||
: dataRef.current?.yLayout === BucketLayout.ge
|
||||
? 1
|
||||
: 0) * (yAxisReverse ? -1 : 1)) as -1 | 0 | 1,
|
||||
disp: {
|
||||
fill: {
|
||||
values: (u, seriesIdx) => {
|
||||
@ -437,7 +447,7 @@ export function heatmapPathsDense(opts: PathbuilderOpts) {
|
||||
// detect x and y bin qtys by detecting layout repetition in x & y data
|
||||
let yBinQty = dlen - ys.lastIndexOf(ys[0]);
|
||||
let xBinQty = dlen / yBinQty;
|
||||
let yBinIncr = ys[1] - ys[0];
|
||||
let yBinIncr = ys[1] - ys[0] || scaleY.max! - scaleY.min!;
|
||||
let xBinIncr = xs[yBinQty] - xs[0];
|
||||
|
||||
// uniform tile sizes based on zoom level
|
||||
|
Loading…
Reference in New Issue
Block a user