mui / mui-x

MUI X: Build complex and data-rich applications using a growing list of advanced React components, like the Data Grid, Date and Time Pickers, Charts, and more!
https://mui.com/x/
4.57k stars 1.35k forks source link

[charts] Allow to customize animation #13964

Open alexfauquette opened 4 months ago

alexfauquette commented 4 months ago

For now the animation speed is hardcoded. Would be nice to have a DX similar to Nivo:

A prop motionConfig which can contain the parameters of react-spring.

Storing this config in a context to share it accross all the components

Search keywords:

TheOneTheOnlyJJ commented 4 months ago

Would this allow for customisation similar to what's possible with chartist.js?

To be more specific, here are 2 examples:

  1. Data point animations
  2. Data axis animations

While being a much simpler library, the customisation options are among the greatest of any chart library out there. It would be a great addition to open up ours to such extensive customisation.

alexfauquette commented 4 months ago

The target of this issue was smaller. The react-spring has two parts for configuration.

  1. the speed configuration: choosing some parameter such as mass, friction, ... to indicate at which speed transition occures
  2. the state functions (from, leave, ̀enter, andupdate` ) defining what's the component style at different point of the transition

The issue was about giving access to a single configuration object for point 1. What you're proposing would require to modify the second point

GuillaumeMeheut commented 3 weeks ago

Can I get assign to this one pls

alexfauquette commented 3 weeks ago

Thanks for your interest. Notice we plan to remove providers by some store, which might impact your PR

If you're looking for something that might be on a similar level of difficulties but does not imply creating a new context, you could have a look at #12356

GuillaumeMeheut commented 3 weeks ago

Okay I'll wait for the update concerning the store since I was planning to modify the animation context.

I'll take a look at the other one