echarts 实现扇形图

ECharts是一个流行的JavaScript图表库，可以轻松创建各种复杂的图表，包括扇形图。在ECharts中实现扇形图的步骤如下：

1. **引入ECharts库**：首先需要在HTML文件中引入ECharts的CDN链接，或者本地引入其js文件。

<script src="https://cdn.jsdelivr.net/npm/echarts@latest/dist/echarts.min.js"></script>

2. **初始化图表**：创建一个`<div>`元素并赋予它一个ID，用于ECharts实例化。

<div id="chart" style="width: 600px;height:400px;"></div>

3. **配置数据和选项**：在JavaScript中编写配置对象，包含数据(`series`)、图表类型(`type`)以及其它属性。

var option = {
    title: {
        text: '扇形图示例'
    },
    tooltip: {},
    series: [{
        name: '各部分占比',
        type: 'pie', // 扇形图类型
        data: [
            { value: 335, name: '部分一' },
            { value: 310, name: '部分二' },
            { value: 234, name: '部分三' },
            { value: 135, name: '部分四' },
            { value: 150, name: '部分五' }
        ],
        radius: ['50%', '70%'], // 自定义扇区大小
        center: ['50%', '60%'] // 扇形中心位置
    }]
};

4. **实例化图表并渲染**：

var myChart = echarts.init(document.getElementById('chart'));
myChart.setOption(option);

完成以上步骤后，页面上就会显示一个基本的扇形图。你可以根据需求调整颜色、标签样式等细节。