使用Echarts圖表動態載入餅圖資料 pie
阿新 • • 發佈:2018-12-09
//JS成功後的程式碼functionbind(result){// 基於準備好的dom,初始化echarts圖表var TypeSalesChart = echarts.init(document.getElementById('main'));
var option = {
tooltip : {
trigger: 'item',
formatter: "{a} <br/>{b} : {c} ({d}%)"
},
legend: {
orient : 'vertical',
x : 'left',
data:(function(){var res = [];
var len = result.length;
for(var i=0,size=len;i<size;i++) {
res.push({
name: result[i].typeName,
});
}
return res;
})()
},
series : [
{
name:'訪問來源',
type:'pie',
radius : '55%',
center: ['50%', '60%'],
data:(function(){var res = [];
var len = result.length;
for(var i=0,size=len;i<size;i++) {
res.push({
//通過把result進行遍歷迴圈來獲取資料並放入Echarts中
name: result[i].typeName,
value: result[i].sales
});
}
return res;
})()
}
]
};
// 為echarts物件載入資料
TypeSalesChart.setOption(option);
}