Skip to content

fix: keep the axis pointer on the mouse - #1958

Open
KapJI wants to merge 2 commits into
fluidd-core:developfrom
KapJI:fix/thermal-chart-axis-pointer
Open

KapJI wants to merge 2 commits into
fluidd-core:developfrom
KapJI:fix/thermal-chart-axis-pointer

Conversation

@KapJI

@KapJI KapJI commented Sep 19, 2026

Copy link
Copy Markdown
Contributor

Each data update calls setOption, which clears the highlight the axis pointer put on each series. The symbols at the pointer vanish at the next update, within a second, and stay gone until the pointer moves to another sample. The axis pointer still records those samples as highlighted, so it never restores them itself. Its line also stays on the sample it last snapped to, so with the mouse still it scrolls away with the data.

After each data update the chart now resets the axis pointer (updateAxisPointer with currTrigger: 'leave') and shows it again at the mouse position (showTip), so the symbols come back and the line snaps back to the sample nearest the mouse.

Before (symbols disappear, axis drifts):

axis_pointer_before-github.mp4

After:

axis_pointer_after-github.mp4

@KapJI
KapJI force-pushed the fix/thermal-chart-axis-pointer branch from 6ecd324 to 58b3985 Compare September 19, 2026 17:36
@github-actions

github-actions Bot commented Sep 19, 2026

Copy link
Copy Markdown

Bundle size report (gzip)

Chunk Base Head Δ
assets/Dashboard-*.js 63.2 kB 63.3 kB +154 B
sw.js 11.2 kB 11.2 kB +7 B
assets/Timelapse-*.js 1.9 kB 1.9 kB -4 B
assets/Tune-*.js 3.4 kB 3.4 kB -3 B
assets/AfcPrintStartDialogTool-*.js 2.3 kB 2.3 kB -2 B
assets/AppBtnCollapseGroup-*.js 640 B 638 B -2 B
assets/AppColorPicker-*.js 13.0 kB 13.0 kB -2 B
assets/Configure-*.js 776 B 774 B -2 B
assets/Diagnostics-*.js 15.9 kB 15.9 kB -2 B
assets/GcodePreview-*.js 366 B 368 B +2 B
assets/Icons-*.js 530 B 528 B -2 B
assets/JobHistoryItemStatus-*.js 1.2 kB 1.2 kB -2 B
assets/Jobs-*.js 501 B 499 B -2 B
assets/NotFound-*.js 438 B 436 B -2 B
assets/Settings-*.js 23.3 kB 23.3 kB -2 B
assets/TimelapseRenderSettingsDialog-*.js 1.8 kB 1.8 kB -2 B
assets/BeaconCard-*.js 4.3 kB 4.3 kB -1 B
assets/Console-*.js 366 B 365 B -1 B
assets/DiskUsageCard-*.js 3.2 kB 3.2 kB -1 B
assets/FileSystem-*.js 31.5 kB 31.5 kB -1 B
assets/GcodePreviewCard-*.js 13.2 kB 13.2 kB -1 B
assets/History-*.js 3.8 kB 3.8 kB -1 B
assets/MacroCategorySettings-*.js 2.0 kB 2.0 kB -1 B
assets/System-*.js 2.3 kB 2.3 kB -1 B
Total 2.9 MB 2.9 MB +126 B

119 chunks compared, 24 changed. Sizes are gzip, matching what nginx serves.

Signed-off-by: Ruslan Sayfutdinov <ruslan@sayfutdinov.com>
@KapJI
KapJI force-pushed the fix/thermal-chart-axis-pointer branch from 58b3985 to a5a21b8 Compare September 22, 2026 18:07
@KapJI

KapJI commented Sep 22, 2026

Copy link
Copy Markdown
Contributor Author

Hi @pedrolamas, rebased on the latest develop. Does this approach look ok to you? #1959 sits on top of it.

@pedrolamas
pedrolamas requested a lite review from Copilot September 23, 2026 08:18
@pedrolamas pedrolamas added the UI - QoL Improvements to the UI label Sep 23, 2026

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copilot review overview

🟢 Approval recommended

The change is localized to the thermals chart update path and addresses the described ECharts interaction regression without introducing broader behavioral risk.

Review effort: Lite
Findings: 1 Low severity

Open (1)
What changed in this PR

Keeps ECharts’ axis pointer/tooltip “locked” to the mouse position across frequent setOption dataset updates in the Thermals widget, so highlighted symbols and the pointer line don’t disappear/drift while the mouse is stationary.

Changes:

  • Track the latest mouse position via ZRender events (zr:mousemove / zr:globalout).
  • After each dataset update, reset the axis pointer state and re-show the tip at the stored mouse coordinates.
File Description
src/​components/​widgets/​thermals/​ThermalChart.vue Captures mouse coordinates and re-dispatches axis-pointer/tooltip actions after dataset updates to preserve highlight behavior.

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

Comment thread src/components/widgets/thermals/ThermalChart.vue
Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>
Signed-off-by: Pedro Lamas <pedrolamas@gmail.com>
@KapJI

KapJI commented Sep 23, 2026

Copy link
Copy Markdown
Contributor Author

Btw, I found this reported upstream as apache/echarts#20588, open since Dec 2024. The cause is the FIXME in dispatchHighDownActually (axisTrigger.js): it keeps its own record of highlighted samples that setOption never clears, and updateAxisPointer with currTrigger: 'leave' is the cleanest public way to reset it.

This branch has not been deployed

No deployments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

UI - QoL Improvements to the UI

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants