echarts 饼图

110 阅读 0 评论 73 点赞

我是靠谱客的博主温暖老鼠，这篇文章主要介绍echarts 饼图，现在分享给大家，希望可以做个参考。

1. HTML

复制代码

1
<div id="myChart3" :style="{width: '1200px', height: '300px'}"></div>

2.JS

复制代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
drawpic(){
let myChart = this.$echarts.init(document.getElementById('myChart3'))
// 绘制图表
myChart.setOption({
//title: { text: 'CAR 追踪整体状况' },
tooltip: {
trigger: 'item',
formatter: "{b} :{c} {d}%"// "{a} <br/>{b} :{c} {d}%"
},
series: [{
name:this.PiePicName,
type: 'pie',
data:this.pieData,
}]
});
},

3.Data 里的值

复制代码

1
2
3
4
5
6
7
pieData:[
{value:235, name:'视频广告'},
{value:274, name:'联盟广告'},
{value:310, name:'邮件营销'},
{value:335, name:'直接访问'},
{value:400, name:'搜索引擎'}
],