这次演示饼图制作,简单介绍饼图的样式效果及
PlotArea
对象的一些属性。
一、生成饼图
C1WebChart1.ChartGroups.Group0.ChartType
=
Chart2DTypeEnum.Pie;
设置图表类型。
DataSet ds
=
GetDataSet();
DataView dv
=
new
DataView(ds.Tables[
"
sanguo
"
]);
//
清除图表所有数据序列
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());
}
为图表添加数据。
这里与折线图不同的是饼图只需设置坐标轴的
Y
值即可,所有序列的相同索引的数据组合成一个饼图。这里将每一条数据放在一个新的数据序列里,并且每个序列都只有一个元素。这样,所有数据就会呈现在一个饼图中。如图:
这个就是默认的饼图样式,是不是少点什么呢?
接下来,介绍样式的设置。
二、饼图样式设计
1)
添加图例
C1WebChart1.Legend.Visible
=
true
;
设置
Legend
对象的
Visible
属性为
true
,图例就会显示出来。这时图例的标签默认为序列的名称。
for
(
int
i
=
0
; i
<
dv.Count; i
++
)
{
ChartDataSeries series
=
C1WebChart1.ChartGroups[
0
].ChartData.SeriesList[i];
series.Label
=
dv[i][
"
name
"
].ToString();
}
设置图例标签的显示内容。为了代码简洁也可以在添加数据的同时设置。
另外,我们还可以使用
Legend
对象(图例对象)设置图例的显示样式。如:
C1WebChart1.Legend.Compass
=
CompassEnum.West;
设置图例显示位置。
其他一些属性,例如
Orientation
设置图例显示方向(以纵向显示或横向显示)等,不作详细介绍,可自己尝试使用。
2)
为了让数据更加直观,可在饼图添加标签
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
;
}
首先,实例化标签并设置标签内容及相关属性。
然后使用
AttachMethodData
对象设置标签附加在图表中的位置。
GroupIndex
是指图表索引。(第一篇文章提到过
WebChart
默认支持
2
个图表)
SeriesIndex
是指序列索引。
PointIndex
是指序列中的元素索引。
设置完成,效果图如下:
三、
3D
效果的实现
。
1
)开启
3D
效果。
C1WebChart1.ChartGroups[
0
].Use3D
=
true
;
以
3D
样式显示,该步骤必须存在。
3)
设置
3D
样式
//
3D图形的深度
C1WebChart1.ChartArea.PlotArea.View3D.Depth
=
20
;
//
以y轴作为参照的 旋转角度(只有x轴,这个属性设置无效)
C1WebChart1.ChartArea.PlotArea.View3D.Rotation
=
90
;
//
以x轴作为参照的 倾斜角度
C1WebChart1.ChartArea.PlotArea.View3D.Elevation
=
30
;
//
设置3D图形的阴影效果
C1WebChart1.ChartArea.PlotArea.View3D.Shading
=
ShadingEnum.ColorDark;
3D
样式是使用
PlotArea
对象的View3D属性来设置。
主要就是以上四个属性的设置。
显示效果如下:
四、补充概念
或许之前说到的各图形区域比较容易混淆,下面以图形介绍个图形区域:
灰色
为整个
WebChart
区域,对应对象就是
this.C1WebChart1
。
桔黄色
为图表区域,对应对象为
this.C1WebChart1.ChartArea
。
绿色
为绘图区,对应对象为
this.C1WebChart1.ChartArea.PlotArea
。
红色
为图表的上标题,对应对象为
this.C1WebChart1.Header
。
蓝色
为图表的下标题,对应对象为
this.C1WebChart1.Footer
。
使用相关对象可以设置个区域的样式效果。了解这些可以使用属性窗口快速设置一些简单样式。
五、结束
我希望通过一些实例能够比较全面的介绍
WebChart
的主要对象的使用。在下一次,会演示柱形图的制作。本次实例的完整代码下载地址如下:
http://www.blogjava.net/Files/kdboy/ChartPie.rar
posted on 2007-03-21 22:03
kdboy 阅读(1625)
评论(0) 编辑 收藏 所属分类:
ASP.NET