public/grafana
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

StateTimeline: fix hover overlays when browser-zoomed (#57224) (#57351)

Browse Source 
(cherry picked from commit 79afad3888)

Co-authored-by: Leon Sorokin <leeoniya@gmail.com>
This commit is contained in:
Grot (@grafanabot)
2022-10-20 08:14:13 -04:00
committed by GitHub
co-authored by Leon Sorokin
parent 7582c92f0d
commit 15557bf4af
1 changed files with 8 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/app/plugins/panel/state-timeline/timeline.ts
+8 -8
View File
@@ -13,8 +13,6 @@ const { round, min, ceil } = Math;
const textPadding = 2;
const pxRatio = devicePixelRatio;
const laneDistr = SPACE_BETWEEN;
type WalkCb = (idx: number, offPx: number, dimPx: number) => void;
@@ -103,7 +101,7 @@ export function getConfig(opts: TimelineCoreOptions) {
const size = [colWidth, Infinity];
const gapFactor = 1 - size[0];
const maxWidth = (size[1] ?? Infinity) * pxRatio;
const maxWidth = (size[1] ?? Infinity) * uPlot.pxRatio;
const fillPaths: Map<CanvasRenderingContext2D['fillStyle'], Path2D> = new Map();
const strokePaths: Map<CanvasRenderingContext2D['strokeStyle'], Path2D> = new Map();
@@ -205,7 +203,7 @@ export function getConfig(opts: TimelineCoreOptions) {
u,
sidx,
(series, dataX, dataY, scaleX, scaleY, valToPosX, valToPosY, xOff, yOff, xDim, yDim, moveTo, lineTo, rect) => {
let strokeWidth = round((series.width || 0) * pxRatio);
let strokeWidth = round((series.width || 0) * uPlot.pxRatio);
let discrete = isDiscrete(sidx);
@@ -312,7 +310,7 @@ export function getConfig(opts: TimelineCoreOptions) {
u,
sidx,
(series, dataX, dataY, scaleX, scaleY, valToPosX, valToPosY, xOff, yOff, xDim, yDim) => {
let strokeWidth = round((series.width || 0) * pxRatio);
let strokeWidth = round((series.width || 0) * uPlot.pxRatio);
let y = round(yOff + yMids[sidx - 1]);
@@ -378,6 +376,8 @@ export function getConfig(opts: TimelineCoreOptions) {
function setHoverMark(i: number, o: Rect | null) {
let h = hoverMarks[i];
let pxRatio = uPlot.pxRatio;
if (o) {
h.style.display = '';
h.style.left = round(o.x / pxRatio) + 'px';
@@ -459,8 +459,8 @@ export function getConfig(opts: TimelineCoreOptions) {
const doHover = mode === TimelineMode.Changes ? hoverMulti : hoverOne;
const setCursor = (u: uPlot) => {
let cx = round(u.cursor.left! * pxRatio);
let cy = round(u.cursor.top! * pxRatio);
let cx = round(u.cursor.left! * uPlot.pxRatio);
let cy = round(u.cursor.top! * uPlot.pxRatio);
// if quadtree is empty, fill it
if (!qt.o.length && qt.q == null) {
@@ -535,7 +535,7 @@ export function getConfig(opts: TimelineCoreOptions) {
walk(rowHeight, null, numSeries, u.bbox.height, (iy, y0, hgt) => {
// vertical midpoints of each series' timeline (stored relative to .u-over)
yMids[iy] = round(y0 + hgt / 2);
ySplits[iy] = u.posToVal(yMids[iy] / pxRatio, FIXED_UNIT);
ySplits[iy] = u.posToVal(yMids[iy] / uPlot.pxRatio, FIXED_UNIT);
});
return ySplits;