ASP.NET MVC 3 Beta初體驗之超酷的Chart：3D效果

   顯示3D的效果，微軟給了我們兩種解決方案。一種是使用他自帶的樣式，一種是自己配置一個顯示樣式的XML。

   第一種使用自帶的樣式：很簡單，在上一篇文章中其實有提到過，我們将模版改成ChartTheme.Vanilla3D。代碼如下：

<a></a>

代碼

&lt;p&gt; 

@{ 

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(); 

}

&lt;/p&gt;

效果：

第二種方式:自定義顯示樣式。MVC可以讓我們自定通過XML自定義Chart的顯示樣式。

定義一個XML樣式：

&lt;Chart Palette="BrightPastel"

BackColor="#D3DFF0"

BackGradientStyle="TopBottom"

BackSecondaryColor="White"

BorderColor="26, 59, 105"

BorderWidth="2"

BorderlineDashStyle="Solid"&gt;

&lt;Series&gt;

&lt;series _Template_="All"

BorderColor="180, 26, 59, 105"

CustomProperties="LabelStyle=Bottom"

IsValueShownAsLabel="True"&gt;

&lt;/series&gt;

&lt;/Series&gt;

&lt;ChartAreas&gt;

&lt;ChartArea _Template_="All"

BackColor="Orange"

ShadowColor="Transparent"

BorderColor="64, 64, 64, 64"

BorderDashStyle="Solid"&gt;

&lt;Area3DStyle Enable3D="True"&gt;

&lt;/Area3DStyle&gt;

&lt;AxisX ArrowStyle="Triangle"

IsLabelAutoFit="False"

LineColor="64, 64, 64, 64"&gt;

&lt;MajorGrid LineColor="64, 64, 64, 64"/&gt;

&lt;LabelStyle Font="Trebuchet MS, 10pt, style=Bold"

IsStaggered="False"/&gt;

&lt;/AxisX&gt;

&lt;/ChartArea&gt;

&lt;/ChartAreas&gt;

&lt;Titles&gt;

&lt;Title _Template_="All"

Font="Trebuchet MS, 14.25pt, style=Bold"

ForeColor="26, 59, 105"

ShadowOffset="3"

ShadowColor="32, 0, 0, 0"&gt;

&lt;/Title&gt;

&lt;/Titles&gt;

&lt;BorderSkin SkinStyle="Emboss"/&gt;

&lt;/Chart&gt;

在建立Chart的代碼修改一下：

&lt;p&gt;

@{

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();

通過這種方式，給了程式員很多的擴充空間。

本文轉自麒麟部落格園部落格，原文連結：http://www.cnblogs.com/zhuqil/archive/2010/10/23/1858858.html，如需轉載請自行聯系原作者