Графики смузи с живыми данными json - PullRequest
0 голосов
/ 20 марта 2012

Я пробую диаграммы смузи

Это вывод json с моего сервера:

{"time": "1332216212", "in": "4.52", "out": "4.85"}

Вот код, который отображает диаграмму:

<script type="text/javascript">
      var dataSet1 = new TimeSeries(), dataSet2 = new TimeSeries();

      setInterval(function() {
       $.getJSON("/stats",function(data){
        var now = new Date().getTime();
        dataSet1.append(data.time, data.in);
        dataSet2.append(data.time, data.out);
     });
     }, 1000);

 var smoothie = new SmoothieChart({ minValue: 0.0, maxValue: 1.0, millisPerPixel: 20, grid: { strokeStyle: '#555555', lineWidth: 1, millisPerLine: 1000, verticalSections: 4 }});
      smoothie.addTimeSeries(dataSet1, { strokeStyle: 'rgba(255, 0, 0, 1)', fillStyle: 'rgba(255, 0, 0, 0.2)', lineWidth: 3 });
      smoothie.addTimeSeries(dataSet2, { strokeStyle: 'rgba(0, 255, 0, 1)', fillStyle: 'rgba(0, 255, 0, 0.2)', lineWidth: 3 });
      smoothie.addTimeSeries(dataSet3, { strokeStyle: 'rgba(0, 0, 255, 1)', fillStyle: 'rgba(0, 0, 255, 0.2)', lineWidth: 3 });
      smoothie.streamTo(document.getElementById('chart'), 1000);

    </script>

Статистика пропускной способности данных Json. С помощью приведенного выше кода график не отображается. Но данные извлекаются с сервера в соответствии с журналами веб-сервера. Я использую jquery1.3.2. Я что-то не так понял?

1 Ответ

1 голос
/ 11 июля 2012

Попробуйте заменить «data.time» в функции append () для каждого набора данных на созданный вами «var now». Из моего использования с Smoothie, он действительно хочет, чтобы клиентская часть (браузер) имела дело со временем для построения графика, а не со значением, поступающим с сервера. Если вам нужна информация о времени из внешнего источника, я бы посоветовал изучить Flot, потому что это предоставит вам больше функциональности. Смузи очень простой; он просто хочет, чтобы данные отображались в реальном времени.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...