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;
        }
 
    }
}


本文转自啊汉博客园博客,原文链接:http://www.cnblogs.com/hlxs/archive/2010/11/08/2087991.html

目录
相关文章
|
7月前
216Echarts - 拖拽(Gautt Chart of Ariport Flights)
216Echarts - 拖拽(Gautt Chart of Ariport Flights)
20 0
|
10月前
Echarts组件legend属性显示数据和icon图片自定义的解决方案
Echarts组件legend属性显示数据和icon图片自定义的解决方案
164 0
|
5月前
Echarts tooltip配置项的属性 图表悬浮框
Echarts tooltip配置项的属性 图表悬浮框
|
7月前
196Echarts - 自定义系列(Gautt Chart of Ariport Flights)
196Echarts - 自定义系列(Gautt Chart of Ariport Flights)
19 0
|
索引
PyQt5 技术篇-QComboBox下拉框绑定监听事件实例演示
PyQt5 技术篇-QComboBox下拉框绑定监听事件实例演示
1036 0
|
JSON 前端开发 JavaScript
如何在SAP WebClient UI里创建柱状图(bar chart)
如何在SAP WebClient UI里创建柱状图(bar chart)
134 0
如何在SAP WebClient UI里创建柱状图(bar chart)
|
移动开发 小程序 JavaScript
一个工具函数,实现页面tooltip组件的限制使用
有这样一个需求:页面已经写了太多的详情表单元素,并且每一个表单元素都使用了Tooltip组件来包裹,这样是不符合需求的,因为用户需要限定当表单元素的文本太多时,也就是说出现了省略号才会出现Tooltip组件的包裹。
283 0
一个工具函数,实现页面tooltip组件的限制使用
|
C# 前端开发
WPF Image控件的绑定
原文:WPF Image控件的绑定      在我们平时的开发中会经常用到Image控件,通过设置Image控件的Source属性,我们可以加载图片,设置Image的source属性时可以使用相对路径也可以使用绝对路径,一般情况下建议使用绝对路径,类似于下面的形式Source="/Demo;Component/Images/Test.
1699 0