c# – 如何隐藏谷歌可视化中的列

发布时间：2020-12-15 22:28:53 所属栏目：百科来源：网络整理

导读：我使用下面的代码来显示谷歌图表,我想在点击第一个图表时显示另一个图表,这里需要传递值ResourceId if (resourceDetails != null){ dataTable.Columns.Add("ResourceName",typeof(string)); dataTable.Columns.Add("ResourceId",typeof(int)); dataTable.Col

我使用下面的代码来显示谷歌图表,我想在点击第一个图表时显示另一个图表,这里需要传递值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() + "','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','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('*','"');

    }
}

在这里,我使用ResouceId列将值作为参数传递,但它在图表中显示为列,如何隐藏此列？

解决方法

您可以使用 DataView Class隐藏列

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

但是,在这种情况下,使用行属性可能是有意义的
它没有出现在图表中

您可以使用定义自己的属性
setRowProperty(rowIndex,name,value)
和
getRowProperty(rowIndex,name)

DataTable Class还具有Column和Cell Properties的方法

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!