dygraph 更改每个系列的颜色

Dygraphs Change each series color

本文关键字：颜色 个系列 dygraph      更新时间：2023-09-26

我有一个用dygraphs完成的折线图，所有数据都是使用Datatable添加的，因此它具有可变数量的系列和数据点。

我只想指定每个系列的颜色。我知道我可以像这样在构造函数中使用数组。

colors:
            ["#7FFF00", "#00FFFF", "#008080", "#00BFFF", "#FFD700", "#FF69B42", "#20B2AA",
             "#FF0000", "#FFFF00", "#FF1493", "#000080", "#00FF00", "#6B8E23", "#00FA9A",
             "#B0C4DE", "#F0E68C", "#DAA520"]
        ,

但正如我之前所说，系列的数量是可变和未知的。我知道我可以像这样更新特定系列的选项：

g.updateOptions({
    'S1001': {
        strokeWidth: 10,
        drawPoints: true,
        pointSize: 4,
        highlightCircleSize: 6,
    }
});

其中 S1001 是该系列的名称，但我找不到任何更改其颜色的选项。

如果我知道系列颜色的系列 ID，如何指定系列颜色？

提前感谢，巴勃罗

编辑：好吧，我找到了一个效果很好的解决方法。我可以改变 通过在"colorsMap_"中设置值来显示系列的颜色，以及 然后重绘图形，以便：

g.colorsMap_["系列ID"] = "#FFFFFF";

g.updateOptions（"任何选项，以便重新绘制图形"）;

有没有办法重绘或刷新图表，而不是 包括调用更新选项？

谢谢！

我在尝试解决这个确切问题时来到这里，所以我正在添加一个更新的答案，希望它能帮助其他人。

从 Dygraphs 2.0（包含重大更改）开始，可以格式化单个系列。

您可以在选项中设置以下内容：

{
    series: {
        mySeriesName: {
            color: "green",    //Accepts CSS colour values.
            //There are other properties you can set too:
            strokeWidth: 3,
            drawPoints: true,
            pointSize: 5,
            highlightCircleSize: 7
        }
    }
}

将"mySeriesName"替换为 CSV 文件或标签数组中为系列指定的名称。

您可以尝试阅读有关系列选项的文档，但我个人并不觉得那么清楚。这个演示对我更有帮助。

也许回答

得太晚了，但@pablito是正确的，应该有一个使用 updateOptions 直接更改颜色的选项。目前，此功能不受支持，因此我们必须忍受黑客攻击。如果我们使用黑客 

g.colorsMap_["SeriesID"] = "#FFFFFF";
g.updateOptions({});

如上所述，它可以工作，但问题是一旦你放大或缩小，Dygraph就不会记住这些变化。要使Dygraph记住更改，请实现以下内容

g.colorsMap_["SeriesID"] = "#FFFFFF";
g.updateOptions({});
g.user_attrs_.colors[index] = "#FFFFFF"; // Where index is index number of the SeriesID
Dygraph.updateDeep(g.user_attrs_, g.user_attrs_);

您应该定义比初始构造函数中的系列更多的颜色：超出系列数的额外条目将被忽略。 稍后，当您添加系列时，将使用额外的颜色。显然，您需要决定要处理的最大系列数。

相关文章：