首页 文章

仅通过可见系列过滤Highcharts的图例

提问于
浏览 次
8

我们正在使用Highcharts，并且在图表中有大约75个系列的复杂图表 . 该系列不是在整个图表中使用，而是仅在三个月的范围内使用 . 因此，我们每年大约有15个系列，整体图表涵盖五年（大约15 * 5 = 75系列） . 但是，Highcharts会在其图例中显示所有75个图表 . 目标是仅将可见系列的图例最小化 . 我们能够确定JS代码中的相关系列，并且我们试图切换相关系列的'showInLegend'标志，例如

chart.series[24].options.showInLegend = false

但没有效果 . 我们尝试使用重绘图表

chart.redraw()

但这没有效果......传说保持不变 .

所以问题是：

  • 是否可以根据更新的showInLegend选项重绘图例？

  • 在Highcharts中是否有基于可见系列动态更新图例的机制？

charts highcharts

3 回答

  • 4

    好吧，只是设置 showInLegend 不起作用，还有一些需要注意的钩子

    请参阅Halvor Strand的答案，了解更新的方法

    老技巧但仍然有效

    添加

    item.options.showInLegend = true;
chart.legend.renderItem(item);
chart.legend.render();

    删除

    item.options.showInLegend = false;
item.legendItem = null;
chart.legend.destroyItem(item);
chart.legend.render();

    其中，item可以是一个点或一系列

    var item = chart.series[1];

    Add Remove Legend Dynamically | Highchart & Highstock @ jsFiddle

    回复于
  • 15

    现在可以通过 Series.update 方法（API）解决此问题 . 例如：

    chart.series[0].update({ showInLegend: false });

    见this JSFiddle demonstration . 方法签名是：

    update(Object options, [Boolean redraw])

    options 是任何常规 Series 对象的选项 . 您可以选择暂停重绘以在重绘之前更改多个选项 .

    回复于
  • 5

    创建图表时，可以将 showInLegend 设置为 false .

    {
    name: 'Tokyo',
    data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6],
    showInLegend: false
}

    demo1

    如果要动态更新它，可以执行以下操作 .

    options.series[1].showInLegend = false;
chart = new Highcharts.Chart(options);

    你忘了强制图表重绘 .

    demo

    或 chart.legend.allItems[1].destroy(); 删除第一个 .

    回复于

相关问题