文字列にプロパティ 'データセット'を作成できません

Question

Charts.jsに行っています.netコードからのデータを使用したいときに問題にぶつかりました。クライアント側では

<WebMethod()> 
Public Shared Function GetChart() As String 

    Dim sData As String = "" 
    Dim sColor As String = "" 
    Dim sLabel As String = "" 


    '.... reading my db stuff .... 

    Dim sReturn As String = "" 
    sReturn = sReturn & " labels: [ " 
    sReturn = sReturn & sLabel.Remove(sLabel.Length - 1, 1) 
    sReturn = sReturn & " ], " 

    sReturn = sReturn & " datasets: [{ data: [" 
    sReturn = sReturn & sData.Remove(sData.Length - 1, 1) 
    sReturn = sReturn & " ], " 
    sReturn = sReturn & " backgroundColor: [ " 
    sReturn = sReturn & sColor.Remove(sColor.Length - 1, 1) 
    sReturn = sReturn & " ] " 
    sReturn = sReturn & " }] " 

    Return sReturn 

End Function 

この

<script type="text/javascript"> 
$(function() { 
LoadChart(); 

}); 
function LoadChart() { 

    var ctx = document.getElementById("chart-area").getContext('2d'); 


$.ajax({ 
    type: "POST", 
    url: "_TempEntrada.aspx/GetChart", 
    contentType: "application/json; charset=utf-8", 
    dataType: "json", 
    success: function (r) { 
     var config = { 
      type: 'doughnut', 
      data: r.d, 
      options: { 
       responsive: true, 
       legend: { 
        position: 'top', 
       }, 
       title: { 
        display: true, 
        text: 'Chart.js Doughnut Chart' 
       }, 
       animation: { 
        animateScale: true, 
        animateRotate: true 
       } 
      } 
     }; 

     var myDoughnutChart = new Chart(ctx, config); 



    }, 
    failure: function (response) { 
     alert('There was an error.'); 
    } 
}); 
} 
</script>  

を使用しているとき、私はこのエラーを取得しています：Chart.bundle.js：8152キャッチされない例外TypeErrorを：文字列 'ラベルのプロパティ 'データセット' を作成できません：[ " 1データセット：[8,1,1]、backgroundColor：["＃41F22B"、 "＃41F22B"、 "＃41F22B"]}]、[1 Empresa]、[2 ServicioPúblico] ' at initConfig（Chart.bundle.js：8152）

"data：rd"をサーバーから取得したデータで変更すると正常に動作します。私はとか、{せずに帰国しようとした}と、それはどんな違いがありませんでした

data: {labels: ["1 Empresa", "2 Servicio Público", "3 Particular"], datasets: [{ data: [8, 1, 1], backgroundColor: ["#8215C8", "#8215C8", "#8215C8"] }] }, 

Answer 1

私はここに私の問題

を固定している新しいサーバーコードです：

<WebMethod()> 
Public Shared Function GetChart() As List(Of Object) 

    Dim iData As New List(Of Integer)() 
    Dim sColor As New List(Of String)() 
    Dim sLabel As New List(Of String)() 
    Dim chartData As New List(Of Object)() 

    Dim objConn As New SqlConnection(ConfigurationManager.ConnectionStrings("conProcase").ToString) 
    objConn.Open() 

    Try 

     '... my db stuff 

     Do While objRdr.Read() 
      iData.Add(Convert.ToInt32(objRdr("iCount"))) 
      sColor.Add([String].Format("#{0:X6}", New Random().Next(&H1000000))) 
      sLabel.Add(objRdr("Co_Desc")) 

     Loop 

     objRdr.Close() 


    Catch ex As Exception 


    Finally 

     If Not IsNothing(objConn) Then 
      objConn.Close() 
      objConn = Nothing 
     End If 

    End Try 

    chartData.Add(iData) 
    chartData.Add(sColor) 
    chartData.Add(sLabel) 

    Return chartData 


End Function 

はjqueryの側：

function LoadChart() { 

    var ctx = document.getElementById("chart-area").getContext('2d'); 


$.ajax({ 
    type: "POST", 
    url: "_TempEntrada.aspx/GetChart", 
    contentType: "application/json; charset=utf-8", 
    dataType: "json", 
    success: function (r) { 
      var sData = 
      { 
       labels: r.d[2] , 
       datasets: [ 
        { 
         backgroundColor: r.d[1], 
         data: r.d[0] 
        }, 

       ] 
      }; 

     var config = { 
      type: 'doughnut', 
      data:sData, 
      options: { 
       responsive: true, 
       legend: { 
        position: 'top', 
       }, 
       title: { 
        display: true, 
        text: 'Chart.js Doughnut Chart' 
       }, 
       animation: { 
        animateScale: true, 
        animateRotate: true 
       } 
      } 
     }; 

     var myDoughnutChart = new Chart(ctx, config); 



    }, 
    failure: function (response) { 
     alert('There was an error.'); 
    } 
}); 
}