Не могу сделать несколько графиков для работы с высокими графиками

Question

Я пытаюсь создать страницу, похожую на панель инструментов, используя Highcharts.На данный момент у меня есть четыре графика: два пирога и два датчика.Пожалуйста, смотрите следующий код:

<div class="main">
    <div class="dash-container">
        <div id="text">
            <div class="title">

            </div>
      </div>
        <div id="chars">
            <div id="gauge1"></div>
            <div id="pie1"></div>
        </div>
    </div>

    <div class="dash-container">
        <div id="text">
            <div id="title">

            </div>
      </div>
        <div id="chars2">
            <div id="gauge2"></div>
            <div id="pie2"></div>
        </div>
</div>

    </div>

В конце файла "body" я вызываю скрипты highcharts js:

<script src="pie.js"></script>
<script src="gauge.js"></script>
<script src="pie2.js"></script>
<script src="gauge2.js"></script>

Все выглядит хорошо.Тем не менее, я использую пример файла датчика, который меняет значения в режиме реального времени.Вот код из gauge.js:

setInterval(function() {
var point;

  point = chartSpeed.series[0].points[0];
  inc = Math.round((Math.random() - 0.5) * 100);
  newVal = point.y + inc;

  if (newVal < 0 || newVal > 200) {
      newVal = point.y - inc;
  }

  point.update(newVal);
}


}, 2000);

Проблема в том, что диаграммы двух датчиков не работают должным образом.Один завис (не будет обновлять данные), а другой обновляет данные слишком быстро.Я думаю, проблема в том, что SetInterval (Function ...) реализован как в gauge1.js, так и в gauge2.js, но я новичок в javascript и не могу понять, как это исправить.Предложения?Вы также не могли бы объяснить, как функции работают в JavaScript?Т.е. почему эта функция как-то нарушает код?

Спасибо

Answer 1

Решено: при определении диаграммы параметров есть переменная с именем "chartspeed", эта переменная имеет одинаковое имя в обеих диаграммах, изменила ее на "chartspeed2"

 var chartSpeed = Highcharts.chart('gauge2', Highcharts.merge(gaugeOptions, {
        yAxis: {
            min: 0,
            max: 200,
            title: null

и обновила gauge.js:

setInterval(function() {
var point;

  point = chartSpeed2.series[0].points[0];
  inc = Math.round((Math.random() - 0.5) * 100);
  newVal = point.y + inc;

  if (newVal < 0 || newVal > 200) {
      newVal = point.y - inc;
  }

  point.update(newVal);
}


}, 2000);