Хотел построить только один сплайн при загрузке диаграммы и добавить другие сплайны после загрузки

Question

Основной мультисплайн-график

HI Все, как показано на рисунке, я строю мультисплайн-график с использованием высоких графиков.То, что я хочу, это построить только «а» при загрузке графика, а остальные будут невидимы, и я мог бы добавить их позже, как это Higcharts Spline (только один) .Заранее спасибо.Этот предыдущий ответ на вопрос частично работает в моем случае, но я не хочу скрывать все серии.Я хочу иметь одну видимую серию.

Answer 1

Вы можете использовать метод Highcharts.Chart.addSeries () для динамического добавления дополнительных рядов:

HTML:

<script src="https://code.highcharts.com/highcharts.js"></script>

<div id="container"></div>
<button id="btn">Add series</button>

JS:

let data = [{
  name: 'Installation',
  data: [43934, 52503, 57177, 69658, 97031, 119931, 137133, 154175]
}, {
  name: 'Manufacturing',
  data: [24916, 24064, 29742, 29851, 32490, 30282, 38121, 40434]
}, {
  name: 'Sales & Distribution',
  data: [11744, 17722, 16005, 19771, 20185, 24377, 32147, 39387]
}, {
  name: 'Project Development',
  data: [null, null, 7988, 12169, 15112, 22452, 34400, 34227]
}, {
  name: 'Other',
  data: [12908, 5948, 8105, 11248, 8989, 11816, 18274, 18111]
}];

let btn = document.querySelector('#btn');
let i = 1;

btn.addEventListener('click', () => {
    if (i < data.length) {
    chart.addSeries(data[i]);
    i++;
  }
});

let chart = Highcharts.chart('container', {
  chart: {
    type: 'spline'
  },
  plotOptions: {
    series: {
      marker: {
        enabled: false
      },
      pointStart: 2010
    }
  },
  series: [
    data[0]
  ]
});

Демо: https://jsfiddle.net/BlackLabel/rtsznykp/3/