Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Hover features are not compatible with css zoom property #11900

Open
ninon69004 opened this issue Sep 16, 2024 · 0 comments
Open

Hover features are not compatible with css zoom property #11900

ninon69004 opened this issue Sep 16, 2024 · 0 comments

Comments

@ninon69004
Copy link

Expected behavior

When I'm using the CSS property zoom: 2; the hover elements of my canvas should take in account the current placement of the canvas element.
issue

The zoom property is part of the Baseline 2024.
Since May 2024, this feature works across the latest devices and browser versions.
It should be taken in account.

Current behavior

If I'm applying zoom:2; to the chart or any parent element, the hover is desynchronized from the canvas element.
It takes in account the placement of the canvas' elements without the zoom.

issue
With the image above, you can see the tooltip opened is march instead of febuary. With the image below, you can see the chart without zoom above the actual display. The moose placement is does not take in account the zoom.
issue2

Reproducible sample

https://www.chartjs.org/docs/latest/samples/bar/floating.html

Optional extra steps/info to reproduce

  1. Generate your Chart graphic
  2. Add to the container the css property: "zoom: 2;"
  3. Hover the different parts of the canvas to constat the hover is calculated with the unzoomed chart, which is not what you can see.

Possible solution

No response

Context

No response

chart.js version

4.4.2

Browser name and version

No response

Link to your project

No response

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

1 participant