Calling chart.regions([...]) does not update chart - Githubissues

c3js / c3

:bar_chart: A D3-based reusable chart library

http://c3js.org

MIT License

9.34k stars 1.39k forks source link

Calling chart.regions([...]) does not update chart #2789

Open queimadus opened 4 years ago

queimadus commented 4 years ago

Quick consecutive calls to chart.regions(newRegions) do not update the chart. Even calls spaced by 1 second do not work as expected.

In this example (https://jsfiddle.net/La5mfg67/) we do the following sequence:

Set to region1. ✅
Set to []. ❌
Set to region2. ❌
Wait for 1s and set to region3. ❌
Wait for 1s and set to []. ✅
Wait for 1s and set to region4. ✅
Wait for 1s and set to region5. ❌

I was expecting:

0-1s: region2 (with maybe some flashing?)
1-2s: region3
2-3s: no regions
3-4s: region4
4-5s: region5

C3 version: 0.7.15
D3 version: 5.16.0
Browser: Chrome 83.0.4103.61
OS: MacOS Mojave 0.14.5

ebencollins commented 3 years ago

I ran into the same issue on v0.7.20, except it wasn't just quick consecutive calls that didn't work; even after many seconds had passed, a call to update with a new set of regions wouldn't cause any changes.

It seems that regions must be removed before updating (otherwise nothing changes). I had to use with chart.regions.remove() instead of chart.regions([]) to accomplish this.

Additionally, because .remove() animates by default, I had to use chart.regions.remove({'duration' : 0})

Modified example fiddle w/ workaround: https://jsfiddle.net/z7f8b9La/