title: How to make the Chart.js usable with my own data
body: <p>I have the following Chart.js JavaScript code:</p>
  
  <pre><code>var barChartTickets =
  {
      labels: [ 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31 ],
      datasets: [{
          fillColor: "rgba(220,220,220,0.5)",
          strokeColor: "rgba(220,220,220,0.8)",
          highlightFill: "rgba(220,220,220,0.75)",
          highlightStroke: "rgba(220,220,220,1)",
          data: [ '1', '0', '1', '0', '0', '0', '1', '0', '0', '0', '0', '0', '0', '1', '0', '0', '0', '0', '0', '0', '0', '0', '0', '0', '0', '0', '0', '0', '0', '0', '0' ]             
      }]      
  }
  </code></pre>
  
  <p>And this function:</p>
  
  <pre><code>window.onload = function() {        
      if ($('#reportTickets').length) {
          var ctx = document.getElementById("reportTickets").getContext("2d");
          window.myBar = new Chart(ctx).Bar(barChartTickets, {
              responsive: true
          });     
      }
  }
  </code></pre>
  
  <p>I have a database table that has <code>client_date</code> and <code>client_id</code>.</p>
  
  <p>How can I make the data dynamically used?</p>