echart读取数据库数据画柱状图

var xAxisData = [];
var legendData = ['chenrui'];
var dataList = [];
var echartdata,dat;
$.ajax({
async : false,
// cache : false,
type : 'POST',
dataType:'json',
url : 'ksxlfmxController.do?queryKsSum',// 请求的action路径
error : function() {// 请求失败处理函数
},
success : function(data) {
echartdata = data.msg;
// console.log(echartdata);
}
});

dat = JSON.parse(echartdata);
console.log(dat);
for(var i=0; i<dat.length;i++){
xAxisData.push(dat[i].ks);
dataList.push(dat[i].result);
}
console.log("xAxisData: "+xAxisData);
console.log("xAxisData length: "+xAxisData.length);
console.log("dataList: "+dataList);
console.log("dataList length: "+dataList.length);
// dataList = [][];
var option = {
    tooltip: {
      //  trigger: 'axis'
    },
    legend: {
    type: 'scroll',
         orient: 'vertical',
         right: 10,
         top: 20,
         bottom: 20,
        data: legendData
    },
toolbox: {
show : true,
//orient: 'vertical',
x: 'left',
y: 'top',
feature : {
mark : {show: true},
dataView : {show: true, readOnly: false},
magicType : {show: true, type: ['line', 'bar', 'stack', 'tiled']},
restore : {show: true},
saveAsImage : {show: true}
}
},
    dataZoom: [{
        type: 'slider',
        start: 50,
        end: 70
    }, {
        type: 'inside',
        start: 50,
        end: 70
    }],
    xAxis: {
        data: xAxisData
    },
    yAxis: {},
//     series: echarts.util.map(dataList, function (data, index) {
//         return {
//             type: 'bar',
//             animation: false,
//             name: legendData[index],
//     stack:'1',
//             itemStyle: {
//                 normal: {
//                     opacity: 1
//                 }
//             },
//             data: data
//         };
//     })
series:[{
name:'chenrui',
type:'bar',
data:dataList
}
]
};
var myChart = echarts.init(document.getElementById('aaa'));

myChart.setOption(option);
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值