Make bar charts animate

[darabos]

Resolvesplotly#1019. So far this is just a revival of @rreusser's plotly#1647. Probably with the same TODOs, maybe more. I just moved a bunch of code into plotOne() and it works!

[etpinard]

@darabos nice job! All tests are passing.

I won't have the chance to test all the barmode combinations out until 1.42.0 is released, but this is a solid start!

Here's how the animation.json mock with bar traces instead of scatter trace looks:

[darabos]

I've got an embarrassing question. 😊 How do I switch between the different frames in that test?

[etpinard]

How do I switch between the different frames in that test?

entering Plotly.animate(gd) in the console should do it.

You can checkout the jsdoc:

https://github.com/plotly/plotly.js/blob/5cc37e3504cfa4c1cf1bd632a97b66252126d99a/src/plot_api/plot_api.js#L2656-L2682

or https://plot.ly/javascript/animations/ for more info.

[saebaxp]

Thanks for the great work guys!
Has this been merged yet?
Can wait to start animating bar charts...

[darabos]

Thanks for the great work guys!
Has this been merged yet?

No, I still have to fix the issue that's visible in @etpinard's animation and then ask for a review. Sorry, I kind of forgot about this over the holidays, but I'll try to pick it up this week or next.

Can wait to start animating bar charts...

Right, I really want this too! ❤️

[darabos]

Sorry about the delay. I've merged with current master (the conflict wasn't too bad thankfully) and I think I've fixed the issue where the new bar was added at the end instead of in the proper place.

That looks better now! There is a jump at the end after the axis transition, but I also see that with the scatterplot animation.

Do you have ideas for what else to test? Thanks!

[raulhuelamo]

This is looking swell, thanks for the good work! I'm using plotly.js for the first time to build some charts, and I was just curious about the state of the animations. I've used your branch to test a simple chart, and just wanted to drop a GIF with an issues I've found: Bars with starting or ending value = 0 are rendered without an animation.

I've done some tests with barmode: 'stack', and apart from the issue mentioned above, it looks great.

Keep up the good work! Looking forward to see this polished and merged into master.

[darabos]

This is looking swell, thanks for the good work! I'm using plotly.js for the first time to build some charts, and I was just curious about the state of the animations. I've used your branch to test a simple chart, and just wanted to drop a GIF with an issues I've found: Bars with starting or ending value = 0 are rendered without an animation.

Thanks! I've committed a simple fix for that. But I'll have to check the full test suite to see if it has any unintended consequences.

I've done some tests with barmode: 'stack', and apart from the issue mentioned above, it looks great.

Unfortunately your GIFs don't load for me, but thanks for checking! I forgot about stacked charts... I better add a test for that.

I've also added a simple test to see if bars get added/removed correctly. (I've seen some issues with that when trying this change in our production system.) But this test seems completely broken. 😓 I'll have to debug a bit more.

[etpinard]

Thanks for your hard work @darabos !

Unfortunately I probably won't have time to look at this PR in detail in the next couple week. I'll try, but I won't guarantee anything.

[jklimke]

Is there any progress with that feature ? currently the brach has conflicts with the current master of plotly.js.

[darabos]

Is there any progress with that feature ? currently the brach has conflicts with the current master of plotly.js.

Sorry I haven't finished it! I've switched to a non-dashboard project at work, so I could only finish this in my free time now. I'll try to fire up some enthusiasm for this in our dashboard team. Hopefully I can find someone to move this forward!

[etpinard]

A first version of animatable bar traces got merged in plotly#4180 and is set to be released in plotly.js v1.50.0.

Sorry for delay. I hope you'll like this new feature.

[darabos]

A first version of animatable bar traces got merged in plotly#4180 and is set to be released in plotly.js v1.50.0.

Wow, that's fantastic! 🎉 Thanks!