Animation upon Data Update

[DCMattyG]

Is your feature request related to a problem? Please describe.
When updating the chart data, the chart doesn't perform the animation that it does when it's first rendered. It would be really nice to have this effect each time the data is changed (ideally as a user selects options from a drop-down menu or the like).

Describe the solution you'd like
Ability to "re-draw" the chart upon data update, or have the chart perform the initial expansion animation when the data is changed.

Describe alternatives you've considered
I've attempted resetting the ref's in React, but the Chart just seems to keep appending new charts to the DOM.

Additional context
N/A

[DavidC-75]

Before anything else, I should say how much I like this very configurable and flexible sunburst-chart ! I'm still experimenting and learning, but I really like it !

I am just following up on this old question (not an issue really), because I'd like to achieve the same effect.
It is actually well illustrated by an ancestor/fork of sunburst-chart, called the Zoomable sunburst with updating data:

Can the same thing be done using the current API ? or does that require changes to the component ?

The maths involved don't really scare me - I do a lot of (much more complicated) maths everyday... However, I really don't know anything about javascript and I don't have the faintest idea about the tools needed to develop this or to debug this.... A simple example would be awsome !

[vasturiano]

@DavidC-75 if you re-instantiate the chart (as opposed to just modifying the data array input to it), it should trigger the initial build-in animation since it's in fact a completely new chart.

[DavidC-75]

Well, the idea sounds simple enough.... As I said I am a complete novice when it comes to javascript and d3. I really don't know what I'm doing.... so very possibly I made a beginner's mistake, but when re-instantiating the chart after modifying the data array, I just get new charts and new charts (as reported by the OP) as the previous instances do not get deleted.... See below.

Any suggestions ? I don't want to be asking too much, but a simple example would really be great !

[vasturiano]

Assuming you have a reference to the DOM element the chart is associated with, you can force full re-initialization of the chart by emptying the DOM element and feed it once again to the component. Something like:

// initially, just once
const myChart = Sunburst();
myChart(myElement);

// ...

// later, to re-init
myElement.innerHTML = '';
myChart(myElement);

[DavidC-75]

Yes that works nicely, thanks a lot !!