Chart控件的使用实例

ChartTest.aspx:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ChartTest.aspx.cs" Inherits="UserManager.Test.ChartTest" %>

<%@ Register Assembly="System.Web.DataVisualization, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
    Namespace="System.Web.UI.DataVisualization.Charting" TagPrefix="asp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <center>
            <asp:ScriptManager ID="ScriptManager1" runat="server">
            </asp:ScriptManager>

        <asp:UpdatePanel runat="server">
          <ContentTemplate>
            <asp:Chart ID="Chart1" runat="server" Height="496px" Width="612px"  ImageLocation="~/TempImages/ChartPic_#SEQ(300,3)"
                BorderDashStyle="Solid" BackSecondaryColor="White" BackGradientStyle="VerticalCenter"
                BorderWidth="2px" BackColor="211, 223, 240" BorderColor="#1A3B69" 
                onclick="Chart1_Click">
                <Legends>
                    <asp:Legend IsTextAutoFit="False" Name="Default" BackColor="Transparent" TitleAlignment="Center"
                        Font="Trebuchet MS, 8.25pt, style=Bold">
                    </asp:Legend>
                </Legends>
                <BorderSkin SkinStyle="Emboss"></BorderSkin>
                <Series>
                </Series>
                <ChartAreas>
                    <asp:ChartArea Name="ChartArea1" BorderColor="64, 64, 64, 64" BorderDashStyle="Solid"
                        BackSecondaryColor="White" BackColor="64, 165, 191, 228" ShadowColor="Transparent"
                        BackGradientStyle="TopBottom">
                        <Area3DStyle Rotation="10" Perspective="10" Inclination="15" IsRightAngleAxes="False"
                            WallWidth="0" IsClustered="False"></Area3DStyle>
                        <AxisY LineColor="64, 64, 64, 64">
                            <LabelStyle Font="Trebuchet MS, 8.25pt, style=Bold" />
                            <MajorGrid LineColor="64, 64, 64, 64" />
                        </AxisY>
                        <AxisX LineColor="64, 64, 64, 64">
                            <LabelStyle Font="Trebuchet MS, 8.25pt, style=Bold" />
                            <MajorGrid LineColor="64, 64, 64, 64" />
                        </AxisX>
                    </asp:ChartArea>
                </ChartAreas>
                <Titles>
                    <asp:Title Text="我的一家" />
                </Titles>
            </asp:Chart>
            </ContentTemplate>
        </asp:UpdatePanel>
             </center>
    </div>
   
    </form>
</body>
</html>

ChartTest.aspx.cs:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Web.UI.DataVisualization.Charting;

namespace UserManager.Test
{
    public partial class ChartTest : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            
               // this.Chart1.Click += new ImageMapEventHandler(Chart1_Click);
                Series series = new Series("年龄");
                //设置图表类型
                series.ChartType = SeriesChartType.Column;
                series.BorderWidth = 7;
                series.ShadowOffset = 2;
               
                series.Points.AddY(44);
                series.Points.AddY(43);
                series.Points.AddY(24);
                series.Points.AddY(20);
                series.Points.AddY(23);

                //X轴显示的名称
                series.Points[0].AxisLabel = "爸爸";
                series.Points[1].AxisLabel = "妈妈";
                series.Points[2].AxisLabel = "陈太汉";
                series.Points[3].AxisLabel = "陈姗";
                series.Points[4].AxisLabel = "陈晓玲";

                //顶部显示的数字
                series.Points[0].Label = "44";
                series.Points[1].Label = "43";
                series.Points[2].Label = "24";
                series.Points[3].Label = "20";
                series.Points[4].Label = "23";
                //鼠标放上去的提示内容
                series.Points[0].ToolTip = "44";
                series.Points[1].ToolTip = "43";
                series.Points[2].ToolTip = "24";
                series.Points[3].ToolTip = "20";
                series.Points[4].ToolTip = "23";

                Series series1 = new Series("其他");
                series1.ChartType = SeriesChartType.Column;
                series1.BorderWidth = 3;
                series1.ShadowOffset = 2;
               
                series1.Points.AddY(144);
                series1.Points.AddY(143);
                series1.Points.AddY(124);
                series1.Points.AddY(120);
                series1.Points.AddY(123);
               
                series1.Points[0].Label = "144";
                series1.Points[1].Label = "143";
                series1.Points[2].Label = "124";
                series1.Points[3].Label = "120";
                series1.Points[4].Label = "123";
                series1.Points[0].ToolTip = "144";
                series1.Points[1].ToolTip = "143";
                series1.Points[2].ToolTip = "124";
                series1.Points[3].ToolTip = "120";
                series1.Points[4].ToolTip = "123";
                series1.YAxisType = AxisType.Primary;
                series1.YValueType = ChartValueType.Time;
                Chart1.Series.Add(series);
                Chart1.Series.Add(series1);
                //按照升序的方式排列
                Chart1.Series[0].Sort(PointSortOrder.Ascending);
                Chart1.Series[1].Sort(PointSortOrder.Ascending);
 
                foreach(Series serie  in Chart1.Series)
                {
                    serie.PostBackValue = "#AXISLABEL" + ";#INDEX";
                }
             
        }

       protected void Chart1_Click(object sender, ImageMapEventArgs e)
        {
            string str = e.PostBackValue;
        }
 
    }
}
posted @ 2014-02-20 08:15  汪强胜  Views(785)  Comments(0Edit  收藏  举报