dygraphs - 禁用两个系列的图例

Question

我用图表创建了网站，生成图表我使用了dygraphs库。图表显示三个系列的数据（测量值和公差）

如何禁用公差的图例？是否可以在dygraphs中禁用一个或多个系列的图例？

Answer 1

是。如果您使用的是dygraphs 2.0或更高版本，则可以使用legendFormatter执行此操作。您可以使用legendFormatter自定义图例的格式。但是，如果您只想隐藏两个系列，最简单的方法是从series数组中删除Min和Max系列，并将其移回默认格式化程序：

g = new Dygraph(
    document.getElementById("graph"),
    "X,Y,min,max\n" +
    "1,6,3,12\n" +
    "2,3,3,12\n" +
    "3,4,3,12\n" +
    "4,6,3,12\n" +
    "5,8,3,12\n" +
    "6,10,3,12\n" +
    "7,12,3,12\n" +
    "8,10,3,12\n",
    {
      legend: 'always',
      series: {
        min: { color: 'red' },
        max: { color: 'red' },
      },
      legendFormatter: function(data) {
        data.series = [data.series[0]];  // pick whichever series you want to keep
        return Dygraph.Plugins.Legend.defaultFormatter.call(this, data);
      }
    });

请参阅fiddle。

Answer 2

您可以使用此功能来格式化图例-

LegendFormatter(data) {
if (data.x == null) {
  // This happens when there's no selection and {legend: 'always'} is set.
  return data.series.map(function(series) { 
if(series.labelHTML != 'counter_label')
return series.dashHTML + ' ' + series.labelHTML }).join(' ');
}
var html = data.xHTML;
return html;
}

以上代码将返回所有图例，但标签为“ counter_label”的系列除外。对代码进行必要的修改，以根据您的要求应用两个条件。

在定义图形时，请使用以下格式指定图形：

this.graph = new Dygraph(document.getElementById("graph_div"), 
    this.data,
    {
      legend: 'always',
      drawPoints: true,
      animatedZooms: true,
      showRoller: true,
      rollPeriod: 14,
      legendFormatter: this.LegendFormatter,
    });

在这里，legendformatter函数将用于根据需要格式化图例。