Chart控件 学习

Chart控件是微软提供的用于制作报表的控件,下载地址http://www.microsoft.com/en-us/download/details.aspx?id=14422 

教程 http://archive.msdn.microsoft.com/mschart/Release/ProjectReleases.aspx?ReleaseId=1591

1.添加引用 System.Web.DataVisualization
配置文件文件中会增加三个内容

<httpHandlers>
<add path="ChartImg.axd" verb="GET,HEAD,POST" type="System.Web.UI.DataVisualization.Charting.ChartHttpHandler, System.Web.DataVisualization, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
validate="false" />
</httpHandlers>

<pages>
<controls>
<add tagPrefix="asp" namespace="System.Web.UI.DataVisualization.Charting"
assembly="System.Web.DataVisualization, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" />
</controls>
</pages>
<assemblies> <add assembly="System.Web.DataVisualization, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/></assemblies> </compilation>

2.前台代码

<asp:Chart ID="Chart1" runat="server" Palette="BrightPastel" BackColor="#F3DFC1"
            ImageType="Png" ImageLocation="~/TempImages/ChartPic_#SEQ(300,3)" Width="600px"
            Height="300px" BorderDashStyle="solid" BackGradientStyle="TopBottom" BorderWidth="1"
            BorderColor="181, 64, 1">
            <legends>
                <asp:Legend Enabled="False" IsTextAutoFit="False" Name="Default" BackColor="Transparent"
                    Font="Trebuchet MS, 8.25pt, style=Bold">
                </asp:Legend>
            </legends>
            <borderskin skinstyle="Emboss"></borderskin> -- 背景为圆角
            <series> -- 曲线的控制
                <asp:Series MarkerSize="8" BorderWidth="3" XValueType="Double" Name="Series1" ChartType="Line"
                    MarkerStyle="Circle" ShadowColor="Black" BorderColor="180, 26, 59, 105" Color="220, 65, 140, 240"
                    ShadowOffset="2" YValueType="Double">
                </asp:Series>
                <asp:Series MarkerSize="9" BorderWidth="3" XValueType="Double" Name="Series2" ChartType="Line"
                    MarkerStyle="Diamond" ShadowColor="Black" BorderColor="180, 26, 59, 105" Color="220, 224, 64, 10"
                    ShadowOffset="2" YValueType="Double">
                </asp:Series>
            </series>
            <chartareas>
                <asp:ChartArea Name="ChartArea1" BorderColor="64, 64, 64, 64" BorderDashStyle="Solid"
                    BackSecondaryColor="White" BackColor="OldLace" ShadowColor="Transparent" BackGradientStyle="TopBottom">
                    <Area3DStyle Rotation="25" Perspective="9" LightStyle="Realistic" Inclination="40"
                        IsRightAngleAxes="False" WallWidth="3" IsClustered="False" />
                    <AxisY LineColor="64, 64, 64, 64" Maximum="100" Minimum="0"> --Y轴 
                        <LabelStyle Font="Trebuchet MS, 8.25pt, style=Bold" />
                        <MajorGrid LineColor="64, 64, 64, 64" />
                    </AxisY>
                    <AxisX LineColor="64, 64, 64, 64"> -- X轴 
                        <LabelStyle Font="Trebuchet MS, 8.25pt, style=Bold" />
                        <MajorGrid LineColor="64, 64, 64, 64" />
                    </AxisX>
                </asp:ChartArea>
            </chartareas>
        </asp:Chart>

3.后台

  using System.Web.UI.DataVisualization.Charting;
protected void Page_Load(object sender, EventArgs e) { // Populate series with random data Random random = new Random(); for (int pointIndex = 0; pointIndex < 10; pointIndex++) { Chart1.Series["Series1"].Points.AddY(random.Next(45, 95)); Chart1.Series["Series2"].Points.AddY(random.Next(5, 75)); } // Set series chart type Chart1.Series["Series1"].ChartType = SeriesChartType.Line; Chart1.Series["Series2"].ChartType = SeriesChartType.Spline; // Set point labels Chart1.Series["Series1"].IsValueShownAsLabel = true; Chart1.Series["Series2"].IsValueShownAsLabel = true; // Enable X axis margin Chart1.ChartAreas["ChartArea1"].AxisX.IsMarginVisible = true; // Enable 3D, and show data point marker lines Chart1.ChartAreas["ChartArea1"].Area3DStyle.Enable3D = true; Chart1.Series["Series1"]["ShowMarkerLines"] = "True"; Chart1.Series["Series2"]["ShowMarkerLines"] = "True"; }
原文地址:https://www.cnblogs.com/qlbk/p/3101827.html