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 + '
' + params[0].seriesName + ' : ' + params[0].value + '
' + 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

你可能感兴趣的:(echart动态加载数据之柱状图--温度计式图表)