echart性别比例饼图制作
时间: 2023-07-31 08:06:33 浏览: 303
好的,以下是使用 ECharts 制作性别比例饼图的步骤:
1. 引入 ECharts 库
```html
<script src="https://cdn.bootcdn.net/ajax/libs/echarts/4.9.0/echarts.min.js"></script>
```
2. 准备容器
```html
<div id="chart" style="width: 600px; height: 400px;"></div>
```
3. 初始化图表对象
```javascript
var chart = echarts.init(document.getElementById('chart'));
```
4. 配置图表选项
```javascript
var option = {
title: {
text: '性别比例',
left: 'center'
},
tooltip: {
trigger: 'item',
formatter: '{a} <br/>{b}: {c} ({d}%)'
},
legend: {
orient: 'vertical',
left: 'left',
data: ['男性', '女性']
},
series: [
{
name: '性别比例',
type: 'pie',
radius: ['50%', '70%'],
avoidLabelOverlap: false,
label: {
show: false,
position: 'center'
},
emphasis: {
label: {
show: true,
fontSize: '30',
fontWeight: 'bold'
}
},
labelLine: {
show: false
},
data: [
{value: 60, name: '男性'},
{value: 40, name: '女性'}
]
}
]
};
```
5. 渲染图表
```javascript
chart.setOption(option);
```
以上是一个简单的性别比例饼图制作的例子,你可以根据自己的需求进行更改。
阅读全文