title: JS chart to display values in php table
body: <p>I would like to display the values of my php table in this javascript chart. The script values for var d1 d2 and d3 is just dummy/demo. I'd like to have the month run along the x axis. I just dont know how to go about merging my php with js.</p>
  
  <p>My Table (PHP)</p>
  
  <pre><code>&lt;?php                           if ($bymonths = $db-&gt;get_results("SELECT * from vw_dash_bymonth_2012"));
                          foreach ($bymonths as $month) {
                              $startmonth = date('m-d-Y', strtotime('first day of this month', $month-&gt;realdate));
                              $endmonth = date('m-d-Y', strtotime('last day of this month', $month-&gt;realdate));
                              echo "&lt;tr&gt;
                              &lt;td&gt;&lt;a href=bymonth.php?month={$month-&gt;month1}&gt;" . date('F', $month-&gt;realdate) . "&lt;/a&gt; " . date('Y', $month-&gt;realdate) . "&lt;/td&gt;
                              &lt;td&gt;" . $month-&gt;gallons . "&lt;/td&gt;
                              &lt;td&gt;" . $month-&gt;service . "&lt;/td&gt;
                              &lt;td&gt;" . $month-&gt;average . "&lt;/td&gt;&lt;/tr&gt;";
                          }
                          ?&gt;
  </code></pre>
  
  <p>Sample JS</p>
  
  <pre><code>                &lt;script type="text/javascript"&gt;
                  $(function () {
                      var d1 = [];
                      for (var i = 0; i &lt; 14; i += 0.5)
                          d1.push([i, Math.sin(i)]);
  
                      var d2 = [[0, 3], [4, 8], [8, 5], [9, 13]];
  
                      var d3 = [];
                      for (var i = 0; i &lt; 14; i += 0.5)
                          d3.push([i, Math.cos(i)]);
  
                      $.plot($("#multiple"), [
                          {
                              label: "Gallons",
                              data: d1,
                              lines: { show: true },
                              points: { show: true, fill: true }
                          },
                          {
                              label: "Services",
                              data: d2,
                              lines: { show: true },
                              points: { show: true, fill: true }
                          },
                          {
                              label: "Average",
                              data: d3,
                              lines: { show: true },
                              points: { show: true, fill: true }
                          }
                      ]);
                  });
                  &lt;/script&gt;
  </code></pre>