[转载]ASP.NET MVC 3 Beta初体验之超酷的Chart:3D效果

[转载]ASP.NET MVC 3 Beta初体验之超酷的Chart:3D效果 – 海纳百川 – 博客园.

在前一篇文章:ASP.NET MVC 3 Beta初体验之超酷的Chart中 介绍了Chart的使用,但是没有介绍到3D效果。这篇文章将介绍一下Chart的3D效果的展示。声明一点的是:这个Chart控件可能没有一些开源或 者不开源,收费或者不收费的组件那般强大,我相信未来这个控件会越来越强大的。废话不多说了,看下如何展示Chart的3D效果。

显示3D的效果,微软给了我们两种解决方案。一种是使用他自带的样式,一种是自己配置一个显示样式的XML。

第一种使用自带的样式:很简单,在上一篇文章中其实有提到过,我们将模版改成ChartTheme.Vanilla3D。代码如下:

代码

<p> @{ var key = new Chart(width: 600, height: 400,template: ChartTheme.Vanilla3D) .AddTitle("人员流动情况") .AddSeries(name: "Employee",xValue: new[] { "一月份", "二月份", "三月份", "四月份", "五月份", "六月份", "七月份", "八月份", "九月份"}, yValues: new[] { "2", "6", "4", "5", "3","4","9","2","5"}) .Write(); } </p>

效果:

第二种方式:自定义显示样式。MVC可以让我们自定通过XML自定义Chart的显示样式。

定义一个XML样式:

代码

<Chart Palette="BrightPastel" BackColor="#D3DFF0" BackGradientStyle="TopBottom" BackSecondaryColor="White" BorderColor="26, 59, 105" BorderWidth="2" BorderlineDashStyle="Solid"> <Series> <series _Template_="All" BorderColor="180, 26, 59, 105" CustomProperties="LabelStyle=Bottom" IsValueShownAsLabel="True"> </series> </Series> <ChartAreas> <ChartArea _Template_="All" BackColor="Orange" BackGradientStyle="TopBottom" BackSecondaryColor="White" ShadowColor="Transparent" BorderColor="64, 64, 64, 64" BorderDashStyle="Solid"> <Area3DStyle Enable3D="True" > </Area3DStyle> <AxisX ArrowStyle="Triangle" IsLabelAutoFit="False" LineColor="64, 64, 64, 64"> <MajorGrid LineColor="64, 64, 64, 64" /> <LabelStyle Font="Trebuchet MS, 10pt, style=Bold" IsStaggered="False" /> </AxisX> </ChartArea> </ChartAreas> <Titles> <Title _Template_="All" Font="Trebuchet MS, 14.25pt, style=Bold" ForeColor="26, 59, 105" ShadowOffset="3" ShadowColor="32, 0, 0, 0"> </Title> </Titles> <BorderSkin SkinStyle="Emboss" /> </Chart>

在创建Chart的代码修改一下:

代码

<p> @{ var key = new Chart(width: 600, height: 400,templatePath: "~/_ChartFiles/OrangeBlue3DTemplate.xml") .AddTitle("人员流动情况") .AddSeries(name: "Employee",xValue: new[] { "一月份", "二月份", "三月份", "四月份", "五月份", "六月份", "七月份", "八月份", "九月份"}, yValues: new[] { "2", "6", "4", "5", "3","4","9","2","5"}) .Write(); } </p>

效果:

通过这种方式,给了程序员很多的扩展空间。

总结:本文是对ASP.NET MVC 3 Beta初体验之超酷的Chart的一个补足。介绍了在ASP.NET MVC 3 Beta中Chart的3D效果。

作者:朱祁林
出处:http://zhuqil.cnblogs.com
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。

赞(0) 打赏
分享到: 更多 (0)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏