title: ASP.NET MVC Mismatch error on a google chart
body: <p>I'm running into an javascript error with google charts. I've got this to work with a different query but I need the result of the query below to be displayed. The problem as of now is that the chart is not appearing. Any thoughts on debugging this?</p>
  
  <pre><code>Uncaught (in promise) Error: Type mismatch. Value 1 does not match type string in column index 0
  </code></pre>
  
  <p>Here's my Controller: </p>
  
  <pre><code>  #region Total Hours Per Month
          var querythpmpro = (from r in db.HolidayRequestForms
                              where r.EmployeeID == id
                              group r by r.MonthOfHoliday into g
                              select new { Value = g.Key, Count = g.Sum(h =&gt; h.HoursTaken) }
                             ).OrderBy(e =&gt; e.Value);
  
  
          var resultthpmpro = querythpmpro.ToList();
  
          var datachartthpmpro = new object[resultthpmpro.Count];
          int Q = 0;
          foreach (var i in resultthpmpro)
          {
              datachartthpmpro[Q] = new object[] { i.Value, i.Count};
              Q++;
          }
          string datathpmpro = JsonConvert.SerializeObject(datachartthpmpro, Formatting.None);
          ViewBag.datajthpmpro = new HtmlString(datathpmpro);
  
          #endregion
  </code></pre>
  
  <p>And my script: </p>
  
  <pre><code> &lt;script&gt;
  var datathpmpro = '@ViewBag.datajthpmpro';
  var datassthpmpro = JSON.parse(datathpmpro);
   &lt;/script&gt;
  
    &lt;script type="text/javascript"&gt;
  
  // Load the Visualization API and the corechart package.
  google.charts.load('current', { 'packages': ['corechart'] });
  
  // Set a callback to run when the Google Visualization API is loaded.
  google.charts.setOnLoadCallback(drawChartA);
  
  // Callback that creates and populates a data table,
  // instantiates the pie chart, passes in the data and
  // draws it.
  function drawChartA() {
  
      // Create the data table.
  
      var data = new google.visualization.DataTable();
      data.addColumn('string', 'Value');
      data.addColumn('number', 'Count');
      data.addRows(datassthpmpro);
  
      // Set chart options
      var options = {
          'title': 'Holiday Hours Taken Per Month',
          'width': 600,
          'height': 350,
          'hAxis': {title: 'Month Number'},
          'vAxis': {title: 'Holiday Hours Taken'},
          'is3D': true,
          'legend': 'none'
      };
  
      // Instantiate and draw our chart, passing in some options.
      var chart = new google.visualization.LineChart(document.getElementById('chartTHPMpro_div'));
      chart.draw(data, options);
  }
  </code></pre>
  
  <p></p>
  
  <p>I'd like the result to have a google chart appear that uses the query above. </p>