0

I'm trying out smoothies charts

This is the json output from my server:

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

Here is the code that renders the chart:

<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 data bandwidth stats. With the above code the graph doesn't get rendered. But the data gets fetched from the server according to web server logs. I'm using jquery1.3.2. Have I got anything wrong?

YakovL
  • 7,557
  • 12
  • 62
  • 102
nixnotwin
  • 2,343
  • 8
  • 30
  • 46

1 Answers1

1

Try replacing 'data.time' in the append() function for each dataSet with your 'var now' you created. From my usage with Smoothie, it really wants the client-side (browser) to deal with the time for the graphing, rather than a value coming in off a server. If you need time information from an external source, then I'd suggest looking into Flot, because that will provide you with more functionality. Smoothie is very basic; it just wants data to plot on a real-time timeline.

Dan C.
  • 11
  • 1