Timeline: tooltip fixups (#35145) (#35191)

(cherry picked from commit a3ba605aff)

Co-authored-by: Leon Sorokin <leeoniya@gmail.com>
This commit is contained in:
Grot (@grafanabot)
2021-06-03 09:50:16 -05:00
committed by GitHub
co-authored by Leon Sorokin
parent 4fe55be39e
commit a8b2415b1f
2 changed files with 18 additions and 16 deletions
@@ -47,8 +47,8 @@ export interface TimelineCoreOptions {
getTimeRange: () => TimeRange; getTimeRange: () => TimeRange;
formatValue?: (seriesIdx: number, value: any) => string; formatValue?: (seriesIdx: number, value: any) => string;
getFieldConfig: (seriesIdx: number) => TimelineFieldConfig; getFieldConfig: (seriesIdx: number) => TimelineFieldConfig;
onHover?: (seriesIdx: number, valueIdx: number, rect: Rect) => void; onHover: (seriesIdx: number, valueIdx: number, rect: Rect) => void;
onLeave?: () => void; onLeave: () => void;
} }
/** /**
@@ -416,12 +416,11 @@ export function getConfig(opts: TimelineCoreOptions) {
if (foundAtCursor) { if (foundAtCursor) {
if (foundAtCursor !== hoveredAtCursor) { if (foundAtCursor !== hoveredAtCursor) {
hoveredAtCursor = foundAtCursor; hoveredAtCursor = foundAtCursor;
// @ts-ignore onHover(foundAtCursor!.sidx, foundAtCursor!.didx, foundAtCursor);
onHover && onHover(foundAtCursor.sidx, foundAtCursor.didx, foundAtCursor);
} }
} else if (hoveredAtCursor) { } else if (hoveredAtCursor) {
hoveredAtCursor = null; hoveredAtCursor = null;
onLeave && onLeave(); onLeave();
} }
} }
@@ -439,13 +438,12 @@ export function getConfig(opts: TimelineCoreOptions) {
if (foundAtCursor !== hoveredAtCursor) { if (foundAtCursor !== hoveredAtCursor) {
hoveredAtCursor = foundAtCursor; hoveredAtCursor = foundAtCursor;
// @ts-ignore onHover(foundAtCursor!.sidx, foundAtCursor!.didx, foundAtCursor);
onHover && onHover(foundAtCursor.sidx, foundAtCursor.didx, foundAtCursor);
} }
} else if (hoveredAtCursor) { } else if (hoveredAtCursor) {
setHoverMark(0, null); setHoverMark(0, null);
hoveredAtCursor = null; hoveredAtCursor = null;
onLeave && onLeave(); onLeave();
} }
} }
@@ -99,13 +99,16 @@ export const preparePlotConfigBuilder: UPlotConfigPrepFn<TimelineOptions> = ({
onHover: (seriesIndex, valueIndex) => { onHover: (seriesIndex, valueIndex) => {
hoveredSeriesIdx = seriesIndex; hoveredSeriesIdx = seriesIndex;
hoveredDataIdx = valueIndex; hoveredDataIdx = valueIndex;
shouldChangeHover = true;
}, },
onLeave: () => { onLeave: () => {
hoveredSeriesIdx = null; hoveredSeriesIdx = null;
hoveredDataIdx = null; hoveredDataIdx = null;
shouldChangeHover = true;
}, },
}; };
let shouldChangeHover = false;
let hoveredSeriesIdx: number | null = null; let hoveredSeriesIdx: number | null = null;
let hoveredDataIdx: number | null = null; let hoveredDataIdx: number | null = null;
@@ -123,15 +126,16 @@ export const preparePlotConfigBuilder: UPlotConfigPrepFn<TimelineOptions> = ({
updateActiveDatapointIdx, updateActiveDatapointIdx,
updateTooltipPosition updateTooltipPosition
) => (u: uPlot) => { ) => (u: uPlot) => {
if (hoveredSeriesIdx != null) { if (shouldChangeHover) {
// @ts-ignore if (hoveredSeriesIdx != null) {
updateActiveSeriesIdx(hoveredSeriesIdx); updateActiveSeriesIdx(hoveredSeriesIdx);
// @ts-ignore updateActiveDatapointIdx(hoveredDataIdx);
updateActiveDatapointIdx(hoveredDataIdx); }
updateTooltipPosition();
} else { shouldChangeHover = false;
updateTooltipPosition(true);
} }
updateTooltipPosition(hoveredSeriesIdx == null);
}; };
builder.setTooltipInterpolator(interpolateTooltip); builder.setTooltipInterpolator(interpolateTooltip);