1
'
'OWC1.VBS
2
class owc
3
private
o
4
'
傳入物件
5
public
sub
create(id_,width_,height_,location_)
6
Set
o
=
document.createElement(
"
object
"
)
7
o.setAttribute
"
id
"
,id_
8
o.setAttribute
"
classid
"
,
"
CLSID:0002E55D-0000-0000-C000-000000000046
"
9
o.setAttribute codebase
=
"
owc11.dll
"
10
o.style.width
=
width_
11
o.style.height
=
height_
12
document.getElementById(location_).appendChild(o)
13
end sub
14
'
畫圖矩形圖
15
'
chart_bgcolor_圖表的背景顏色
16
'
chartCaption_圖表的標題
17
'
chartCaption_fontColor_圖表標題顏色
18
'
Interior_Color_矩形內的填充顏色
19
'
Caption_名稱
20
'
categories_名稱數組
21
'
values_值數組串
22
public
sub
bar(chart_bgcolor_,chartCaption_,chartCaption_fontColor_,Interior_Color_,Caption_,categories_,values_)
23
o.Clear
24
set
cht
=
o.Charts.Add
25
set
c
=
o.Constants
26
cht.Type
=
c.chChartTypeColumnClustered
27
'
設背景色或是填充
28
o.Charts(
0
).PlotArea.Interior.SetSolid chart_bgcolor_
29
30
'
加上圖表的標題
31
o.HasChartSpaceTitle
=
True
32
set
cst
=
o.ChartSpaceTitle
33
cst.Caption
=
chartCaption_
34
cst.Font.Color
=
chartCaption_fontColor_
35
cst.Font.Italic
=
False
36
cst.Font.Name
=
"
Arial
"
37
cst.Font.Size
=
12
38
cst.Font.Underline
=
c.owcUnderlineStyleSingle
39
40
'
添加數據
41
cht.SetData c.chDimCategories, c.chDataLiteral, categories_
42
cht.SeriesCollection(
0
).SetData c.chDimValues, c.chDataLiteral, values_
43
'
直條的背景色進行設定
44
set
sc
=
o.Charts(
0
).SeriesCollection(
0
)
45
sc.Interior.Color
=
Interior_Color_
46
47
'
直條上的顯示設置
48
sc.Caption
=
Caption_
49
set
dl
=
cht.SeriesCollection(
0
).DataLabelsCollection.Add
50
dl.HasValue
=
True
51
dl.HasPercentage
=
False
52
dl.Font.Size
=
9
53
dl.Font.Color
=
"
red
"
54
dl.Position
=
c.chLegendPositionRight
55
dl.NumberFormat
=
"
00.00%
"
56
'
左邊百分比的屬性設置
57
Set
cta
=
cht.Axes(c.chAxisPositionLeft)
58
cta.Font.Size
=
9
59
cta.NumberFormat
=
"
0.0%
"
60
cta.MajorUnit
=
0.1
61
end sub
62
'
多系列矩形圖
63
'
chart_bgColor_圖表的背景顏色
64
'
chartCaption_圖表的標題
65
'
chartCaption_fontColor_圖表標題顏色
66
'
color_顏色數組
67
'
caption_名稱數組
68
'
categories_名稱數組
69
'
values_值數組
70
public
sub
serBar(chart_bgColor_,chartCaption_,chartCaption_fontColor_,color_,caption_,categories_,values_)
71
o.Clear
72
o.Charts.Add
73
Set
c
=
o.Constants
74
'
圖表的類型
75
o.Charts(
0
).type
=
c.chChartTypeColumnClustered
76
'
給繪圖區加背景色
77
o.Charts(
0
).PlotArea.Interior.SetSolid chart_bgColor_
78
'
'加上圖表的標題
79
o.HasChartSpaceTitle
=
True
80
o.ChartSpaceTitle.Caption
=
chartCaption_
81
'
標題的屬性
82
o.ChartSpaceTitle.Font.Color
=
chartCaption_fontColor_
83
o.ChartSpaceTitle.Font.Italic
=
False
84
o.ChartSpaceTitle.Font.Name
=
"
Arial
"
85
o.ChartSpaceTitle.Font.Size
=
12
86
o.ChartSpaceTitle.Font.Underline
=
c.owcUnderlineStyleSingle
87
'
用循環來新增SeriesCollection以及里面的內容
88
for
i
=
0
to
ubound
(caption_)
89
valuetemp
=
""
90
for
j
=
i
*
(
ubound
(categories_)
+
1
)
to
(i
+
1
)
*
(
ubound
(categories_)
+
1
)
-
1
91
valuetemp
=
valuetemp
&
"
,
"
&
values_(j)
92
next
93
valuearr
=
split
(
mid
(valuetemp,
2
),
"
,
"
)
94
o.Charts(
0
).SeriesCollection.Add
95
o.Charts(
0
).SeriesCollection(i).Caption
=
caption_(i)
96
o.Charts(
0
).SeriesCollection(i).Interior.Color
=
color_(i)
97
o.Charts(
0
).SeriesCollection(i).SetData c.chDimCategories, c.chDataLiteral, categories_
98
o.Charts(
0
).SeriesCollection(i).SetData c.chDimValues, c.chDataLiteral, valuearr
99
set
dl
=
o.Charts(
0
).SeriesCollection(i).DataLabelsCollection.Add
100
dl.HasValue
=
True
101
dl.HasPercentage
=
False
102
dl.Font.Size
=
9
103
dl.Font.Color
=
"
red
"
104
dl.Position
=
c.chLegendPositionRight
105
dl.NumberFormat
=
"
00.00%
"
106
next
107
'
'圖例的設定
108
o.Charts(
0
).HasLegend
=
True
109
o.Charts(
0
).Legend.Font.Size
=
9
110
o.Charts(
0
).Legend.Position
=
c.chLegendPositionBottom
111
'
'左邊百分比的屬性設置
112
Set
cta
=
o.Charts(
0
).Axes(c.chAxisPositionLeft)
113
cta.Font.Size
=
9
114
cta.NumberFormat
=
"
0.00%
"
115
cta.MajorUnit
=
0.1
116
end sub
117
'
畫圓餅圖
118
'
chart_bgColor_繪圖區加背景色
119
'
chartCaption_圖表的標題
120
'
chartCaption_fontColor_圖表標題顏色
121
public
sub
Pie(chart_bgColor_,chartCaption_,chartCaption_fontColor_,Caption_,categories_,values_)
122
o.Clear
123
Set
cht
=
o.Charts.Add
124
Set
c
=
o.Constants
125
cht.Type
=
c.chChartTypePie3d
126
'
給繪圖區加背景色
127
o.Charts(
0
).PlotArea.Interior.SetSolid chart_bgColor_
128
cht.ExtrudeAngle
=
90
129
cht.ChartDepth
=
169
130
cht.AspectRatio
=
120
131
cht.Rotation
=
180
132
cht.Inclination
=
70
133
134
o.HasChartSpaceTitle
=
True
135
o.ChartSpaceTitle.Caption
=
chartCaption_
136
o.ChartSpaceTitle.Font.Color
=
chartCaption_fontColor_
137
o.ChartSpaceTitle.Font.Name
=
"
Arial
"
138
o.ChartSpaceTitle.Font.Size
=
12
139
o.ChartSpaceTitle.Font.Underline
=
c.owcUnderlineStyleSingle
140
141
cht.HasLegend
=
True
142
cht.Legend.Font.Size
=
9
143
cht.Legend.Position
=
c.chLegendPositionBottom
144
145
cht.SetData c.chDimCategories, c.chDataLiteral, categories_
146
cht.SeriesCollection(
0
).SetData c.chDimValues, c.chDataLiteral, values_
147
set
sc
=
o.Charts(
0
).SeriesCollection(
0
)
148
sc.Caption
=
Caption_
149
Set
dl
=
cht.SeriesCollection(
0
).DataLabelsCollection.Add
150
dl.Separator
=
"
:
"
151
dl.HasValue
=
false
152
dl.HasSeriesName
=
false
153
dl.HasCategoryName
=
true
154
dl.HasPercentage
=
true
155
dl.Font.Size
=
9
156
dl.Font.Color
=
"
red
"
157
dl.NumberFormat
=
"
00.00%
"
158
end sub
159
'
拆線圖
160
'
chart_bgColor_繪圖區加背景色
161
'
chartCaption_圖表的標題
162
'
chartCaption_fontColor_圖表標題顏色
163
public
sub
line(chart_bgColor_,chartCaption_,chartCaption_fontColor_,Caption_,categories_,values_)
164
o.Clear
165
Set
cht
=
o.Charts.Add
166
Set
c
=
o.Constants
167
cht.Type
=
c.chChartTypeLineMarkers
168
'
給繪圖區加背景色
169
o.Charts(
0
).PlotArea.Interior.SetSolid chart_bgColor_
170
o.HasChartSpaceTitle
=
True
171
o.ChartSpaceTitle.Caption
=
chartCaption_
172
o.ChartSpaceTitle.Font.Color
=
chartCaption_fontColor_
173
o.ChartSpaceTitle.Font.Name
=
"
Arial
"
174
o.ChartSpaceTitle.Font.Size
=
12
175
o.ChartSpaceTitle.Font.Underline
=
c.owcUnderlineStyleSingle
176
177
cht.SetData c.chDimCategories, c.chDataLiteral, categories_
178
cht.SeriesCollection(
0
).SetData c.chDimValues, c.chDataLiteral, values_
179
180
set
sc
=
o.Charts(
0
).SeriesCollection(
0
)
181
sc.Caption
=
Caption_
182
Set
dl
=
cht.SeriesCollection(
0
).DataLabelsCollection.Add
183
dl.HasValue
=
True
184
dl.HasPercentage
=
False
185
dl.Font.Size
=
9
186
dl.Font.Color
=
"
red
"
187
188
Set
categoryAxis
=
cht.Axes(c.chAxisPositionBottom)
189
categoryAxis.Font.Size
=
9
190
191
Set
categoryAxis
=
cht.Axes(c.chAxisPositionLeft)
192
categoryAxis.Font.Size
=
9
193
end sub
194
'
多系列拆線圖
195
'
chart_bgColor_圖表的背景顏色
196
'
chartCaption_圖表的標題
197
'
chartCaption_fontColor_圖表標題顏色
198
'
color_顏色數組
199
'
caption_名稱數組
200
'
categories_名稱數組
201
'
values_值數組
202
public
sub
serLine(chart_bgColor_,chartCaption_,chartCaption_fontColor_,color_,SeriesNames_,categories_,values_)
203
o.Clear
204
Set
cht
=
o.Charts.Add
205
Set
c
=
o.Constants
206
'
設置圖表類型
207
cht.Type
=
c.chChartTypeLineMarkers
208
'
給繪圖區加背景色
209
o.Charts(
0
).PlotArea.Interior.Color
=
chart_bgColor_
210
'
加上標題
211
o.HasChartSpaceTitle
=
True
212
o.ChartSpaceTitle.Caption
=
chartCaption_
213
o.ChartSpaceTitle.Font.Color
=
chartCaption_fontColor_
214
o.ChartSpaceTitle.Font.Name
=
"
Arial
"
215
o.ChartSpaceTitle.Font.Size
=
12
216
'
'添加數據
217
cht.SetData c.chDimSeriesNames, c.chDataLiteral, SeriesNames_
218
cht.SetData c.chDimCategories, c.chDataLiteral, Categories_
219
220
set
categoryAxis
=
cht.Axes(c.chAxisPositionBottom)
221
categoryAxis.Font.Size
=
9
222
223
Set
categoryAxis
=
cht.Axes(c.chAxisPositionLeft)
224
categoryAxis.Font.Size
=
9
225
226
for
i
=
0
to
ubound
(SeriesNames_)
227
valuetemp
=
""
228
for
j
=
i
*
(
ubound
(Categories_)
+
1
)
to
(i
+
1
)
*
(
ubound
(Categories_)
+
1
)
-
1
229
valuetemp
=
valuetemp
&
"
,
"
&
values_(j)
230
next
231
valuearr
=
split
(
mid
(valuetemp,
2
),
"
,
"
)
232
cht.SeriesCollection(i).SetData c.chDimValues, c.chDataLiteral, valuearr
233
cht.SeriesCollection(i).Line.Color
=
color_(i)
234
cht.SeriesCollection(i).Line.Weight
=
c.owcLineWeightThin
235
cht.SeriesCollection(i).Marker.Style
=
c.chMarkerStyleDiamond
236
cht.SeriesCollection(i).Interior.Color
=
color_(i)
237
Set
dl
=
cht.SeriesCollection(i).DataLabelsCollection.Add
238
dl.HasValue
=
true
239
dl.HasPercentage
=
false
240
dl.Font.Size
=
9
241
dl.font.color
=
"
red
"
242
next
243
end sub
244
'
清除圖型
245
public
sub
clear()
246
o.Clear
247
end sub
248
end
class
1
<
html
>
2
<
head
>
3
<
title
>
vbscript owc class test
</
title
>
4
<
script language
=
"
vbscript
"
src
=
"
owc1.vbs
"
></
script
>
5
<
script language
=
"
vbscript
"
>
6
sub
window_onload()
7
set
t
=
new
owc
8
9
categories
=
Array
(
"
A2-1
"
,
"
A2-2
"
,
"
A2-3
"
,
"
A3-1
"
,
"
A3-2
"
,
"
A3-3
"
_
10
,
"
B2-1
"
,
"
B2-2
"
,
"
B2-3
"
,
"
B3-1
"
,
"
B3-2
"
,
"
B3-3
"
_
11
,
"
C2-1
"
,
"
C2-2
"
,
"
C3-1
"
,
"
C3-2
"
,
"
C3-3
"
)
12
values
=
Array
(
0.813
,
0.689
,
0.800
,
0.833
,
0.681
,
0.864
,
0
.743_
13
,
0.894
,
0.822
,
0.874
,
0.746
,
0.908
,
0
.850_
14
,
0.728
,
0.731
,
0.734
,
0.624
)
15
t.create
"
cs1
"
,
"
100%
"
,
"
400px
"
,
"
c1
"
16
t.bar
"
#FFFFFF
"
,
"
報表標題
"
,
"
BLUE
"
,
"
#CCCC00
"
,
"
組別
"
,categories,values
17
18
color
=
Array
(
"
#CCFFFF
"
,
"
#99CCFF
"
,
"
#00CCFF
"
,
"
#FF0000
"
,
"
#660066
"
,
"
#FF8080
"
)
19
caption
=
Array
(
"
第1周
"
,
"
第2周
"
,
"
第3周
"
,
"
第4周
"
)
20
categories
=
Array
(
"
A棟
"
,
"
B棟
"
)
21
values
=
Array
(
0.6951
,
0.5798
,
0.7075
,
0.512
,
0.7907
,
0.7493
,
0.8691
,
0.7716
)
22
t.create
"
cs2
"
,
"
100%
"
,
"
400px
"
,
"
c2
"
23
t.serbar
"
#FFFFFF
"
,
"
2008年10月坑頭三廠各周各樓層達成率比較圖
"
,
"
red
"
,color,caption,categories,values
24
25
categories
=
array
(
"
臺北
"
,
"
上海
"
)
26
values
=
array
(
238760
,
912560.62
)
27
t.create
"
cs3
"
,
"
100%
"
,
"
400px
"
,
"
c3
"
28
t.Pie
"
#FFFFFF
"
,
"
銷售金額所佔比例(城市分類)
"
,
"
BLUE
"
,
"
城市
"
,categories,values
29
30
categories
=
array
(
"
2008/11/1
"
,
"
2008/11/2
"
,
"
2008/11/3
"
,
"
2008/11/4
"
,
"
2008/11/5
"
,
"
2008/11/6
"
,
"
2008/11/7
"
,
"
2008/11/8
"
,
"
2008/11/9
"
,
"
2008/11/10
"
,
"
2008/11/11
"
,
"
2008/11/12
"
,
"
2008/11/13
"
,
"
2008/11/14
"
,
"
2008/11/15
"
,
"
2008/11/16
"
,
"
2008/11/17
"
,
"
2008/11/18
"
,
"
2008/11/19
"
,
"
2008/11/20
"
,
"
2008/11/21
"
,
"
2008/11/22
"
,
"
2008/11/23
"
,
"
2008/11/24
"
,
"
2008/11/25
"
,
"
2008/11/26
"
,
"
2008/11/27
"
,
"
2008/11/28
"
,
"
2008/11/29
"
,
"
2008/11/30
"
)
31
values
=
array
(
67239.89
,
60400.26
,
7202.89
,
18453.12
,
28889.29
,
102136.25
,
78826.39
,
146291.6
,
93743.29
,
44204.44
,
45349.28
,
50730.6
,
37900.21
,
84359.87
,
169333.62
,
114594.96
,
75334.77
,
51360.32
,
55853.05
,
37912.63
,
45068.22
,
63930.98
,
72993.71
,
18699.5
,
24714.5
,
34792.91
,
39414.58
,
92171.2
,
74433.06
,
3998894.41
)
32
t.create
"
cs4
"
,
"
100%
"
,
"
400px
"
,
"
c4
"
33
t.line
"
#FFFFFF
"
,
"
銷售金額
"
,
"
BLUE
"
,
"
日期
"
,categories,values
34
35
color
=
Array
(
"
#CCFFFF
"
,
"
#99CCFF
"
,
"
#00CCFF
"
,
"
#FF0000
"
)
36
SeriesNames
=
array
(
"
A產品
"
,
"
B產品
"
,
"
C產品
"
,
"
D產品
"
)
37
Categories
=
array
(
"
2005/3/24
"
,
"
2005/3/25
"
,
"
2005/3/26
"
,
"
2005/3/27
"
,
"
2005/3/28
"
)
38
values
=
array
(
50
,
100
,
20
,
80
,
89
,
40
,
60
,
20
,
90
,
70
,
20
,
50
,
55
,
25
,
60
,
80
,
20
,
75
,
58
,
100
)
39
t.create
"
cs5
"
,
"
100%
"
,
"
400px
"
,
"
c5
"
40
t.serline
"
#FFFFFF
"
,
"
達成率月報表
"
,
"
red
"
,color,SeriesNames,categories,values
41
42
set
t
=
nothing
43
end sub
44
</
script
>
45
</
head
>
46
<
body
>
47
<
div id
=
"
c1
"
></
div
>
48
<
div id
=
"
c2
"
></
div
>
49
<
div id
=
"
c3
"
></
div
>
50
<
div id
=
"
c4
"
></
div
>
51
<
div id
=
"
c5
"
></
div
>
52
</
body
>
53
</
html
>
54