用echarts在一个网页中实现4个扇形图

好的，我可以为您提供一个实现的思路：

首先，您需要在网页中引入 echarts 库，可以通过以下代码实现：

<script src="https://cdn.bootcdn.net/ajax/libs/echarts/5.1.2/echarts.min.js"></script>

然后，您需要在网页中创建 4 个 div 容器，用于分别显示 4 个扇形图，例如：

<div id="chart1" style="width: 400px; height: 400px;"></div>
<div id="chart2" style="width: 400px; height: 400px;"></div>
<div id="chart3" style="width: 400px; height: 400px;"></div>
<div id="chart4" style="width: 400px; height: 400px;"></div>

接下来，您可以通过以下代码创建 4 个 echarts 实例，并分别配置相应的数据和样式：

// 创建第一个扇形图实例
var chart1 = echarts.init(document.getElementById('chart1'));
var option1 = {
  series: [{
    type: 'pie',
    data: [
      {value: 335, name: '直接访问'},
      {value: 310, name: '邮件营销'},
      {value: 234, name: '联盟广告'},
      {value: 135, name: '视频广告'},
      {value: 1548, name: '搜索引擎'}
    ]
  }]
};
chart1.setOption(option1);

// 创建第二个扇形图实例
var chart2 = echarts.init(document.getElementById('chart2'));
var option2 = {
  series: [{
    type: 'pie',
    data: [
      {value: 335, name: '直接访问'},
      {value: 310, name: '邮件营销'},
      {value: 234, name: '联盟广告'},
      {value: 135, name: '视频广告'},
      {value: 1548, name: '搜索引擎'}
    ]
  }]
};
chart2.setOption(option2);

// 创建第三个扇形图实例
var chart3 = echarts.init(document.getElementById('chart3'));
var option3 = {
  series: [{
    type: 'pie',
    data: [
      {value: 335, name: '直接访问'},
      {value: 310, name: '邮件营销'},
      {value: 234, name: '联盟广告'},
      {value: 135, name: '视频广告'},
      {value: 1548, name: '搜索引擎'}
    ]
  }]
};
chart3.setOption(option3);

// 创建第四个扇形图实例
var chart4 = echarts.init(document.getElementById('chart4'));
var option4 = {
  series: [{
    type: 'pie',
    data: [
      {value: 335, name: '直接访问'},
      {value: 310, name: '邮件营销'},
      {value: 234, name: '联盟广告'},
      {value: 135, name: '视频广告'},
      {value: 1548, name: '搜索引擎'}
    ]
  }]
};
chart4.setOption(option4);

以上代码中，每个 echarts 实例都包含一个扇形图系列（series），并设置相应的数据和样式。您可以根据自己的需求修改数据和样式。

最后，您需要在网页中显示这 4 个扇形图，例如：

<div id="chart1" style="width: 400px; height: 400px;"></div>
<div id="chart2" style="width: 400px; height: 400px;"></div>
<div id="chart3" style="width: 400px; height: 400px;"></div>
<div id="chart4" style="width: 400px; height: 400px;"></div>

通过以上步骤，您就可以在一个网页中实现 4 个扇形图了。希望对您有所帮助！