amchartsJS版使用教程以及案例.docx

amchartsJS版使用教程以及案例.docx

《amchartsJS版使用教程以及案例.docx》由会员分享，可在线阅读，更多相关《amchartsJS版使用教程以及案例.docx（20页珍藏版）》请在冰点文库上搜索。

amchartsJS版使用教程以及案例

1、单个学生成绩分析Action：

Java代码 

1./** 

2. * @功能：

单个学生成绩分析 

3. * @作者:

 smile 

4. * @时间：

2013-1-15 下午2:

23:

21 

5. * @版本：

1.0 

6. */  

7.public class StudentScoreAnalyseAction extends AbstractAction {  

8.  

9.    // 成绩单分数id  

10.    private int eduScoreListId;  

11.    // 成绩单id  

12.    private int eduExamInfoId;  

13.    // 成绩单科目  

14.    private String subjectName;  

15.    // 学生id  

16.    private String userid;  

17.    // 学生姓名  

18.    private String userName;  

19.    // 成绩单科目集合  

20.    private List EduExamList;  

21.    // 最高分  

22.    private String maxScore;  

23.    // 最低分  

24.    private String minScore;  

25.    // 平均分  

26.    private String averageScore;  

27.    // 子女得分  

28.    private String score;  

29.    // 此次考试参加学生数  

30.    private int studentNum;  

31.    // 1：

总分分析 2：

单个科目分析  

32.    private int flag;  

33.    // 班级id  

34.    private String classId;  

35.  

36.    protected String go（） throws Exception {  

37.        ScoreManageSrevice scoreManageService = （ScoreManageSrevice） this.getBean（"scoreManageSrevice"）;  

38.        EduExamList = scoreManageService.getSubjectByExamInfoId（eduExamInfoId）;  

39.        userName = .URLDecoder.decode（userName, "UTF-8"）;  

40.        classId = scoreManageService.getClassIdByEduExamInfoId（eduExamInfoId）;  

41.          

42.        if （flag == 1 || flag == 3） {// 总数分析  

43.            // 统计最高分  

44.            maxScore = scoreManageService.getMaxScore（eduExamInfoId）;  

45.            // 统计最低分  

46.            minScore = scoreManageService.getMinScore（eduExamInfoId）;  

47.            // 统计子女得分  

48.            score = scoreManageService.getStudentScore（eduExamInfoId, userid）;  

49.            // 统计平均得分  

50.            averageScore = scoreManageService.getAverageScore（eduExamInfoId）;  

51.            // 统计人数  

52.            studentNum = scoreManageService.getStudentNum（eduExamInfoId）;  

53.  

54.            if （flag == 3） {  

55.                return "success";  

56.            }  

57.            return "input";  

58.        } else if （flag == 2） {// 单个科目分析  

59.            if （subjectName !

= null && !

"".equals（subjectName）） {  

60.                subjectName = .URLDecoder.decode（subjectName, "UTF-8"）;  

61.                // 统计该科目最高分  

62.                maxScore = scoreManageService.getSubjectMaxScore（eduExamInfoId, subjectName）;  

63.                // 统计该科目最低分  

64.                minScore = scoreManageService.getSubjectMinScore（eduExamInfoId, subjectName）;  

65.                // 统计该用户userId 该科目subjectName的得分  

66.                score = scoreManageService.getSubjectStudentScore（eduExamInfoId, subjectName, userid）;  

67.                // 统计该科目平均分  

68.                averageScore = scoreManageService.getSubjectAverageScore（eduExamInfoId, subjectName）;  

69.                // 统计参加考试人数  

70.                studentNum = scoreManageService.getStudentNum（eduExamInfoId）;  

71.  

72.                return "success";  

73.            }  

74.        }  

75.        return null;  

76.    }  

77.  

78.    省略get... set....  

79.}  

 2、xml配置：

Xml代码 

1.

-- 单个学生成绩分析 -->  

2.          

3.            /scoremanage/studentScoreAnalyse_index.ftl  

4.              

5.          

 3、页面：

Html代码 

1.$（document）.ready（function（）{  

2.      

3.    

--当第一次进来页面  显示总分-->  

4.    if（${flag}==1）{  

5.        var chart;    

6.        var chartData = [     

7.                            {  

8.                                category:

'最高分',  

9.                                score:

'${maxScore}',  

10.                                color:

 "#FF0F00"  

11.                            },  

12.                            {  

13.                                category:

'最低分',  

14.                                score:

'${minScore}',  

15.                                color:

 "#88003B"  

16.                            },  

17.                            {  

18.                                category:

'平均分',  

19.                                score:

'${averageScore}',  

20.                                color :

 "#FF4D34"  

21.                            },  

22.                            {  

23.                                category:

'${userName}分数',  

24.                                score:

'${score}',  

25.                                color :

 "#0081AC"  

26.                            }  

27.                        ];  

28.                          

29.        AmCharts.ready（function（）{  

30.                  

31.                chart = new AmCharts.AmSerialChart（）;  

32.                chart.dataProvider = chartData;  

33.                chart.categoryField = "category";  

34.                

--the following two lines makes chart 3D-->   

35.                chart.depth3D = 20;  

36.                chart.angle = 30;  

37.                

--字体大小-->  

38.                chart.fontSize = 13;  

39.                chart.startDuration = 1;  

40.                chart.columnWidth = 0.4;  

41.                  

42.                

--category-->  

43.                var categoryAxis = chart.categoryAxis;  

44.                

--横轴文字角度 0为水平显示  90为竖直显示  默认90-->  

45.                categoryAxis.labelRotation = 0;  

46.                categoryAxis.dashLength = 5;  

47.                categoryAxis.gridPosition = "start";  

48.                

--横轴字体大小-->  

49.                categoryAxis.fontSize = 13;  

50.                

--横轴上下偏移量-->  

51.                categoryAxis.offset = 0;  

52.                

--横轴字刻线长度 无太大作用-->  

53.                categoryAxis.tickLength = 8;  

54.                

--竖性网格线-->  

55.                categoryAxis.gridAlpha = 0;  

56.                  

57.  

58.                

--value-->  

59.                var valueAxis = new AmCharts.ValueAxis（）;  

60.                valueAxis.dashLength = 5;  

61.                

--竖轴的厚度  没太大用处-->  

62.                valueAxis.axisThickness = 1;  

63.                valueAxis.gridAlpha = 0;  

64.                chart.addValueAxis（valueAxis）;  

65.  

66.                

--GRAPH-->              

67.                var graph = new AmCharts.AmGraph（）;  

68.                graph.valueField = "score";  

69.                graph.colorField = "color";  

70.                graph.balloonText = "[[category]]:

 [[score]]";  

71.                graph.type = "column";  

72.                graph.lineAlpha = 0;  

73.                graph.fillAlphas = 1;  

74.                  

75.                graph.lineThickness = 1;  

76.                chart.addGraph（graph）;  

77.  

78.                

--WRITE-->   

79.                chart.write（"chartdiv"）;  

80.        }）;   

81.    }  

82.}）;  

83.  

84.  

85.  

86.

 100%; height:

 500px;">