Question

有没有办法使用chart.load（）来基于颜色数组更新颜色？

问题是，如果我删除任何先前插入的列然后再插入另一个并“重新加载”图表，则新颜色将是数组中的下一个颜色，而不是遵循真正的颜色数组序列。

实施例。颜色数组是[红色，绿色，蓝色，白色]，然后我用3列数据为图表提供数据并用红色，绿色和蓝色线正确绘制，然后我删除一列并重新加载图表（显示的线条颜色）是红色和绿色），然后我插入一个新的数据列，而不是这个新的行用蓝色绘制（这是颜色数组中的第三个）它最终用数组中的下一个颜色绘制，白色

以下是我使用的代码：

我首先使用颜色数组生成图表：

var colors= ['#1f77b4', '#aec7e8', '#ff7f0e', '#ffbb78', '#2ca02c', '#98df8a', '#d62728', '#ff9896', '#9467bd', '#c5b0d5', '#8c564b', '#c49c94', '#e377c2', '#f7b6d2', '#7f7f7f', '#c7c7c7', '#bcbd22', '#dbdb8d', '#17becf', '#9edae5']

var chart = c3.generate({
            ....
            color: {
                pattern: colors
            }
            ....
});

然后用ajax更新图表:(插入或删除列）

chart.load({
            columns: arr2,
            unload: true,
            done: function () {

            },

        });

arr2是一个多维数组，可将数据输入图表。

我在这里尝试插入：{pattern：colors}但它不起作用。

Answer 1

所以你试图将颜色分配与列的索引联系起来（因为想要一个更好的词），但是看起来c3永远不会减少它在模式数组上使用的索引。您删除数据，只在加载新数据时增加数据，并且在设置模式后无法更改？

我认为对于大多数情况（即除了删除最后一列）这是有道理的。假设您卸载了第一个数据列，您是希望第二个和第三个数据列突然切换到模式中的第一个和第二个颜色还是保留其现有颜色？我想要后者。但是在这种情况下，如果模式索引随着卸载而减少，则新加载的列将显示第3种颜色 - 已经分配 - 因此您在屏幕上有两条线/组的颜色相同。它看起来越来越像是一张地图，这导致......

如果你想要替换数据并保持相同的颜色，那么通过data.colors（复数）（http://c3js.org/samples/api_data_color.html）将每种颜色绑定到特定列的id中。这些也可以在初始化后更改，但由于它们是按列ID分配的，因此在这种情况下通常不需要这样做。

无论如何，简短的回答是有一些关于c3.js示例的问题，不，我无法通过color.pattern看到你想要的方法。这并不意味着别人不知道。垃圾回答呃; - ）

c3js - 使用chart.load（）更新带有颜色数组的图表颜色

1 个答案: