title: ChartJS not showing dynamic data from ASPX
body: <p>Actually i'm trying to show some data from mySql database in a ChartJS the problem is all data is loaded but the chart is not showing anything.</p>
  
  <p>There is no error in console or aspx i just can't get why the data is not shown.
  Even the labels are loaded and they are visible but the chart is not.
  Here is a screen of the card where there should be the chart.</p>
  
  <p><a href="https://i.stack.imgur.com/hNHjN.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/hNHjN.png" alt="enter image description here"></a></p>
  
  <p>The website is in aspx and here is the asp code to get the data:</p>
  
  <pre><code>&lt;WebMethod()&gt;
  Public Shared Function GetChart(country As String) As String
      Dim constr As String = ConfigurationManager.ConnectionStrings("myConnectionString").ConnectionString
      Using con As New MySqlConnection(constr)
          Dim query As String = String.Format("select nomeprodotto, quantita from statistica where anno = '{0}' group by nomeprodotto", country)
          Using cmd As New MySqlCommand()
              cmd.CommandText = query
              cmd.CommandType = CommandType.Text
              cmd.Connection = con
              con.Open()
              Using sdr As MySqlDataReader = cmd.ExecuteReader()
                  Dim sb As New StringBuilder()
                  sb.Append("[")
                  While sdr.Read()
                      sb.Append("{")
                      System.Threading.Thread.Sleep(50)
                      Dim color As String = [String].Format("#{0:X6}", New Random().Next(&amp;H1000000))
                      sb.Append(String.Format("text :'{0}', value:{1}, color: '{2}'", sdr(0), sdr(1), color))
                      sb.Append("},")
                  End While
                  sb = sb.Remove(sb.Length - 1, 1)
                  sb.Append("]")
                  con.Close()
                  Return sb.ToString()
              End Using
          End Using
      End Using
  End Function
  </code></pre>
  
  <p>While here is the JQuery part</p>
  
  <pre><code> $(function () {
          LoadChart();
      });
      function LoadChart() {
          $.ajax({
              type: "POST",
              url: "index.aspx/GetChart",
              data: "{country: '2011'}",
              contentType: "application/json; charset=utf-8",
              dataType: "json",
              success: function (r) {
                  $("#dvChart").html("");
                  $("#dvLegend").html("");
                  var data = eval(r.d);
                  var el = document.createElement('canvas');
                  $("#dvChart")[0].appendChild(el);
  
                  var ctx = el.getContext('2d');
  
                  var myPieChart = new Chart(ctx, {
                      type: 'pie',
                      data: data
                  });
  
                  for (var i = 0; i &lt; data.length; i++) {
                      var div = $("&lt;div /&gt;");
                      div.css("margin-bottom", "10px");
                      div.html("&lt;span style = 'display:inline-block;height:10px;width:10px;background-color:" + data[i].color + "'&gt;&lt;/span&gt; " + data[i].text);
                      $("#dvLegend").append(div);
                  }
              },
              failure: function (response) {
                  alert('There was an error.');
              }
          });
      }
  </code></pre>