Flex LineChart曲线——动态加载组件
最近在学习Flex 和Asp.net互操作，在网上查找了一些资料，综合后， 做出了这个动态加载组件的LineChart曲线。尚有不足之处请予以指正：谢谢。
下面是完整代码：
1
<?
xml version
=
"
1.0
"
encoding
=
"
utf-8
"
?>
2
<
mx:Application xmlns:mx
=
"
http://www.adobe.com/2006/mxml
"
layout
=
"
absolute
"
width
=
"
100%
"
3
initialize
=
"
addArray()
"
>
4
5
<
mx:Script
><!
[CDATA[
6
7
private
var Width:
int
=
1000
8
private
var Height:
int
=
400
9
private
var fontColor:String
=
"
0x000000
"
10
11
12
import mx.charts.CategoryAxis;
13
import mx.charts.LineChart;
14
import mx.charts.Legend;
15
import mx.charts.series.LineSeries;
16
import mx.containers.HBox;
17
import mx.collections.ArrayCollection;
18
import ChatCreate;
19
[Bindable]
20
public
var expenses:ArrayCollection
=
new
ArrayCollection([
21
{ Day:
100
, a:
200
, b:
1500
,c:
450
},
22
{ Day:
300
, a:
100
, b:
200
, c:
600
},
23
{ Day:
500
, a:
450
, b:
500
, c:
300
},
24
{ Day:
700
, a:
280
, b:
1200
,c:
900
},
25
{ Day:
900
, a:
640
, b:
575
, c:
500
}
26
]);
27
28
public
var chartArray:Array
=
new
Array
29
public
static
var lineChart:LineChart
=
new
LineChart;
30
public
static
var myArray:Array
=
new
Array(
"
a
"
,
"
b
"
,
"
c
"
);
31
32
public
function addArray():
void
{
33
34
var myLineSeries:Array
=
new
Array();
35
for
(var i:
int
=
0
; i
<
myArray.length; i
++
)
36
{
37
38
var _titleArr:Array
=
myArray[i].toString().split(
"
,
"
)
39
40
var lineChart:LineChart
=
new
LineChart
41
42
lineChart.width
=
Width
43
44
lineChart.height
=
Height
45
46
lineChart.setStyle(
"
color
"
, fontColor)
47
48
lineChart.dataProvider
=
expenses;
49
50
51
52
var lineHAxis:CategoryAxis
=
new
CategoryAxis()
53
54
lineHAxis.categoryField
=
"
Day
"
;
55
56
lineHAxis.dataProvider
=
expenses;
57
58
lineChart.horizontalAxis
=
lineHAxis;
59
60
61
62
63
64
for
(var j:
int
=
0
; j
<
_titleArr.length; j
++
)
65
66
{
67
68
var lineSeries:LineSeries
=
new
LineSeries();
69
70
lineSeries.xField
=
"
Day
"
;
71
72
lineSeries.yField
=
_titleArr[j];
73
74
lineSeries.displayName
=
_titleArr[j];
75
76
myLineSeries.push(lineSeries);
77
78
}
79
}
80
lineChart.series
=
myLineSeries;
81
82
var chartLegend:Legend
=
new
Legend
83
84
chartLegend.setStyle(
"
color
"
, fontColor)
85
86
chartLegend.dataProvider
=
lineChart;
87
88
lineChart.showDataTips
=
true
;
89
90
91
92
var hbox:HBox
=
new
HBox
93
94
hbox.addChild(lineChart);
95
96
hbox.addChild(chartLegend);
97
98
this
.addChild(hbox);
99
100
chartArray.push(hbox);
101
102
//
}
103
}
104
]]
></
mx:Script
>
105
106
</
mx:Application
>
107
下面是运行效果：
这是我研究了整整一个周的结果。虽然不是很完善。但是这是我学习后的结果。所以希望大家多多指正。各抒己见。谢谢大家.
而且我准备把上面的ArrayCollection也动态生成。然后在Js和Flex交互的时候把数据集传过来。以致让其动态显示。 但是时间有限而且貌似有点棘手，望高手不吝赐教! 在此谢过!