title: How to plot a date range on X-axis in Flot Charts?
body: <p>I'm using Flot charts to display data for a certain period (to be selected by the user, e.g. last 30 days, last 7 days, from 1st Jan 2013 to 3rd Mar 2013 etc)</p>
  
  <p>So I want to display a line chart with x-axis as the date.</p>
  
  <p>E.g. if I've two days, startDate and endDate how do I make the X-axis display something like:</p>
  
  <p>1 Jan 2013 | 2 Jan 2013........................3 Mar 2013</p>
  
  <p>My code is as follows:
  The data (currently it's static). </p>
  
  <pre><code>var mydata = [
                  [1, 2.4],
                  [2, 3.4 ],
                  [3, 4.5 ],
                  [4, 5 ],
                  [5,  5],
                  [6, 5],
                  [7, 2 ],
                  [8, 1 ],
                  [9, 1.5 ],
                  [10, 2.5 ],
                  [11,  3.5],
                  [12, 4 ],
                  [13, 4 ],
                  [14, 2.4],
                  [15, 3.4 ],
                  [16, 4.5 ],
                  [17, 5 ],
                  [18,  5],
                  [19, 5],
                  [20, 2 ],
                  [21, 1 ],
                  [22, 1.5 ],
                  [23,  2.5 ],
                  [24,   3.5],
                  [25,  4 ],
                  [26,  4 ],
                  [27,  2.5 ],
                  [28,   3.5],
                  [29,  4 ],
                  [30,  4 ],
              ];
  
  var plot = $.plot($("#mychart"), [{
                  data: mydata,
                  label: "Y-axis label"
              }], {
                  series: {
                      lines: {
                          show: true
                      },
                      points: {
                          show: true
                      },
                      shadowSize: 2
                  },
                  grid: {
                      hoverable: true,
                      clickable: true
                  },
                  colors: ["#37b7f3", "#d12610", "#52e136"],
                  xaxis: {
                       mode: "time", timeformat: "%d/%m/%y", minTickSize: [1, "day"]
                  },
                  yaxis: {
                      ticks: 11,
                      tickDecimals: 0,
              min:0, max: 5
                  }
              });
  </code></pre>
  
  <p>I realize that I need to make mydata look like [date, value]. Will that work?
  I've the data dynamically generated by the server in JSON in </p>
  
  <blockquote>
    <p>[{date, value}, {date, value}...]</p>
  </blockquote>
  
  <p>format. 
  Please guide.</p>