题目中提供的一组表格属性和表格数据使用javascript在html页面上动态生成一个表格。该表格可使用table标签(或使用DIV,使用DIV完成该测试可加分。)方式实现。该表格样式如图1所示;鼠标单击该表格某一指标行,该行变色标识选中,同时根据图形数据表格内的数据绘制该指标数据曲线图。
测试要点
1. 使用测试数据中的表格属性和表格数据使用javascript动态生成表格;
2. 生成表格及图形的样式须按图1所示;
3. Fusionchart图表绘制;
4. 单击表格某一指标行,重新绘制该指标数据曲线图。
测试数据及解释
表格属性:说明:
记录表格样式,标题,行、列栏目信息的一组JOSN数据。 测试数据:
{"pagesize": 2, "title": "当前数据","style": "tableStyle","columns": [{"width": 200, "title": "指标"}, {"width": 200, "title": "数值"}],"rows": [{"datakey": "S01","title": "指标一"},{"datakey": "S02","title": "指标二"},{"datakey": "S03","title": "指标三"},{"datakey": "S04","title": "指标四"},{"datakey": "S05","title": "指标五"},{"datakey": "S06","title": "指标六"}]}解释:
Pagesize:表格行数;
Title:显示标题
Style:表格样式名
Columns:表格列栏目信息,即表头信息。
Row:表格列栏目信息,即每行标题信息。
Datakey:该行对应数据的键值。该处的值与表格数据JSON串中数据键值对应。表格数据:
说明:
对应上面表格属性的一组表格数据。 测试数据:
{"totalnumber": 1,"data": [{"S01": 356, "S02": 419, "S03": 244, "S04": 285, "S05": 50, "S06": 7.21,"Sta_Time": "2009-10-26 11:38:00.0"}]}解释:
Totalnumber:总记录数
data:表格显示数据集;该处数据键值与表格属性中datakey的值向对应。时间 指标一 指标二 指标三 指标四 指标五
13:38 356 418 240 282 52
13:39 356 419 246 289 51
13:40 357 418 244 286 51
13:41 352 423 241 285 52
13:42 346 415 244 288 50
13:43 386 413 242 281 56
13:44 368 420 234 283 54
13:45 377 424 239 270 51
13:46 384 429 237 272 52
13:47 376 414 242 279 55
13:48 362 441 246 275 51
13:49 361 434 251 290 50
13:50 352 432 232 280 53
这个是数据