Высокие диаграммы: в режиме реального времени при обновлении сплайновой диаграммы данные оси Y обнуляются - PullRequest
Новая
       27

Высокие диаграммы: в режиме реального времени при обновлении сплайновой диаграммы данные оси Y обнуляются

0 голосов
/ 12 марта 2019

Я пытаюсь отобразить набор динамических данных в диаграмме типа сплайна с использованием старших диаграмм.

Моя линейная диаграмма типа сплайна содержит 4 серии данных, которые необходимо обновить с помощью служебного вызова.Сервис возвращает массив данных, таких как [0.345, 0.465, 0, 0.453], и я хочу обновить значение y каждой серии соответствующим значением в массиве.

Но мой график не рисует данные, как ожидалось.Даже если я получаю разные значения для y, на графике он всегда отображается как 0.

Это мой исходный код.Очень признателен, если кто-то может помочь мне разобраться в этой проблеме или дать решение этой проблемы.

function drawHighChart() {
  hchart = Highcharts.chart('container', {
    chart: {
      type: 'spline',
      animation: Highcharts.svg,
      marginRight: 10,
    },

    time: {
      useUTC: false
    },

    title: {
      text: 'Audio Analytics'
    },

    xAxis: {
      tickInterval: 1,
    },

    yAxis: {
      title: {
        text: 'Prediction'
      },
      min: 0,
      max: 1,
      tickInterval: 0.5,
      plotLines: [{
        value: 0,
        width: 1,
        color: '#808080'
      }]
    },

    tooltip: {
      headerFormat: '<b>{series.name}</b><br/>',
      pointFormat: '{point.x:%Y-%m-%d %H:%M:%S}<br/>{point.y:.2f}'
    },

    legend: {
      enabled: false
    },

    exporting: {
      enabled: false
    },

    /* Initially I'm setting some hardcoded values for each series.*/
    
    series: [{
      name: 'Calm',
      data: [0.43934, 0.52503, 0.57177, 0.69658, 0.97031, 0.119931, 0.137133]
    }, {
      name: 'Happy',
      data: [0.24916, 0.24064, 0.29742, 0.0000, 0.32490, 0.0000, 0.38121]
    }, {
      name: 'Angry',
      data: [0.11744, 0.17722, 0.16005, 0.19771, 0.20185, 0.24377, 0.32147]
    }, {
      name: 'Disgust',
      data: [0.7988, 0.15112, null, 0.22452, 0.34400, null, 0.34227]
    }],

  });
}

Теперь, когда я вызываю drawHighChart() при загрузке Windows, это то, что он выводит.

enter image description here

Теперь мне нужно динамически обновлять каждую серию, когда служба возвращает массив данных.

Это моя функция, которая динамически обновляет диаграмму каждый раз, когда служба возвращает ответ.Каждый раз, когда я вызываю эту функцию, я передаю массив данных, построенный из данных ответа. 

initiVal = 7; //This is a gloabl variable that increases x-axis value from 7.

function updateHighChart(dataArray) {
  var series = hchart.series[0];
  var series1 = hchart.series[1];
  var series2 = hchart.series[2];
  var series3 = hchart.series[3];
  var x = initiVal;
  
  y = dataArray[0];
  y1 = dataArray[1];
  y2 = dataArray[2];
  y3 = dataArray[3];
  console.log("dataArray: " + dataArray);
  
  series.addPoint([x, y], true, true);
  series1.addPoint([x, y1], true, true);
  series2.addPoint([x, y2], true, true);
  series3.addPoint([x, y3], true, true);
  
  initiVal++;
}

Но даже если данные динамически назначаются значениям оси y в каждой серии, они не обновляются, как ожидается на диаграмме.Вот как диаграммы выглядят после 6-й секунды / экземпляра, когда данные должны динамически обновляться в диаграмме.

enter image description here

...