IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

TimeSeries: Sort tooltip values based on raw values (#46738)

Browse Source 
* TimeSeries: Fix tooltip values sorting

* Update packages/grafana-ui/src/components/uPlot/plugins/TooltipPlugin.tsx

Co-authored-by: Zoltán Bedi <zoltan.bedi@gmail.com>

* Review

Co-authored-by: Zoltán Bedi <zoltan.bedi@gmail.com>
This commit is contained in:
Dominik Prokop 2022-04-04 11:18:29 +02:00 committed by GitHub
parent d29b8e8858
commit a55274a72d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 12 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
packages/grafana-ui/src/components/uPlot/plugins/TooltipPlugin.tsx
View File

@ -214,7 +214,7 @@ export const TooltipPlugin: React.FC<TooltipPluginProps> = ({
let series: SeriesTableRowProps[] = [];
const frame = otherProps.data;
const fields = frame.fields;
const sortIdx: Array<[number, number]> = [];
const sortIdx: any[] = [];
for (let i = 0; i < fields.length; i++) {
const field = frame.fields[i];
@ -232,7 +232,7 @@ export const TooltipPlugin: React.FC<TooltipPluginProps> = ({
const v = otherProps.data.fields[i].values.get(focusedPointIdxs[i]!);
const display = field.display!(v);
sortIdx.push([series.length, v]);
sortIdx.push(v);
series.push({
color: display.color || FALLBACK_COLOR,
label: getFieldDisplayName(field, frame),
@ -242,7 +242,16 @@ export const TooltipPlugin: React.FC<TooltipPluginProps> = ({
}
if (sortOrder !== SortOrder.None) {
series.sort((a, b) => arrayUtils.sortValues(sortOrder)(a.value, b.value));
// create sort reference series array, as Array.sort() mutates the original array
const sortRef = [...series];
const sortFn = arrayUtils.sortValues(sortOrder);
series.sort((a, b) => {
// get compared values indices to retrieve raw values from sortIdx
const aIdx = sortRef.indexOf(a);
const bIdx = sortRef.indexOf(b);
return sortFn(sortIdx[aIdx], sortIdx[bIdx]);
});
}
tooltip = <SeriesTable series={series} timestamp={xVal} />;