关注领域建模

追随UML,学会思考

gridview如何显示柱状图(如何使用绑定的值)

今天,我想在自己做的投票网站上显示柱状图,找了许多资料,终于成功!

前台页面:
    <asp:GridView ID="GridView5" runat="server" AutoGenerateColumns="False" DataSourceID="SqlDataSource5"
        ShowHeader="False" Width="370px" OnRowDataBound="GridView5_RowDataBound">
        <Columns>
            <asp:BoundField DataField="description" HeaderText="description" SortExpression="description">
                <ItemStyle Width="200px" />
            </asp:BoundField>
            <asp:BoundField DataField="total" HeaderText="total" SortExpression="total">
                <ItemStyle Width="100px" />
            </asp:BoundField>
            <asp:TemplateField>
                <ItemTemplate>---这里是第一种方式需要的咚咚,不知道取消后是否能添加。
                </ItemTemplate>
            </asp:TemplateField>
        </Columns>
    </asp:GridView>
    <asp:SqlDataSource ID="SqlDataSource5" runat="server" ConnectionString="<%$ ConnectionStrings:mwvoteConnectionString %>"
        SelectCommand="SELECT [description], [total] FROM [computersurveyitem] WHERE ([class] = @class)">
        <SelectParameters>
            <asp:Parameter DefaultValue="6" Name="class" Type="Int32" />
        </SelectParameters>
    </asp:SqlDataSource>

后台页面:
第一种:
    protected void GridView5_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.DataRow)
        {

            //可以在这里访问数据库的其它字段的值。主要是取得数据
            DataRowView gv = (DataRowView)e.Row.DataItem;
            string itemSeleted = gv.Row["total"].ToString();


            Image im = new Image();
            im.ID = "image1";
            im.ImageUrl = "~/images2/bar.gif";//一个图片,只有1px。
            im.Width = Unit.Parse(itemSeleted + "px");
            im.Height = Unit.Parse("13px");//一定要转换。今天又学了一招。
            e.Row.Cells[2].Controls.Add(im);
        }
    }

第二种:建立一个模板。(网上找到一个downdrop的例子,修改为自己用的)
public class GridViewTemplate : ITemplate
{

    private DataControlRowType templateType;

    private string columnName;

 

    public GridViewTemplate(DataControlRowType type, string colname)
    {

        templateType = type;

        columnName = colname;

    }

 

    public void InstantiateIn(System.Web.UI.Control container)
    {

        switch (templateType)
        {

            case DataControlRowType.Header:

                Literal lc = new Literal();

                lc.Text = columnName;

                container.Controls.Add(lc);

                break;

            case DataControlRowType.DataRow:

                Image image = new Image();
                image.ID = "image123";
                image.ImageUrl = "~/images2/bar.gif";
                image.Height = Unit.Parse("13px");
                container.Controls.Add(image);

                break;

            default:

                break;

        }

    }

}

protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {

            TemplateField customField = new TemplateField();
            customField.ShowHeader = false;
            customField.HeaderTemplate = new GridViewTemplate(DataControlRowType.Header, "动态添加列");
            customField.ItemTemplate = new GridViewTemplate(DataControlRowType.DataRow, "");
            customField.ItemStyle.Width = Unit.Parse("100px");
            GridView1.Columns.Add(customField);


        }


    }
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {

         if (e.Row.RowType == DataControlRowType.DataRow)
        {

            //可以在这里访问数据库的其它字段的值,网上搜索来的。
            DataRowView gv = (DataRowView)e.Row.DataItem;           
            string itemSeleted = gv.Row["total"].ToString();          
            Image dr = (Image)e.Row.FindControl("image123");//image123与模板对应起来。
            temp += itemSeleted;
            dr.Width  = Unit.Parse(itemSeleted+"px");

        }
         Label1.Text+= temp;
     

    }

第二种方法灵活度高,第一种简单。
不知道还有没有更好的方法。

posted on 2007-07-03 16:13  Beewolf  阅读(415)  评论(0编辑  收藏  举报

导航