1）前台代码
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication45.Default" %>
<%@ 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>
<asp:Chart ID="Chart1" runat="server" Palette="BrightPastel" BackColor="#D3DFF0"
ImageType="Png" ImageLocation="~/TempImages/ChartPic_#SEQ(300,3)" Width="412px"
Height="296px" BorderlineDashStyle="Solid" BackGradientStyle="TopBottom" BorderWidth="2"
BorderColor="181, 64, 1">
<Titles>
<asp:Title ShadowColor="32, 0, 0, 0" Font="Trebuchet MS, 14.25pt, style=Bold" ShadowOffset="3"
Text="Money of student" Name="Title1" ForeColor="26, 59, 105">
</asp:Title>
</Titles>
<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" IsValueShownAsLabel="true">
</asp:Series>
</Series>
<ChartAreas>
<asp:ChartArea Name="ChartArea1" BorderColor="64, 64, 64, 64" BorderDashStyle="Solid"
BackSecondaryColor="White" BackColor="Transparent" 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" TitleFont="Trebuchet MS, 10.25pt">
<LabelStyle Font="Trebuchet MS, 10.25pt, style=Bold" />
<MajorGrid LineColor="64, 64, 64, 64" />
</AxisY>
<AxisX LineColor="64, 64, 64, 64" TitleFont="Trebuchet MS, 10.25pt">
<LabelStyle Font="Trebuchet MS, 8.25pt, style=Bold" />
<MajorGrid LineColor="64, 64, 64, 64" />
</AxisX>
</asp:ChartArea>
</ChartAreas>
</asp:Chart>
</div>
</form>
</body>
</html>
2）后台代码
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.DataVisualization.Charting;
namespace WebApplication45
{
public partial class Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
BindStudent();
}
}
/// <summary>
/// 后台绑定
/// </summary>
private void BindStudent()
{
List<Student> items = GetStudents();
Series series = Chart1.Series[0];
foreach (Student item in items)
{
DataPoint dataPoint = new DataPoint();
dataPoint.SetValueXY(item.Name, item.Money);
series.Points.Add(dataPoint);
}
Chart1.ChartAreas[0].AxisX.Title = "Student Name";
Chart1.ChartAreas[0].AxisY.Title = "Money($)";
}
private List<Student> GetStudents()
{
List<Student> items = new List<Student>();
items.Add(new Student("Chad", 1));
items.Add(new Student("Catherine", 4));
items.Add(new Student("Amamda", 3));
items.Add(new Student("Emily", 2));
return items;
}
}
public class Student
{
public Student() { }
public Student(string _name, decimal _money)
{
this.Name = _name;
this.Money = _money;
}
public string Name { set; get; }
public decimal Money { set; get; }
}
}
3）错误解决方法
错误：Error executing child request for ChartImg.axd.
解决方法：在web.config 的<system.web>节点小添加如下代码
<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>
![前后端分离之跨域问题[图]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)