Echarts 饼图,折线图,柱状图,条形图ajax动态渲染数据方法汇总

本文汇总了Echarts中饼图、折线图的ajax动态渲染数据方法,讲解如何根据官网示例设置数据格式,实现数据的动态更新。
摘要由CSDN通过智能技术生成

Echarts的各种图表渲染方法其实速途同归,你对照着官网的demo里的数据格式,设置好回传数据的接受格式就行,下面看各个demo。

一.Echarts折线图

function getIndex(URL) {
        $.ajax({
            dataType: "json",
            type: "GET",
            url: URL,
            async: true,  //ajax异步true
            success: function (json) {
                var status = json.status;             
                var repairdata = json.repairPatchTotalData;
                var repairlabels= ["aaa","bbb","ccc"];
                var repairDangerCounts = [];
                var repairSelectCounts = [];
                var repairTotalCounts = [];
                var repairseries = [];
                var repaircounts =[];
                var repairdate = [];
                       
                 var repairItem = function(){
                    return {
                        name:"",
                        type:'line',
                        data:[]
                    }
                };
                if (status == 0) {
   
                    //数据渲染
                      $("#patch_repair_loading_image").remove();
                     $(".patch_repair_loading").append('<span id="patch_repair_msg" style="position:relative;bottom: 150px;font-size: 15px;color: #999;">'+'暂无数据...'+'</span>')                
                     if (repairdata.length != 0){
                        $("#patch_repair_msg").remove();

                        //遍历获取x轴日期数据和三条折线的数据
                        for (var i = 0; i < repairdata.length; i++) {
                            repairdate.push(repairdata[i].date);
                            repairDangerCounts.push(repairdata[i].dangerRepair);
                            repairSelectCounts.push(repairdata[i].selectRepair);
                            repairTotalCounts.push(repairdata[i].totalRepair);
                        }                    
                          repaircounts.push(repairDangerCounts);
                          repaircounts.push(repairSelectCounts)
                          repaircounts.
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值