运用echart 从后天绘制饼图，有些显示不出来

<script type="text/javascript" language="javascript">
var myChart;
var eCharts;

require.config({
paths : {
'echarts' : './js/echarts' ,
'echarts/chart/line' : './js/echarts' , //需要的组件
'echarts/chart/pie' : './js/echarts'  //需要的组件
}
});

require(
[ 'echarts', 
  'echarts/chart/line',
  'echarts/chart/pie'
], DrawEChart //异步加载的回调函数绘制图表
);

//创建ECharts图表方法
function DrawEChart(ec) {
eCharts = ec;
myChart = eCharts.init(document.getElementById('main'));
myChart.showLoading({
text : "图表数据正在努力加载..."
});
//定义图表options
var options = {
title : {
text : "测试",
subtext : "纯属虚构",
sublink : "http://www.baidu.com"
},
tooltip : {
trigger: 'item',
        formatter: "{a} <br/>{b} : {c} ({d}%)"
},
legend : {
orient: 'vertical',
        left: 'left',
data: []
},
toolbox : {
show : true,
feature : {
mark : {
show : true
},
dataView : {
show : true,
readOnly : false
},
magicType : {
show : true,
type : [ 'line', 'pie' ]
},
restore : {
show : true
},
saveAsImage : {
show : true
}
}
},
calculable : true,
series : [ {
name : '销售类型',
type : 'pie',
radius : '55%',
             center: ['50%', '60%'],
data : [
],//必须是Integer类型的,String计算平均值会出错
                 itemStyle: {
                 emphasis: {
                    shadowBlur: 10,
                    shadowOffsetX: 0,
                    shadowColor: 'rgba(0, 0, 0, 0.5)'
                }
            }
   } ]
};
myChart.setOption(options); //先把可选项注入myChart中
myChart.hideLoading();
getChartData();//aja后台交互 
}
</script>


<script type="text/javascript">
function getChartData() {
//获得图表的options对象
var options = myChart.getOption();
debugger;
//通过Ajax获取数据
$.ajax({
type : "post",
async : false, //同步执行
url : "http://localhost:8080/chart/test/HelloBar",
data : {},
dataType : "json", //返回数据形式为json
success : function(result) {
if (result) {
alert(result[0].name);
    debugger;
    var arr = [];
     for(var i=0;i<result.length;i++){
                                                     console.log(result[i].name);
                                                    arr.push(result[i].name);
                                         } 
                                         debugger;
options.legend.data = arr;
alert("options.legend.data"+options.legend.data);
options.series[0].data.name = arr;
//options.xAxis.data = arr;
var brr = [];
     for(var i=0;i<result.length;i++){
                                                  console.log(result[i].num);
                                                  brr.push(result[i].num);
                                         } 
options.series[0].data= brr;

myChart.hideLoading();
myChart.setOption(options);
alert(options);
}
},
error : function(errorMsg) {
alert("不好意思，大爷，图表请求数据失败啦!");
myChart.hideLoading();
}
});
}
</script>



想显示legend，其中数据是通过options.legend.data = arr;debugger时能够读取到数据，但是就是在页面中显示不出来，同理options.series[0].data.name = arr;也是，series中的data没有name这个属性，如要添加，应该怎样添加？

1 个解决方案

#1

该回复于2018-02-09 09:46:36被管理员删除