在ASP.NET中填充GridView中的图表

时间:2011-06-13 08:48:26

标签: c# asp.net data-binding gridview asp.net-charts

我有一个GridView控件,我需要显示有关我的一些重要变量的一些信息。这些变量在时间上有所不同,我想将表中的趋势绘制为使用Chart控件的最后一列。

以下是代码的通用视图:

<asp:GridView runat="server" ID="Variables_GridView" CssClass="grid" AutoGenerateColumns="false" Width="100%">
   <FooterStyle BackColor="White" ForeColor="#000066" />
   <HeaderStyle CssClass="gridheader" />
   <RowStyle ForeColor="#000066" />
   <SelectedRowStyle BackColor="#669999" Font-Bold="True" ForeColor="White" />
   <SortedAscendingCellStyle BackColor="#F1F1F1" />
   <SortedAscendingHeaderStyle BackColor="#007DBB" />
   <SortedDescendingCellStyle BackColor="#CAC9C9" />
   <SortedDescendingHeaderStyle BackColor="#00547E" />
   <Columns>
      <asp:BoundField DataField="VariableName" HeaderText="Name" />
      <asp:BoundField DataField="VariableType" HeaderText="Type" />
      <asp:BoundField DataField="VariableDescription" HeaderText="Description" />
      <asp:TemplateField HeaderText="Latest values">
         <ItemTemplate>
            <asp:Chart ID="Values_Chart" runat="server" Width="150" Height="50">
               <Series>
                  <asp:Series Name="Values_Series" XAxisType="Primary" XValueType="Int32" ChartType="Line"></asp:Series>
               </Series>
               <ChartAreas>
                  <asp:ChartArea Name="Values_ChartArea"></asp:ChartArea>
               </ChartAreas>
            </asp:Chart>
         </ItemTemplate>
      </asp:TemplateField>
   </Columns>
</asp:GridView>

在我的代码隐藏中,您可以找到这种类型,用于映射属性的类型(我指定的类型):

public class VariableRepresentation {

        private string variableName;

        private string variableType;

        private string variableDescription;

        private float[] variableValues;

        public string VariableName {
            get { return this.variableName; }
            set { this.variableName = value; }
        }

        public string VariableType {
            get { return this.variableType; }
            set { this.variableType = value; }
        }

        public string VariableDescription {
            get { return this.variableDescription; }
            set { this.variableDescription = value; }
        }

        public float[] VariableValues {
            get { return this.variableValues; }
            set { this.variableValues = value; }
        }

        public VariableRepresentation(string name, string type, string description) {
            this.variableName = name;
            this.variableType = type;
            this.variableDescription = description;
        }

        public VariableRepresentation(string name, string type, string description, float[] initialValues) : this(name, type, description) {
            this.variableValues = initialValues;
        }

    }

OK!

在本页的加载方法中,我有以下内容:

protected void Page_Load(object sender, EventArgs e) {
   VariableRepresentation[] vars = new VariableRepresentation[6];
   vars[0] = new VariableRepresentation("Variable 1", 
      "Type 1", "A generic variable", new float[] { 11, 12, 13, 14, 11, 20 });
   vars[1] = new VariableRepresentation("Variable 2", 
      "Type 2", "A generic variable", new float[] { 11, 12, 13, 14, 11, 20 });
   vars[2] = new VariableRepresentation("Variable 3", 
      "Type 3", "A generic variable", new float[] { 11, 12, 13, 14, 11, 20 });
   vars[3] = new VariableRepresentation("Variable 4", 
      "Type 1", "A generic variable", new float[] { 11, 12, 13, 14, 11, 20 });
   vars[4] = new VariableRepresentation("Variable 5", 
      "Type 2", "A generic variable", new float[] { 11, 12, 13, 14, 11, 20 });
   vars[5] = new VariableRepresentation("Variable 6", 
      "Type 3", "A generic variable", new float[] { 11, 12, 13, 14, 11, 20 });
   this.Variables_GridView.DataSource = vars;
   this.Variables_GridView.DataBind();
}

好吧,你可以想象,输出是一张表,但我的图表是空的。我怎么能在.aspx文件中,在xhtml标记中,我展示的第一个代码,让这种情况发生?

我想我在模板字段中放置了一些数据绑定表达式,但我不知道该放在那里....

你能帮我吗?

三江源

PS: 请注意,我这里没有提供解决方案,问题是我不知道如何将数据连接到图表,实际上图表(每个表行一个)没有显示是正确的,因为我没有指定aspx页面中的任何绑定表达式,也不是代码隐藏中的正确代码段。

1 个答案:

答案 0 :(得分:3)

我不知道是否有一种方便的方法可以直接在XHTML中将数据绑定到图表系列中?但也许你可以在GridView.RowDataBound上创建一个事件,在那里找到Chart Control然后将数据附加到图表系列中?