echart动态加载数据之柱状图--温度计式图表

layui.define(['jquery','echarts','ajax','modal'],function(exports){
    var $ = layui.jquery,
        echarts = layui.echarts, 
        ajax = layui.ajax, 
        modal = layui.modal;
    //初始化echarts实例
    var order = echarts.init(document.getElementById('integralcount'));
    order.showLoading({
        text: '正在努力的读取数据中...',    //loading话术
    });
    //订单统计
    var option = {
            title:{
                text:'商户积分统计',
                sublink: 'http://e.weibo.com/1341556070/AizJXrAEa'
            },
            tooltip : {
                trigger: 'axis',
                axisPointer : {            // 坐标轴指示器，坐标轴触发有效
                    type : 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                },
                formatter: function (params){
                    return params[0].name + '<br/>'
                           + params[0].seriesName + ' : ' + params[0].value + '<br/>'
                           + params[1].seriesName + ' : ' + (params[1].value + params[0].value);
                }
            },
            legend:{
                selectedMode:false,
                data:['已使用的积分','剩余的积分']
            },
            toolbox: {
                show : true,
                feature : {
                    mark : {show: true},
                    dataView : {show: true, readOnly: false},
                    restore : {show: true},
                    saveAsImage : {show: true}
                }
            },
           grid: {  
                left: '3%',  
                right: '4%',  
                bottom: '3%',  
                containLabel: true  
            },
            xAxis: [{
                type : 'category',
                data:[]
            }],
            yAxis : [
                     {
                         type : 'value',
                         boundaryGap: [0, 0.1]
                     }
             ],
            series : [{
                name : '剩余的积分',
                type : 'bar',
                stack: 'sum',
                barCategoryGap: '50%',
                itemStyle: {
                        normal: {
                            color: 'tomato',
                            barBorderColor: 'tomato',
                            barBorderWidth: 2,
                            barBorderRadius:0,
                            label : {
                                show: true, position: 'insideTop'
                            }
                        }
                    },
                 data : []
            },
            {
                name:'申请的积分',
                type:'bar',
                stack:'sum',
                itemStyle:{
                    normal:{
                         color: '#fff',
                         barBorderColor: 'tomato',
                         barBorderWidth: 2,
                         barBorderRadius:0,
                         label : {
                             show: true, 
                             position: 'top',
                             formatter: function (params) {
                                 for (var i = 0, l = option.xAxis[0].data.length; i < l; i++) {
                                     if (option.xAxis[0].data[i] == params.name) {
                                         return option.series[0].data[i] + params.value;
                                     }
                                 }
                             },
                             textStyle: {
                                 color: 'tomato'
                             }
                         }
                    }
                },
                data:[]
            }]
      };
    
        
            $.ajax({
                type : "post",
                async : false, //同步执行
                url : contextpath + '/merchantintegral/integralcountlist?&time='+ new Date().getTime(),
                dataType : "json", //返回数据形式为json
                success : function(result) {
                    if(result){
                        //初始化option.xAxis[0]中的data
                        option.xAxis[0].data=[];
                        for(var i=0;i<result.length;i++){
                          option.xAxis[0].data.push(result[i].name);
                        }
                        //初始化option.series[0]中的data
                        option.series[0].data =[];
                        option.series[1].data =[];
                        for(var i=0;i<result.length;i++){
                          option.series[0].data.push(result[i].integral_val);
                          option.series[1].data.push(result[i].count - result[i].integral_val);
                        }
                        order.hideLoading();    //隐藏加载动画
                        order.setOption(option);
                    }
                },
                error: function(errorMsg) {
                    alert("图表请求数据失败啦!");
                }
            })
    
        exports('integralcount',{});
});