2 yjwzsrzj YJWZSRZJ 于 2017.09.09 12:01 提问

echerts 加载数据,出不来, 5C
 <script type="text/javascript">
        function loadData(option) {
            $.ajax({
                type : 'post',  //传输类型
                async : false,  //同步执行
                url : 'billecharts.action', //web.xml中注册的Servlet的url-pattern
                data : {},
                dataType : 'json', //返回数据形式为json
                success : function(result) {
                    if (result) {
                        //初始化xAxis[0]的data
                        option.xAxis[0].data = [];
                        for (var i=0; i<result.length; i++) {
                            option.xAxis[0].data.push(result[i].name);
                        }
                        //初始化series[0]的data
                        option.series[0].data = [];
                        for (var i=0; i<result.length; i++) {
                            option.series[0].data.push(result[i].num);
                        }
                    }
                },
                error : function(errorMsg) {
                    alert("加载数据失败");
                }
            });//AJAX
        }//loadData()
        var myChart = echarts.init(document.getElementById('main'));
        var option = {
            tooltip : {
                show : true
            },
            legend : {
                data : [ '收入','支出']
            },
            xAxis : [ {
                type : 'category'
            }],
            yAxis : [ {
                type : 'value'
            } ],
            series : [         
             {
                name : '收入',
                type : 'bar',

            }, 
            {
                name : '支出',
                type : 'bar',
            }
            ]
        };
        //加载数据到option
        loadData(option);
        //设置option
        myChart.setOption(option);
    </script>
 返回前台的格式   [{"bi_date":1504869888000,"bi_id":1,"expend":2000,"income":4000,"remark":"酒店支出"}]

求大神解决,刚刚接触这个

7个回答

YJWZSRZJ
YJWZSRZJ   2017.09.09 12:05

自己顶下,,。。。。。。。。。。。。。。。。。。。。。很急

tan944078639
tan944078639   2017.09.09 12:33
tan944078639
tan944078639 回复一只会飞的白菜: 这个我之前遇到过,你返回过来的是一个json, 不是一个数组 []
大约 2 个月之前 回复
tan944078639
tan944078639 回复一只会飞的白菜这么和你说吧 你先在js中定义一个数组 ,拿数组接收后台传输进来的值
大约 2 个月之前 回复
YJWZSRZJ
YJWZSRZJ 不行
2 个月之前 回复
YJWZSRZJ
YJWZSRZJ 可是我需要的值是从后台取出来的
2 个月之前 回复
qq_37782658
qq_37782658   2017.09.09 18:03

给你看下我写的 有点粗糙图片说明

qq_37782658
qq_37782658   2017.09.09 18:04

你的应该是同步执行的关系 换了试试

qq_37782658
qq_37782658   2017.09.09 18:09

![图片说明](http://img.ask.csdn.net/upload/201709/09/1504951700_258216.png)图片说明

三个饼图 两个折线图 上面是饼图的ajax
下面的是折线图的

qq_33727653
qq_33727653   2017.09.09 20:11

像option.xAxis[0].data.push(result[i].name这种改值的情况,echerts 是不认的,改完要setOption一遍,但是这种情况会可能出现问题!!!官网Api中有介绍,官网不建议这样做,建议的是myChart.setOption( {series: [{ data:nodes,edges: links }]} )形式,就是setOption里面重新写个option,但是可以需要改动什么就写什么,之前set的option仍然起作用,大体是这么个意思,具体的请去查下Api!!!!

YJWZSRZJ
YJWZSRZJ   2017.09.09 21:57

  var myChart = echarts.init(document.getElementById('main'));        
  //设置图标配置项
  myChart.setOption({
      title:{
          text:'酒店财务报表'
      },
      tooltip:{},
      legend:{
          data:['收入','支出']
      },
      xAxis:{
          data:[]
      },
      yAxis:{},
      series:[
          {
              name:'收入',
              type:'bar',
              data:[]
          },
          {
              name:'支出',
              type:'bar',
              data:[]
          }

      ]
  })
  //异步加载数据
  $.get('billecharts.action').done(function (data) {
      data = eval('('+data+')');   
      console.log(data)
      myChart.setOption({                
          xAxis:{
              data:data.bi_date
          },                
          series:[
              {    
                  //根据名字对应到相应的系列
                  name:"收入",
                  type:'bar',
                  data:data.income
              },
              {
                  name:'支出',
                  type:'bar',
                  data:data.expend
              }

          ]
      })
  })
```改了下还是不可以

YJWZSRZJ
YJWZSRZJ
2 个月之前 回复
YJWZSRZJ
YJWZSRZJ
2 个月之前 回复
Csdn user default icon
上传中...
上传图片
插入图片