请上传宽度大于 1200px,高度大于 164px 的封面图片
    调整图片尺寸与位置
    滚轮可以放大缩小图片尺寸,按住图片拖动可调整位置,多余的会自动被裁剪掉
取消
﹏ㄣ☆┈(uid:681)
职业资格认证:尚未取得认证

highcharts动态赋值(highcharts一个很不错的图表组件)

已有 2537 次阅读2012-11-28 15:58 |个人分类:IT技术| java, 拼接, 动态

在java后台拼接成如下的格式 :(列出的都是关键代码,用到的highcharts组件可以从官网下载)

String month="[{datestr:'一月份,二月份,三月份,四月份,五月份,六月份,七月份,八月份,九月份,十月份,十一月份,十二月份'}]";
    String ja = "["+month;
    String name="[{name:'杭州',data:[7.0, 6.9, 9.5, 14.5, 18.4, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]}," +
    "{name:'江西',data:[4.0, 2.9, 5.5, 24.5, 18.4, 11.5, 35.2, 36.5, 23.3, 38.3, 23.9, 3.6]}," +
    "{name:'北京',data:[14.0, 12.9, 15.5, 14.5, 28.4, 21.5, 15.2, 16.5, 13.3, 28.3, 13.9, 13.6]},"+
    "{name:'湖南',data:[3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]}]]"
    ;
    String str = ja+","+name;
    System.out.println(str);
       try {
     response().setCharacterEncoding("UTF-8");
     response().setContentType("text/plain");
     response().getWriter().print(str);
//     response().getWriter().print();
    } catch (IOException e) {
     e.printStackTrace();
    }

jsp页面上:

  $(document).ready(function(){

          xAxis: {//X轴数据
                    categories: [],
                    labels: {
                        rotation: -45, //字体倾斜
                        align: 'right',
                        style: { font: 'normal 13px 宋体' }
                    }
                },
                yAxis: {//Y轴显示文字
                    title: {
                        text: '产量/百万'
                    }
                },

             series:[]

  };

 $.ajax({
              url: "bf_transe.box",     
              type: "post",
              dataType: "json",
              success: function(result,status){
            
               var results= eval(result);
                var xs=results[0];   
                var ys=results[1];
                
                      var xdata = [];
                   var str = xs[0]['datestr']; 
                
                      xdata = str.split(",");
                    
                       $.each(xdata,function(m){
                              xdata.push(xdata[m]); //动态取值
                       });
                       
                       options.series=ys;          //serires赋值
                    
                  options.xAxis.categories = xdata;  //push完之后赋值
                  chart = new Highcharts.Chart(options);
               
             }
          });
   
        });

评论 (0 个评论)

返回顶部