값이 잘못된 라벨로 지정되었습니다.

Question

현재 ASP.NET에서 개발 된 웹 사이트에 Google Charts API를 사용하여 막 대형 차트를 구현하고 있습니다. 나는 그 값으로 차트를 보여 주었다. 백엔드 데이터베이스에서이 값을 얻고 있습니다. 값은 다음과 같습니다.

코스 : 설정 DB에서 소매에

진행 : 설정

막대 그래프가이 페이지에 표시 될 때 지금은 데 문제가 DB

에서 에 그 다음과 같이;

과정이 진행 값을 가져옵니다.

당신의 도움이 사전에 코드는

private void BindChart() 
{ 
    DataTable dsChartData = new DataTable(); 
    StringBuilder strScript = new StringBuilder(); 

    try 
    { 
     dsChartData = GetChartData(); 

     strScript.Append(@"<script type='text/javascript'> 
       google.load('visualization', '1', {packages: ['corechart']}); </script> 

       <script type='text/javascript'> 

       function drawChart() {   
       var data = google.visualization.arrayToDataTable([ 
       ['Progression', 'Course'],"); 

     foreach (DataRow row in dsChartData.Rows) 
     { 
      strScript.Append("['" + row["Course"] + "'," + row["Progression"] + "],"); 
     } 
     strScript.Remove(strScript.Length - 1, 1); 
     strScript.Append("]);"); 

     strScript.Append(@" var options = {  
           hAxis: { 
           viewWindow: { 
           min: 0, 
           max: 100 
           }, 
           ticks: [0, 25, 50, 75, 100], 
           }, 
           title: 'My Progression (%)'  
           }; "); 

     strScript.Append(@"var chart = new google.visualization.BarChart(document.getElementById('barchart'));   
          chart.draw(data, options);   
          }  
         google.setOnLoadCallback(drawChart); 
         "); 
     strScript.Append(" </script>"); 

     ltScripts.Text = strScript.ToString(); 
    } 
    catch 
    { 
    } 
    finally 
    { 
     dsChartData.Dispose(); 
     strScript.Clear(); 
    } 
} 

그리고 데이터베이스에서 데이터를 가져 오기 위해 나는 아래의 코드를 사용하고

private DataTable GetChartData() 
{ 
    string UsrName = User.Identity.Name; 
    DataSet dt = new DataSet(); 
    try 
    { 
     using (SqlConnection conn = new SqlConnection(Common.ConnectionString)) 
     { 
      using (SqlCommand cmd = new SqlCommand("SELECT Progression,Course FROM Messages where UserName=@UserName")) 
      { 
       using (SqlDataAdapter sda = new SqlDataAdapter()) 
       { 
        SqlParameter para = new SqlParameter("UserName", UsrName); 
        cmd.Parameters.Add(para); 
        cmd.Connection = conn; 
        sda.SelectCommand = cmd; 
        sda.Fill(dt); 
       } 
      } 
     } 
    } 
    catch (Exception) 
    { 
     throw; 
    } 
    return dt.Tables[0]; 
} 

감사합니다 아래 차트에 데이터를 바인딩하려면

Answer 1

을 당신이 대부분있을 것 같아요,하지만 당신은 당신의 배열의 시작 부분에 열 이름을 교체하고 나머지 된 직후을 떠날 필요 입니다 :

strScript.Append(@"[...] 
     var data = google.visualization.arrayToDataTable([ 
      ['Course', 'Progression'],"); 

foreach (DataRow row in dsChartData.Rows) 
{ 
    strScript.Append("['" + row["Course"] + "'," + row["Progression"] + "],"); 
} 

당신은 this fiddle에이를 볼 수 있습니다

그래도 작동하지 않으면 실제 렌더링 된 JS를 페이지에 게시 해보십시오. 최종 JS에서 오류가 발생했을 때 그래프가 렌더링되지 않는다고 말하는 경우 폐쇄 형 문자열과 관련된 오류에 대한 브라우저 콘솔.

Answer 2

잘못된 방식으로 매개 변수를 추가하고 있습니다. (난 당신이 데스크톱 응용 프로그램을을 writting했다 당신이 Parameters.AddWithValue() 메소드를 사용하고 있던 가정이 Parameters.Add()보다 약간 다르다

다음과 같이 시도해보십시오.

SqlCommand command = new SqlCommand(commandText, connection); 
command.Parameters.Add("@ID", SqlDbType.Int); 
command.Parameters["@ID"].Value = customerID; 

Answer 3

을 당신은 뒤로 열을 참조하고 .

strScript.Append(@"<script type='text/javascript'> 
     google.load('visualization', '1', {packages: ['corechart']}); </script> 

     <script type='text/javascript'> 

     function drawChart() {   
     var data = google.visualization.arrayToDataTable([ 
     ['Progression', 'Course'],"); 

그러나 루프는 "진행"(COL)에서 "코스"데이터를 추가한다 : 여기

은 먼저 "진행"다음 "코스"를 지정한 "과정"열의 "진행 데이터":

foreach (DataRow row in dsChartData.Rows) 
{ 
    strScript.Append("['" + row["Course"] + "'," + row["Progression"] + "],"); 
} 

주위를 뒤집으십시오. 또한 DataRow의 열을 액세스하면 값이 object으로 반환되므로 기본 값이 무엇인지 알 수 없을 수도 있습니다. 수치를 파싱합니다.

foreach (DataRow row in dsChartData.Rows) 
{ 
    strScript.Append("[" + int.Parse(row["Progression"]) + ",'" + row["Course"] + "'],"); 
} 

한 가지 더 있습니다 .. docs에 따라, 당신은 첫 번째 행 레이블을 포함 나타 내기 위해 arrayToDataTable()에 전화로 false을 통과해야한다.이 변경 :

strScript.Append("]);"); 

이 사람 :

strScript.Append("], false);");