highcharts例子

直接看代码

<script language="JavaScript">
$(document).ready(function() {   
    $.ajax({
        type:'post',
        url:'<%=basePath%>charts/getData?type=column',
        success:function(result){
            result=eval(result);
                var chart={
                        type:'column'
                }
              var title = {
                      text: '班级统计'   
                   };
                   var xAxis = {
                      categories: ['one', 'two', 'three', 'four', 'five']
                   };
                   var yAxis = {
                      title: {
                         text: '比例'
                      }
                   };
                   var plotOptions = {
                      line: {
                         dataLabels: {
                            enabled: true
                         },   
                         enableMouseTracking: true
                      }
                   };
                   var series= result;   
                   var credits = {
                              enabled: false
                           };
                   var json = {};
                    
                   json.chart=chart;
                   json.title = title;
                   json.xAxis = xAxis;
                   json.yAxis = yAxis;  
                   json.series = series;
                   json.credits = credits;
                   json.plotOptions = plotOptions;
                   $('#container').highcharts(json);
                  
                
            
            
        },
        error:function(){
            alert(2);
        }
    
    });
});
 
</script>

后台代码：

@RequestMapping(value="getData",method=RequestMethod.POST)
    public void getData(HttpServletRequest request,HttpServletResponse response,String type){
        List list = new ArrayList();
        HighCharts hc = new HighCharts();
        HighCharts hc2 = new HighCharts();
        List lt = new ArrayList();
        List lt2 = new ArrayList();
        hc.setName("test");
        hc2.setName("wolf");
        hc.setType("line");
        hc2.setType("line");
        Random rd=new Random();
        for (int i=0;i<10;i++) {
            Map<String, Object> map = new HashMap<String, Object>();
            map.put("name", "test1");
            map.put("y", rd.nextInt(100));
            map.put("percentage", (i+1)*0.3*100);
            lt.add(map);
        }
        for (int i=0;i<10;i++) {
            Map<String, Object> map = new HashMap<String, Object>();
            map.put("name", "test1");
            map.put("y", rd.nextInt(100));
            map.put("percentage", (i+1)*0.3*100);
            lt2.add(map);
        }
        hc.setData(lt);
        hc2.setData(lt2);
        list.add(JSONObject.toJSON(hc));
        list.add(JSONObject.toJSON(hc2));
        
        try {
            
            response.getWriter().print(list);
        } catch (IOException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }
    }