Фильтрация легенды Highcharts только по видимым сериям

мы используем Highcharts и имеем некоторые сложные диаграммы с примерно 75 сериями внутри диаграммы. Серии используются не по всему графику, а только для диапазона трех месяцев. Таким образом, мы имеем около 15 серий в год, а общая диаграмма охватывает пять лет (составляет примерно 15*5 = 75 серий). Однако Highcharts отображает все 75 диаграмм в своей легенде. Цель состоит в том, чтобы свести легенду только к видимым рядам. Мы можем определить связанные серии в коде JS, и мы попытались переключите флаги "showInLegend" соответствующей серии, например

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

но без эффекта. Мы попытались перерисовать диаграмму с помощью

chart.redraw()

но это не имеет никакого эффекта...легенда остается неизменной.

поэтому вопросы:

  • можно ли перерисовать легенду на основе обновленных параметров showInLegend?
  • есть ли механизм в Highcharts для динамического обновления легенды на основе видимого серии?
8
charts highcharts

3 ответов

ну просто задание 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();

где, деталь может быть пунктом или серией

var item = chart.series[1];

Добавить Удалить Легенду Динамически | Highchart & Highstock @ jsFiddle

15

теперь это можно решить без каких-либо хаков через Series.update метод (API). Например:

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

посмотреть эта демонстрация JSFiddle. Подпись метода:

update(Object options, [Boolean redraw])

здесь options варианты для любого регулярного

5

вы можете установить showInLegend as 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);

вы забыли заставить диаграмму перерисовать.

демо

или chart.legend.allItems[1].destroy(); снять первого.

4