韩建鑫院长
2017-08-25 02:07
采纳率: 71.4%
浏览 5.4k
已采纳

ajax获取后台数据在echarts上显示的是undefined

小白一个,这几天用echarts做图,ajax从后台获取到数据后在图上显示的是undefined,为什么啊!!!!!!

  • 写回答
  • 好问题 提建议
  • 关注问题
  • 收藏
  • 邀请回答

10条回答 默认 最新

  • 苏小苏 2017-08-25 02:10
    已采纳

    你填充不对吧。。。我赋值都是可以显示的

    已采纳该答案
    评论
    解决 无用
    打赏 举报
  • 煮酒思茶 2017-08-25 02:18

    没有找到那个程序,你看看是不是url地址填错了

    评论
    解决 无用
    打赏 举报
  • 韩建鑫院长 2017-08-25 02:31

    图片说明
    图片说明

    评论
    解决 无用
    打赏 举报
  • 韩建鑫院长 2017-08-25 02:32

    public void doPost(HttpServletRequest request, HttpServletResponse response)
    throws ServletException, IOException {
    System.out.println("9999999999999");
    response.setContentType("text/html;charset=utf-8");
    PrintWriter out = response.getWriter();
    request.setCharacterEncoding("utf-8");
    response.setCharacterEncoding("utf-8");

            try {
                String bookDataList = gdService.getBookDataList();
                System.out.println(bookDataList);
                out.print(bookDataList);  
            } catch (SQLException e) {
                // TODO Auto-generated catch block
                e.printStackTrace();
            }
    
    
    }
    
    评论
    解决 无用
    打赏 举报
  • 韩建鑫院长 2017-08-25 02:32

    //图书数据=====================================================================
    public String getBookDataList() throws SQLException{

    ArrayList bookDataList=new ArrayList();
    String sql = "select bookType,count(bookType) as borrowcount from book GROUP BY(bookType)";
    Result result=bd.getList(sql);
    Object[][] data=result.getRowsByIndex();
    for (int i = 0; i < data.length; i++) {
    Book book=new Book();
    book.setBookType(data[i][0].toString());
    book.setBorrowcount(Integer.parseInt(data[i][1].toString()));
    bookDataList.add(book);
    }
    String jsonstr="[";

    try {

    for(int i=0;i<bookDataList.size();i++){
    JSONObject json1 = new JSONObject();
    json1.put("bookType", bookDataList.get(i).getBookType());
    json1.put("borrowcount", bookDataList.get(i).getBorrowcount());

                if(i<bookDataList.size()-1){jsonstr=jsonstr+json1.toString()+",";}  
                if(i==bookDataList.size()-1){jsonstr=jsonstr+json1.toString();} 
            } 
        } catch (JSONException e) {  
            e.printStackTrace();  
        }   
        jsonstr=jsonstr+"]"; 
        System.out.println(jsonstr);
        return jsonstr;
    }
    
    评论
    解决 无用
    打赏 举报
  • 韩建鑫院长 2017-08-25 02:32
        var myChart = echarts.init(document.getElementById('main'));
         // 显示标题,图例和空的坐标轴
         myChart.setOption({
             title: {
                 text: '图书分类借阅量'
             },
             tooltip: {},
             legend: {
                 data:['借阅量']
             },
             xAxis: {
                 data: []
             },
             yAxis: {},
             series: [{
                 name: '借阅量',
                 type: 'bar',
                 data: []
             }]
         });
    
         myChart.showLoading();    //数据加载完之前先显示一段简单的loading动画
    
         var names=[];    //类别数组(实际用来盛放X轴坐标值)
         var nums=[];    //销量数组(实际用来盛放Y坐标值)
    
          $.ajax({
    
            type:"post",
            contentType:"application/x-www-form-urlencoded;charset=utf-8",
                   //异步请求(同步请求将会锁住浏览器,用户其他操作必须等待请求完成才可以执行)
         url : "servlet/GetAllDataServlet",    //请求发送到TestServlet处
         data : {},
         dataType : "json",        //返回数据形式为json
         success : function(result) {
    
             //请求成功时执行该函数内容,result即为服务器返回的json对象
             if (result) {
                    var obj = eval(result);
    
                    for(var i=0;i<obj.length;i++){ 
    
                       names.push(result[i].name);    //挨个取出类别并填入类别数组
                     }
                    for(var i=0;i<obj.length;i++){       
                        nums.push(result[i].num);    //挨个取出销量并填入销量数组
                      }
                    myChart.hideLoading();    //隐藏加载动画
                    myChart.setOption({        //加载数据图表
                        xAxis: {
                            data: names
                        },
                        series: [{
                            // 根据名字对应到相应的系列
                            name: '借阅量',
                            data: nums
                        }]
                    }); 
    
             }
    
        },
         error : function(errorMsg) {
             //请求失败时执行该函数
         alert("图表请求数据失败!");
         myChart.hideLoading();
         }
    
    });
    
    评论
    解决 无用
    打赏 举报
  • Tsui丶 2017-08-25 02:45

    开f12 调试一下 在watch中添加这个变量看下哪里获取有问题

    评论
    解决 无用
    打赏 举报
  • a892477088 2017-08-25 02:50

    看看返回的json数据 组装是否正确

    评论
    解决 无用
    打赏 举报
  • 韩建鑫院长 2017-08-25 02:55

    图片说明

    评论
    解决 无用
    打赏 举报
  • 苏小苏 2017-08-25 03:08

    ```var echartDevice = echarts.init(document.getElementById('echartDevice'));

        function searchStatFun() {
            echartOption = {
                title: { text: '设备分类统计', x: 'center' },
                tooltip: { trigger: 'item', formatter: "{a} <br/>{b} : {c} ({d}%)" },
                series: [{ name: '分类数量', type: 'pie', radius: '55%', center: ['50%', '60%'], data: [] }]
            };
            $.ajax({
                async: true,
                dataType: 'json',
                url: ur,              
                success: function (result) {
                    console.log(result);
                    if (result.retCode == "0000") {
                        if (result.list.length > 0) {
                            for (i in result.list) {
                                var type = result.list[i].deviceType;
                                var count = result.list[i].deviceCount;
                                echartOption.series[0].data.push({ value: count, name: type });
                            }
                            echartDevice.setOption(echartOption);
                        }
                    }
                }
            })            
        }
    
    
    
    评论
    解决 无用
    打赏 举报

相关推荐 更多相似问题