使用AmCharts 5在同一页面生成多个图表失败求助

嘿，我看了你的问题和代码片段，其实你的createChart函数思路是对的，大概率是调用细节或者页面配置的问题，给你几个排查方向：

• 确保页面上有多个带唯一ID的容器div：你不能只依赖一个chartdiv，得给每个图表单独准备容器，比如：

  <div id="chartdiv1"></div>
  <div id="chartdiv2"></div>
  

  别忘了给这些容器设置宽高样式，不然图表可能直接隐身：

  #chartdiv1, #chartdiv2 {
    width: 100%;
    height: 350px;
  }
  

• 调用函数时传入不同的ID参数：要针对每个图表单独调用createChart，传入对应的容器ID和专属数据，举个例子：

  // 第一组图表数据
  const dataSet1 = [
    { category: "作业完成", value: 65 },
    { category: "作业未完成", value: 35 }
  ];
  // 第二组图表数据
  const dataSet2 = [
    { category: "及格", value: 80 },
    { category: "不及格", value: 20 }
  ];
  
  // 分别生成两个图表
  createChart("chartdiv1", dataSet1);
  createChart("chartdiv2", dataSet2);
  

• 补全函数里的数据源绑定代码：你提供的代码最后是s...，看起来大概率漏掉了把传入的data绑定到图表系列的步骤，这步没做的话图表没数据就不会显示，得加上：

  series.data.setAll(data);
  

如果这些都检查过还是不行，打开浏览器控制台看看有没有报错信息，AmCharts 5初始化出错时会在控制台输出提示，能帮你快速定位问题~

备注：内容来源于stack exchange，提问作者José Maciel