JavaScript charts - dynamically adding data points

StackOverflow https://stackoverflow.com/questions/2119465

Question

I am trying to dynamically add data points to jqplot as a result of AJAX received data, but I do not see a way to accomplish this. Is this not possible?

If it isn't, what other packages are available that can accomplish the same basic graphing plus allow for dynamic data?

Was it helpful?

Solution

You may want to check the example below on how this is handled in Flot. Flot is an open-source plotting library based on jQuery, like jqplot. Both libraries are very similar.

This is how fetching and plotting the data with AJAX would look like in code:

function fetchData() {
   $.ajax({
      url:      "json_fetch_new_data.php",
      method:   "GET",
      dataType: "json",
      success:  function(series) {
         var data = [ series ];

         $.plot($("#placeholder"), data, options);
      }
   });

   setTimeout(fetchData, 1000);
}

Make sure to check the following demo to see it in action:

For further information on Flot:

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top