wie eine Säule von Google Visualisierung verstecken

Question

ich unten Code verwendet haben Google Chart zu zeigen, ich will eine andere Grafik zeigen, wenn sie auf den ersten Diagramm klicken und hier müssen den Wert ResourceId

if (resourceDetails != null) 
{ 
    dataTable.Columns.Add("ResourceName", typeof(string)); 
    dataTable.Columns.Add("ResourceId", typeof(int)); 
    dataTable.Columns.Add("Planned", typeof(float)); 
    dataTable.Columns.Add("Actual", typeof(float)); 

    foreach (var item in resourceDetails.Distinct().ToArray()) 
    { 
     dt = GetIndividualData(item.ResourceId, projectId); 

     if (dt.Rows.Count > 0) 
     { 
      for (int i = 0; i <= dt.Rows.Count - 1; i++) 
      { 
       DataRow row = dataTable.NewRow(); 
       row["ResourceName"] = item.ResourceName; 
       row["ResourceId"] = item.ResourceId; 
       row["Planned"] = float.Parse(dt.Rows[i]["Planned"].ToString()); 
       row["Actual"] = float.Parse(dt.Rows[i]["Actual"].ToString()); 

       dataTable.Rows.Add(row); 
      } 
     } 
    } 
    if (dataTable.Rows.Count > 0) 
    { 
     stringBuilder.Append(@"<script type=*text/javascript*> google.load(*visualization*, *1*, {packages:[*corechart*]}); 
            google.setOnLoadCallback(drawChart); 
            function drawChart() { 
            var data = new google.visualization.DataTable(); 
            data.addColumn('string', 'ResourceName'); 
            data.addColumn('number', 'ResourceId'); 
            data.addColumn('number', 'Planned'); 
            data.addColumn({type: 'string', role: 'style'}); 
            data.addColumn('number', 'Actual'); 
            data.addColumn({type: 'string', role: 'style'}); 

       "); 
     // data.addRows(" + dataTable.Rows.Count + "); 

     for (int i = 0; i <= dataTable.Rows.Count - 1; i++) 
     { 

      if (Convert.ToDecimal(dataTable.Rows[i]["Planned"]) > Convert.ToDecimal(dataTable.Rows[i]["Actual"])) 
      { 
       stringBuilder.Append("data.addRow(['" + dataTable.Rows[i]["ResourceName"].ToString() + "'," + dataTable.Rows[i]["ResourceId"].ToString() + ", " + dataTable.Rows[i]["Planned"].ToString() + ",\'color:DeepSkyBlue\'," + dataTable.Rows[i]["Actual"].ToString() + ",\'color:green\']);"); 
      } 
      else 
      { 
       stringBuilder.Append("data.addRow(['" + dataTable.Rows[i]["ResourceName"].ToString() + "', " + dataTable.Rows[i]["ResourceId"].ToString() + "," + dataTable.Rows[i]["Planned"].ToString() + ",\'color:DeepSkyBlue\'," + dataTable.Rows[i]["Actual"].ToString() + ",\'color:red\']);"); 
      } 


     } 

     stringBuilder.Append(" var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));"); 
     stringBuilder.Append(" chart.draw(data, {width: 660, height: 500, title: 'Resource-Performance Graph',"); 
     stringBuilder.Append("legend: {position: 'none'},"); 
     stringBuilder.Append("hAxis: {title: 'Resource', titleTextStyle: {color: 'green'},slantedText:true},width:'645',colors: ['DeepSkyBlue','green'],"); 

     stringBuilder.Append("vAxis:{title: 'Effort (Hr)',titleTextStyle: {color: 'green'}}"); 




     stringBuilder.Append("});"); 


     stringBuilder.Append(" google.visualization.events.addListener(chart, 'onmouseover', function() {$('#chart_div').css('cursor','pointer');});"); 

     stringBuilder.Append(" google.visualization.events.addListener(chart, 'onmouseout', function() {$('#chart_div').css('cursor','default');});"); 

     stringBuilder.Append("google.visualization.events.addListener(chart, 'select', function() {"); 

     stringBuilder.Append("var selection = chart.getSelection();var row = selection[0].row;var col = selection[0].column;var rId = data.getValue(row, 1); var pid = '" + projectId + "'; var pname = '" + projectName + "'; var resId = '" + Convert.ToInt32((Session["ResourceId"])) + "';"); 

     stringBuilder.Append("location.href = '" + ConfigurationManager.AppSettings["SiteLink"].ToString() + "/IndividualGraph.aspx?pId=' + pid + '&pName=' + pname +'&pResId=' + rId ; "); 

     stringBuilder.Append("});"); 

     stringBuilder.Append("}"); 
     stringBuilder.Append("</script>"); 
     lt.Text = stringBuilder.ToString().Replace('*', '"'); 

    } 
} 

hier passieren Ich habe verwendet ResouceId Spalte, um den Wert als Parameter übergeben, aber es zeigt im Diagramm als eine Spalte, wie kann ich ausblenden, dass diese Spalte zeigt?

Answer 1

können Sie die DataView Class verwenden, um Spalten ausblenden

var data = new google.visualization.DataTable(); 
data.addColumn('string', 'ResourceName'); 
data.addColumn('number', 'ResourceId'); 
data.addColumn('number', 'Planned'); 
data.addColumn({type: 'string', role: 'style'}); 
data.addColumn('number', 'Actual'); 
data.addColumn({type: 'string', role: 'style'}); 

var view = new google.visualization.DataView(data); 
view.hideColumns([1]); // array of column indexes to hide 

Aber es Sinn, in diesem Fall machen kann eine Reihe Property statt
zu verwenden, die in der Tabelle nicht angezeigt

Sie können festlegen, Ihre eigenen Eigenschaften mit
setRowProperty(rowIndex, name, value)
und
getRowProperty(rowIndex, name)

Die DataTable Class hat auch Methoden zur Spalte und Zelleigenschaften