Open myktra opened 7 years ago
Potentially related to https://github.com/c3js/c3/issues/1527.
I found a quick workaround for a demo. Until c3 fixes this on their end, this will at least cause the regions to update as expected.
updateChart(config) {
if (!this.chart) {
this.chart = this.generateChart(findDOMNode(this), config);
}
if (config.unloadBeforeLoad) {
this.unloadData();
}
// If there are regions in the config, update them.
// If there are regions on the chart, and the config specifies none
// then delete the existing regions.
if (config.regions) {
this.chart.regions(config.regions);
} else if (this.chart.regions && !config.regions){
this.chart.regions([]);
}
this.loadNewData(config.data);
}
The c3 docs state that calling unload
just before load
will not work properly, as it will occur in the midst of the animation.
http://c3js.org/reference.html#api-unload
If you call load API soon after/before unload, unload param of load should be used. Otherwise chart will not be rendered properly because of cancel of animation.
I haven't tested this yet, but I think what should be done instead is pass unload: true
when loading:
http://c3js.org/reference.html#api-load
If unload given, data will be unloaded before loading new data. If true given, all of data will be unloaded.
Hence it should work like this:
updateChart(config) {
if (!this.chart) {
this.chart = this.generateChart(findDOMNode(this), config);
}
let data = config.data;
if (config.unloadBeforeLoad) {
data = { ...data, unload: true };
}
this.loadNewData(data);
}
I'm not using regions, so I'm not sure if my changes fix that. However I did verify that using load with unload: true
does fix my issue with data not updating properly. Potentially both changes may be needed.
Seems like unlike properties like
axis
andgrid
, changingregions
neither removes any previous regions that were drawn the first time the C3Chart component was rendered nor renders the new ones.Adding
this.chart.regions.remove()
tocomponentWillUpdateProps
removes the regions but then new regions that are specified are not redrawn when C3Chart is re-rendered.In a perhaps related observation, passing the
unloadBeforeLoad
prop doesn't seem to work for me...rendering seems unpredictable.