如何通过C3.js中的卸载和加载交换数据

本文介绍了如何通过C3.js中的卸载和加载交换数据的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我正在尝试交换C3.js图中的数据集。

I'm trying to swap out data sets in a C3.js graph.

我假定基于C3文档工作的代码如下所示：

The code I assumed would work based on the C3 docs looks like this:

chart.unload();
chart.load({ 
  columns: [
    ['data3', 100, 90, 80, 70, 60, 50]
  ] 
});

但这不起作用。您会注意到，在以下Plunkr上呈现的图形呈现不正确，因此我显然做错了：

But this doesn't work. You'll notice that the graph rendered on the following Plunkr renders improperly, so I'm clearly doing something wrong: https://jsfiddle.net/7rfm9om9/

在C3图表中替换数据的惯用方式是什么？

What is the idiomatic way to replace data in a C3 chart?

推荐答案

啊，看来，如果您调用 chart.unload（）会做一些异步工作。 > chart.load（）之后立即以同步方式将打破图表。

Ah, it appears that chart.unload() does some asynchronous work that, if you call chart.load() immediately after in a synchronous fashion, will break the graph.

我通过将新数据加载到传递给 chart.unload 的完成回调的函数。

I got this working by loading the new data in a function passed to chart.unload's done callback.

chart.unload({
    done: function() {
      chart.load({ 
        columns: [
          ['data3', 100, 90, 80, 70, 60, 50]
        ] 
      });  
    }
  });

工作小提琴：

这篇关于如何通过C3.js中的卸载和加载交换数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！

c3