通过ajax,写一个Echaerts的饼图
时间: 2024-05-11 19:17:39 浏览: 71
好的,这是一个技术问题,我可以为您提供帮助。首先,您需要引入Echarts库的相关文件,然后通过ajax从后端获取数据,并使用Echarts提供的API来生成饼图。以下是一个简单的示例代码:
```
// 引入Echarts库的相关文件
<script src="/path/to/echarts.min.js"></script>
// 通过ajax从后端获取数据
$.ajax({
url: '/path/to/data',
success: function(data) {
// 使用Echarts提供的API来生成饼图
var myChart = echarts.init(document.getElementById('pie-chart'));
var option = {
title : {
text: '饼图示例',
x:'center'
},
tooltip : {
trigger: 'item',
formatter: "{a} <br/>{b} : {c} ({d}%)"
},
legend: {
orient: 'vertical',
left: 'left',
data: ['数据1','数据2','数据3','数据4','数据5']
},
series : [
{
name: '访问来源',
type: 'pie',
radius : '55%',
center: ['50%', '60%'],
data:[
{value:data.data1, name:'数据1'},
{value:data.data2, name:'数据2'},
{value:data.data3, name:'数据3'},
{value:data.data4, name:'数据4'},
{value:data.data5, name:'数据5'}
],
itemStyle: {
emphasis: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)'
}
}
}
]
};
myChart.setOption(option);
}
});
```
阅读全文