Heatmap: Fix bottom bucket range in tooltip (#60562)

Co-authored-by: nmarrs <nathanielmarrs@gmail.com>
This commit is contained in:
Leon Sorokin 2022-12-23 12:56:07 -06:00 committed by GitHub
parent 8b200d74b9
commit b439fd56d8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 23 additions and 4 deletions

View File

@ -173,6 +173,14 @@ export function rowsToCellsHeatmap(opts: RowsHeatmapOptions): DataFrame {
});
}
const valueCfg = {
...yFields[0].config,
};
if (valueCfg.displayNameFromDS) {
delete valueCfg.displayNameFromDS;
}
return {
length: xs.length,
refId: opts.frame.refId,
@ -199,7 +207,7 @@ export function rowsToCellsHeatmap(opts: RowsHeatmapOptions): DataFrame {
name: opts.value?.length ? opts.value : 'Value',
type: FieldType.number,
values: new ArrayVector(counts2),
config: yFields[0].config,
config: valueCfg,
display: yFields[0].display,
},
],

View File

@ -64,11 +64,18 @@ const HeatmapHoverCell = ({ data, hover, showHistogram }: Props) => {
let yBucketMin: string;
let yBucketMax: string;
let nonNumericOrdinalDisplay: string | undefined = undefined;
if (meta.yOrdinalDisplay) {
const yMinIdx = data.yLayout === HeatmapCellLayout.le ? yValueIdx - 1 : yValueIdx;
const yMaxIdx = data.yLayout === HeatmapCellLayout.le ? yValueIdx : yValueIdx + 1;
yBucketMin = `${meta.yOrdinalDisplay[yMinIdx]}`;
yBucketMin = yMinIdx < 0 ? meta.yMinDisplay! : `${meta.yOrdinalDisplay[yMinIdx]}`;
yBucketMax = `${meta.yOrdinalDisplay[yMaxIdx]}`;
// e.g. "pod-xyz123"
if (!meta.yOrdinalLabel || Number.isNaN(+meta.yOrdinalLabel[0])) {
nonNumericOrdinalDisplay = data.yLayout === HeatmapCellLayout.le ? yBucketMax : yBucketMin;
}
} else {
const value = yVals?.[yValueIdx];
@ -210,7 +217,11 @@ const HeatmapHoverCell = ({ data, hover, showHistogram }: Props) => {
);
}
const renderYBuckets = () => {
const renderYBucket = () => {
if (nonNumericOrdinalDisplay) {
return <div>Name: {nonNumericOrdinalDisplay}</div>;
}
switch (data.yLayout) {
case HeatmapCellLayout.unknown:
return <div>{yDisp(yBucketMin)}</div>;
@ -237,7 +248,7 @@ const HeatmapHoverCell = ({ data, hover, showHistogram }: Props) => {
/>
)}
<div>
{renderYBuckets()}
{renderYBucket()}
<div>
{getFieldDisplayName(countField!, data.heatmap)}: {data.display!(count)}
</div>