title: How to bind dynamic data in bar chart using ajax call in mvc c#?
body: <p>I am try for the show last 7 days count in the bar charts. For that I am used bar charts and ASP.NET MVC and C#. Now in this page I have added static bar charts show now I want to this chart create dynamic in the chart x axis on the set date. </p>
  
  <p>Here below my table data to show:</p>
  
  <pre><code>DateColumn | Count
  09-05-2017    10
  08-05-2017    05
  07-05-2017    20
  06-05-2017    4000
  05-05-2017    30
  04-05-2017    5000
  03-05-2017    40
  </code></pre>
  
  <p>This is my data come from the table in SQL Server using a stored procedure.</p>
  
  <p>Here this is my html page code => </p>
  
  <pre><code> &lt;div class="box box-without-bottom-padding"&gt;            
          &lt;canvas id="myChart"&gt;&lt;/canvas&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>this is my script code =></p>
  
  <pre><code>    &lt;script type="text/javascript"&gt;
      $(document).ready(function () {        
      $.ajax({
          url: 'Home/GetCount',
          dataType: "json",
          type: "GET",
          contentType: 'application/json; charset=utf-8',
          async: false,
          processData: false,
          cache: false,
          delay: 15,
          success: function (data) {
              for (var i in data) {
                  // here come the data as object in the object 2 value 1 is datecolumn and 2 is total count.
  
              }
              AutoFollow();
          },
          error: function (xhr) {
              alert('error');
          }
      });
  });
  
  
  function AutoFollow()
  {
      var ctx = document.getElementById("myChart").getContext('2d');
      var myChart = new Chart(ctx, {
          type: 'bar',
          data: {
              labels: ["M", "T", "W", "T", "F", "S", "S"], // here i want to show my date value
              datasets: [{
                  label: 'AutoFollow',
                  data: [12, 19, 3, 17, 28, 24, 7], // here show my total count date wise 
                  backgroundColor: "rgba(153,255,51,1)"
              }, {
                  label: 'Manual',
                  data: [30, 29, 5, 5, 20, 3, 10],
                  backgroundColor: "rgba(255,153,0,1)"
              }]
          },            
      });
  }
  </code></pre>
  
  <p></p>
  
  <p>this is my static chart sketch =></p>
  
  <p><a href="https://i.stack.imgur.com/mGVb3.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/mGVb3.png" alt="enter image description here"></a></p>
  
  <p>show here above my static charts can you please any one know how can set my own data in the charts.</p>