title: Update Flot plot with 2 series in realtime
body: <p>I'm working on displaying 2 time series of values using jquery and flot. I'm using them for a small period of time and for now I'm sticking to the examples. Basically I adapted several examples to extract from MySQL database the series using a PHP script that I include in the JQuery script. All works fine this far. I wish to be able to refresh this series every several seconds. This refresh doesn't seem to work and I'm not sure why. Bellow is the jquery code used to generate the graph. I put now part one of the script.</p>
  
  <pre><code>    $(function(){ 
  
    //add data source to flot. 2 datasets with same structure: data in UNIX_TIMESTAMP format, value in DECIMAL format
  
      &lt;?php include 'datasource.php'; ?&gt;;
  
    //declare datasets
  
    var datasets = {
          "temperature": {
              label: "Temperature (C)",
              data:   &lt;?php echo json_encode($dataset1); ?&gt;
          },
          "humidity": {
              label: "Humidity (%)",
              data:   &lt;?php echo json_encode($dataset2); ?&gt;
          }
      };
  
      //set fixed colors for each series
      var i = 0;
      $.each(datasets, function(key, val) {
          val.color = i;
          ++i;
      });
  
      // insert checkboxes
      var choiceContainer = $("#choices");
      $.each(datasets, function(key, val) {
          choiceContainer.append('&amp;nbsp;&amp;nbsp;&lt;input type="checkbox" name="' + key +
                                 '" checked="checked" id="id' + key + '"&gt;' +
                                 '&lt;label for="id' + key + '"&gt;'
                                  + val.label + '&lt;/label&gt;');
      });
      choiceContainer.find("input").click(plotAccordingToChoices);
      //define plot options
      var options = {series: { shadowSize: 0 },
                yaxis: { min: &lt;?php echo json_encode($mintemp) ?&gt;, max: &lt;?php echo json_encode($maxtemp) ?&gt; },
                xaxis: { show: true, mode: "time", timeformat: "%h:%M %d.%m.%y", labelWidth: "10"}};
      //draw plot
      function plotAccordingToChoices() {
               var data = [];
               choiceContainer.find("input:checked").each(function () {
               var key = $(this).attr("name");
               if (key &amp;&amp; datasets[key])
                  data.push(datasets[key]);
          });
          if (data.length &gt; 0)
             $.plot($("#placeholder"), data, options);
      }
      plotAccordingToChoices();
      //define plot refresh timeout
      setInterval(plotAccordingToChoices(), 3000);})
  </code></pre>