這次演示餅圖制作，簡(jiǎn)單介紹餅圖的樣式效果及
PlotArea
對(duì)象的一些屬性。
?
一、生成餅圖
C1WebChart1.ChartGroups.Group0.ChartType?
=
?Chart2DTypeEnum.Pie;
設(shè)置圖表類(lèi)型。?
?
DataSet?ds?
=
?GetDataSet();
DataView?dv?
=
?
new
?DataView(ds.Tables[
"
sanguo
"
]);
//
清除圖表所有數(shù)據(jù)序列
C1WebChart1.ChartGroups[
0
].ChartData.SeriesList.Clear();
這里和折線圖一樣。
?
for
(
int
?i
=
0
;?i?
<
?dv.Count;?i
++
)
{
???????ChartDataSeries?series?
=
?C1WebChart1.ChartGroups[
0
].ChartData.SeriesList.AddNewSeries();
???????series.PointData.Length?
=
?
1
;
???????series.Y[
0
]?
=
?
float
.Parse(dv[i][
"
value
"
].ToString());
}
為圖表添加數(shù)據(jù)。
這里與折線圖不同的是餅圖只需設(shè)置坐標(biāo)軸的
Y
值即可，所有序列的相同索引的數(shù)據(jù)組合成一個(gè)餅圖。這里將每一條數(shù)據(jù)放在一個(gè)新的數(shù)據(jù)序列里，并且每個(gè)序列都只有一個(gè)元素。這樣，所有數(shù)據(jù)就會(huì)呈現(xiàn)在一個(gè)餅圖中。如圖：
這個(gè)就是默認(rèn)的餅圖樣式，是不是少點(diǎn)什么呢？
接下來(lái)，介紹樣式的設(shè)置。
?
二、餅圖樣式設(shè)計(jì)
1）?
添加圖例
C1WebChart1.Legend.Visible?
=
?
true
;
設(shè)置
Legend
對(duì)象的
Visible
屬性為
true
，圖例就會(huì)顯示出來(lái)。這時(shí)圖例的標(biāo)簽?zāi)J(rèn)為序列的名稱(chēng)。
?
for
(
int
?i
=
0
;?i?
<
?dv.Count;?i
++
)
{
???????ChartDataSeries?series?
=
?C1WebChart1.ChartGroups[
0
].ChartData.SeriesList[i];
???????series.Label
=
dv[i][
"
name
"
].ToString();
}
設(shè)置圖例標(biāo)簽的顯示內(nèi)容。為了代碼簡(jiǎn)潔也可以在添加數(shù)據(jù)的同時(shí)設(shè)置。
?
另外，我們還可以使用
Legend
對(duì)象（圖例對(duì)象）設(shè)置圖例的顯示樣式。如：
C1WebChart1.Legend.Compass?
=
?CompassEnum.West;
設(shè)置圖例顯示位置。
?
其他一些屬性，例如
Orientation
設(shè)置圖例顯示方向（以縱向顯示或橫向顯示）等，不作詳細(xì)介紹，可自己嘗試使用。
?
2）?
為了讓數(shù)據(jù)更加直觀，可在餅圖添加標(biāo)簽
for
(
int
?i
=
0
;?i?
<
?dv.Count;?i
++
)
{
???????C1.Win.C1Chart.Label?lbl?
=
?C1WebChart1.ChartLabels.LabelsCollection.AddNewLabel();
???????lbl.Text?
=
?
string
.Format(
"
{0}%
"
,
float
.Parse(dv[i][
"
value
"
].ToString()));
???????lbl.Compass?
=
?LabelCompassEnum.Radial;
???????lbl.Offset?
=
?
20
;
???????lbl.Connected?
=
?
true
;
???????lbl.Visible?
=
?
true
;
???????lbl.AttachMethod?
=
?AttachMethodEnum.DataIndex;
???????AttachMethodData?am?
=
?lbl.AttachMethodData;
???????am.GroupIndex??
=
?
0
;
???????am.SeriesIndex?
=
?i;
???????am.PointIndex??
=
?
0
;
}
首先，實(shí)例化標(biāo)簽并設(shè)置標(biāo)簽內(nèi)容及相關(guān)屬性。
然后使用
AttachMethodData
對(duì)象設(shè)置標(biāo)簽附加在圖表中的位置。
GroupIndex
是指圖表索引。（第一篇文章提到過(guò)
WebChart
默認(rèn)支持
2
個(gè)圖表）
SeriesIndex
是指序列索引。
PointIndex?
是指序列中的元素索引。
?
設(shè)置完成，效果圖如下：
?
三、
3D
效果的實(shí)現(xiàn)
。
1
）開(kāi)啟
3D
效果。
C1WebChart1.ChartGroups[
0
].Use3D?
=
?
true
;
以
3D
樣式顯示，該步驟必須存在。
?
3）?
設(shè)置
3D
樣式
//
3D圖形的深度
C1WebChart1.ChartArea.PlotArea.View3D.Depth?
=
20
;
//
以y軸作為參照的?旋轉(zhuǎn)角度(只有x軸，這個(gè)屬性設(shè)置無(wú)效)
C1WebChart1.ChartArea.PlotArea.View3D.Rotation?
=
90
;
//
以x軸作為參照的?傾斜角度
C1WebChart1.ChartArea.PlotArea.View3D.Elevation?
=
30
;
//
設(shè)置3D圖形的陰影效果
C1WebChart1.ChartArea.PlotArea.View3D.Shading?
=
?ShadingEnum.ColorDark;
3D
樣式是使用
PlotArea
對(duì)象的View3D屬性來(lái)設(shè)置。
主要就是以上四個(gè)屬性的設(shè)置。
顯示效果如下：
?
四、補(bǔ)充概念
或許之前說(shuō)到的各圖形區(qū)域比較容易混淆，下面以圖形介紹個(gè)圖形區(qū)域：
?
灰色
為整個(gè)
WebChart
區(qū)域，對(duì)應(yīng)對(duì)象就是
this.C1WebChart1
。
桔黃色
為圖表區(qū)域，對(duì)應(yīng)對(duì)象為
this.C1WebChart1.ChartArea
。
綠色
為繪圖區(qū)，對(duì)應(yīng)對(duì)象為
this.C1WebChart1.ChartArea.PlotArea
。
紅色
為圖表的上標(biāo)題，對(duì)應(yīng)對(duì)象為
this.C1WebChart1.Header
。
藍(lán)色
為圖表的下標(biāo)題，對(duì)應(yīng)對(duì)象為
this.C1WebChart1.Footer
。
?
使用相關(guān)對(duì)象可以設(shè)置個(gè)區(qū)域的樣式效果。了解這些可以使用屬性窗口快速設(shè)置一些簡(jiǎn)單樣式。
?
五、結(jié)束
我希望通過(guò)一些實(shí)例能夠比較全面的介紹
WebChart
的主要對(duì)象的使用。在下一次，會(huì)演示柱形圖的制作。本次實(shí)例的完整代碼下載地址如下：
?http://m.tkk7.com/Files/kdboy/ChartPie.rar
posted on 2007-03-21 22:03
kdboy 閱讀(1637)
評(píng)論(0) 編輯 收藏 所屬分類(lèi):
ASP.NET