You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
The X axis labels jump while a value update is animated if additionalOptions is defined, even if the options object is empty. The labels stay in their place during animation if there is no additionalOptions.
Screen.Recording.2024-09-05.at.15.05.11.mov
I've increased the Charts font size to 18px in the video to make the effect easier to see but the jumping also happens with default styles.
Expected outcome
No jumping labels
Minimal reproducible example
import { useSignal } from "@vaadin/hilla-react-signals";
import { Button } from "@vaadin/react-components";
import { Chart, ChartSeries } from "@vaadin/react-components-pro";
export default function Test() {
const value = useSignal(3);
return <>
<Button onClick={() => value.value++}>Update value</Button>
<Chart categories={["A", "B"]} additionalOptions={{}}>
<ChartSeries values={[0, value.value]} />
</Chart>
</>
}
Steps to reproduce
Click the button and notice how the x axis labels jump while animating
Change the code to remove the empty additionalOptions object
Click the button and notice that the labels no longer jump around
Environment
Vaadin 24.5.0.alpha13
Browsers
No response
The text was updated successfully, but these errors were encountered:
Seems to be related to the redraw flag. If I instead apply my options through configuration (through a ref since I'm using React), then I see similar behavior if I I do update(myOptions, true) but no jumping with update(myOptions, false).
This otherwise seems to work but has the drawback that the original configuration is seen for a fraction of a second when the chart is initially rendered before the ref callback has been run.
Description
The X axis labels jump while a value update is animated if
additionalOptions
is defined, even if the options object is empty. The labels stay in their place during animation if there is noadditionalOptions
.Screen.Recording.2024-09-05.at.15.05.11.mov
I've increased the Charts font size to
18px
in the video to make the effect easier to see but the jumping also happens with default styles.Expected outcome
No jumping labels
Minimal reproducible example
Steps to reproduce
additionalOptions
objectEnvironment
Vaadin 24.5.0.alpha13
Browsers
No response
The text was updated successfully, but these errors were encountered: