男女比例饼图echarts
时间: 2023-10-30 18:05:37 浏览: 85
要制作男女比例饼图,您可以使用echarts库来实现。下面是一个示例代码,使用sessionStorage存储的数据来绘制男女比例饼图:
```javascript
import echarts from 'echarts';
import SessionStore from 'src/utils/sessionStore.js';
// 获取存储的男女比例数据
const maleCount = SessionStore.get('maleCount');
const femaleCount = SessionStore.get('femaleCount');
// 初始化echarts实例
const chart = echarts.init(document.getElementById('chartContainer'));
// 绘制饼图
chart.setOption({
series: [
{
type: 'pie',
data: [
{ name: '男性', value: maleCount },
{ name: '女性', value: femaleCount },
],
},
],
});
// 渲染图表
chart.render();
```
请注意,上述代码中的'maleCount'和'femaleCount'是自定义的存储键,您需要根据实际情况将其替换为真实的存储键。
此外,您还需要确保已经引入了echarts库,并在HTML中提供一个具有唯一ID的容器元素(例如`<div id="chartContainer"></div>`)来容纳饼图。
希望这可以帮助您制作男女比例饼图!
阅读全文