echarts饼图动态获取数据

　　饼图获取动态数据

　　首先页面引入jquery.js和echarts.js

　官方文档例子的获取静态数据

option = {
    title : {
        text: '某站点用户访问来源',
        subtext: '纯属虚构',
        x:'center'
    },
    tooltip : {
        trigger: 'item',
        formatter: "{a} {b} : {c} ({d}%)"
    },
    legend: {
        orient : 'vertical',
        x : 'left',
        data:['直接访问','邮件营销','联盟广告','视频广告','搜索引擎']
    },
    toolbox: {
        show : true,
        feature : {
            mark : {show: true},
            dataView : {show: true, readOnly: false},
            magicType : {
                show: true, 
                type: ['pie', 'funnel'],
                option: {
                    funnel: {
                        x: '25%',
                        width: '50%',
                        funnelAlign: 'left',
                        max: 1548
                    }
                }
            },
            restore : {show: true},
            saveAsImage : {show: true}
        }
    },
    calculable : true,
    series : [
        {
            name:'访问来源',
            type:'pie',
            radius : '55%',
            center: ['50%', '60%'],
            data:[
                {value:335, name:'直接访问'},
                {value:310, name:'邮件营销'},
                {value:234, name:'联盟广告'},
                {value:135, name:'视频广告'},
                {value:1548, name:'搜索引擎'}
            ]
        }
    ]
};
                   

　然后把官方文档例子的获取静态数据，改为用ajax获取后台数据库传递数据：

　　echarts.jsp：

 

Insert title here
    
    
    


    
  
    
    
      
        var echartsPie = echarts.init(document.getElementById('echartsPie'));  
        
        // $.get('js/data.json').done(function (data) {
            $.post("user_linkByPhone.action", function(datas) {
             s//alert(datas);
             console.log(datas);
              var data= $.parseJSON(datas);    //将传递过来的json字符串转化为对象
             //alert(data);
              console.log(data);
             var servicedata=[];
             for(var i=0;i