highcharts ajax动态数据

js调用方法处
highcharts ajax动态数据_第1张图片
js方法 ajax以及赋值

function tubiao (){
    var chart;//定义图表
    var y = [];//Y轴
    var y1 = [];//Y轴
    var xtext = [];//X轴TEXT 
        $.ajax({
            type:'get',
            url : $.el.Register.AppUrl + "zsgc/selecttubiao",//请求数据的地址
            data:{
                kssj:$('#kssjtubiao').val(),//获取开始时间
                jssj:$('#jssjtubiao').val()//获取结束时间

            },
            success:function(data){
                var y = [];//Y轴
                var y1 = [];//Y轴
                for(var key=0 ; key//给Y轴赋值 应收多少钱
                    y1.push(data[key].pai);//给Y轴赋值 已收烧钱
                    xtext.push( data[key].htbh);//给X轴TEXT赋值
                }
                chart = new Highcharts.Chart({//柱形图主体配置
                    chart:{
                        renderTo:'container',
                        type:'column' //显示类型 柱形
                    },
                    title:{
                        text:'合同' //图表的标题
                    },
                    xAxis:{
                        categories:xtext//给名字赋值
                    },
                    yAxis:{
                        title:{
                            text:'元' //Y轴的名称
                        },
                    },
                    series:[{
                        name:'应收',
                       data:y //数据库返回值push进y数组内 自动处理进页面
                      },{
                       name:'已收',
                       data:y1 //同上
                    }]
                });


            },
            error:function(e){
            } 
        });

}

页面显示效果
highcharts ajax动态数据_第2张图片

后台返回值为list集合 如果不是集合需要在Controller处理为集合 另外时间控件使用 Bootstrap-datetimepicker 除了设置结束时间不可小于开始时间 ,基本为默认
highcharts ajax动态数据_第3张图片
“表名为 TB_RENTAL 应收字段为 t.payable 已收字段为t.paid 注意字段数据类型 这里使用to_date把传过来的值转换为date数据类型。
使用group by 分组”
BETWEEN AND 中间值 包涵当前值 相当于>= <= 并非 <>

<select id="selecttubiao" resultType="com.elitel.orcl.zsgc.entity.main.ext.ExtTbRental" parameterType="com.elitel.orcl.zsgc.entity.main.ext.ExtTbRental">
        select t.htbh,sum(t.payable) paya,sum(t.paid) pai from TB_RENTAL t where to_date(t.paydate,'yyyy-mm-dd') BETWEEN to_date(#{kssj,jdbcType=VARCHAR},'yyyy-mm-dd') AND to_date(#{jssj,jdbcType=VARCHAR},'yyyy-mm-dd') group by t.htbh having sum(t.payable)- sum(t.paid)> 0 and sum(t.paid)>0 order by t.htbh  
  select>

你可能感兴趣的:(学习日志)