首先看到这个报表的界面会不会感觉很爽,没错,这就是用MSchart 的图形报表组件,完全免费的 开发的
如果你不看这篇文章,可能会碰很多钉子,写这个 就是为了让大家更快,更顺利的去使用这个.net FrameWork 3.5新组件的功能
先发表了,继续修改,免得又出现关闭浏览器问题...
继续 首先你要安装Vs2008这我就不说了,.net FrameWork 3.5这也是要有的,
然后下载MSChart的和4个补丁文件,在这里我都给大家提供好了,在我的资源里就有下载,5分哦,不过下载完评论下就不扣分了。
--=====================================================================--
然后依次安装
dotnetfx35setup.exe
MSChart_VisualStudioAddOn.exe
MSChartLP_chs.exe
MSChart.exe
这几个文件,然后OK
启动VS2008准备写程序
--=====================================================================--
创建一个Web 项目
然后在左边的工具卡里添加 .net FrameWork组件 Chart 这里添加Web UI 的Chart组件如果时WinForm的话就添加WinForm的
然后在数据的选项卡里,把Chart的控件拖到界面上
--=====================================================================--
HTML代码如下
<asp:chart id="Chart1" runat="server" Height="296px" Width="412px" ImageLocation="~/TempImages/ChartPic_#SEQ(300,3)" Palette="BrightPastel" imagetype="Png" BorderDashStyle="Solid" BackSecondaryColor="White" BackGradientStyle="TopBottom" BorderWidth="2" backcolor="#D3DFF0" BorderColor="26, 59, 105">
<legends>
<asp:Legend IsTextAutoFit="False" Name="Default" BackColor="Transparent" Font="Trebuchet MS, 8.25pt, style=Bold"></asp:Legend>
</legends>
<borderskin skinstyle="Emboss"></borderskin>
<series>
<asp:Series Name="Column" BorderColor="180, 26, 59, 105">
<points>
<asp:DataPoint YValues="45" />
<asp:DataPoint YValues="34" />
<asp:DataPoint YValues="67" />
<asp:DataPoint YValues="31" />
<asp:DataPoint YValues="27" />
<asp:DataPoint YValues="87" />
<asp:DataPoint YValues="45" />
<asp:DataPoint YValues="32" />
</points>
</asp: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>
</asp:chart>
--=====================================================================--
后台代码如下
using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
using System.Web.UI.DataVisualization.Charting;
namespace WebApplication2
{
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
// Create new data series and set it's visual attributes
Series series = new Series("Spline");
series.ChartType = SeriesChartType.Spline;
series.BorderWidth = 3;
series.ShadowOffset = 2;
// Populate new series with data
series.Points.AddY(67);
series.Points.AddY(57);
series.Points.AddY(83);
series.Points.AddY(23);
series.Points.AddY(70);
series.Points.AddY(60);
series.Points.AddY(90);
series.Points.AddY(20);
// Add series into the chart's series collection
Chart1.Series.Add(series);
}
}
}
ok ,你可以按F5运行了
--=====================================================================--
是不是报错了?
哈哈,当然要报错 还要配置Web.Config 开个玩笑:)
Web.Config还要配置如下
<appSettings>
<add key="ChartImageHandler" value="Storage=file;Timeout=20;Url=~/tempImages/;"/>
</appSettings>
<httpHandlers>
<remove verb="*" path="*.asmx"/>
<add verb="*" path="*.asmx" validate="false" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
<add verb="*" path="*_AppService.axd" validate="false" type="System.Web.Script.Services.ScriptHandlerFactory, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
<add verb="GET,HEAD" path="ScriptResource.axd" type="System.Web.Handlers.ScriptResourceHandler, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" validate="false"/>
<add path="ChartImg.axd" verb="GET,HEAD" type="System.Web.UI.DataVisualization.Charting.ChartHttpHandler, System.Web.DataVisualization, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" validate="false"/>
</httpHandlers>
<handlers>
<remove name="ChartImageHandler"/>
<add name="ChartImageHandler" preCondition="integratedMode" verb="GET,HEAD" path="ChartImg.axd" type="System.Web.UI.DataVisualization.Charting.ChartHttpHandler, System.Web.DataVisualization, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
</handlers>
ok,再次运行,你会看到你喜欢看到的东西了
本文来自CSDN博客,转载请标明出处:http://blog.csdn.net/gavin_luo/archive/2008/12/03/3437962.aspx