Echarts读取excel数据

Echarts 可以通过使用 echarts-gl 和 echarts-liquidfill 插件来读取 excel 数据。

首先需要引入相关插件和依赖：

<!-- 引入 echarts 核心文件 -->
<script src="https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js"></script>
<!-- 引入 echarts-gl 插件 -->
<script src="https://cdn.jsdelivr.net/npm/echarts-gl/dist/echarts-gl.min.js"></script>
<!-- 引入 echarts-liquidfill 插件 -->
<script src="https://cdn.jsdelivr.net/npm/echarts-liquidfill/dist/echarts-liquidfill.min.js"></script>
<!-- 引入 xlsx 插件 -->
<script src="https://cdn.jsdelivr.net/npm/xlsx/dist/xlsx.full.min.js"></script>

然后使用 `FileReader` 对象读取 excel 文件，并将数据转换为数组格式，最后将数据传递给 echarts 进行绘制。

// 选择文件的 input 元素
const input = document.querySelector('input[type=file]');

// 当用户选择文件时执行以下操作
input.addEventListener('change', function() {
  const file = input.files[0];
  const reader = new FileReader();
  reader.readAsArrayBuffer(file);

  // 读取 excel 文件
  reader.onload = function(e) {
    const data = new Uint8Array(reader.result);
    const workbook = XLSX.read(data, { type: 'array' });
    const sheet = workbook.Sheets[workbook.SheetNames[0]];
    const json = XLSX.utils.sheet_to_json(sheet);

    // 将数据传递给 echarts 进行绘制
    const chart = echarts.init(document.getElementById('chart'));
    chart.setOption({
      xAxis: {
        type: 'category',
        data: json.map(item => item.x)
      },
      yAxis: {
        type: 'value'
      },
      series: [
        {
          data: json.map(item => item.y),
          type: 'line'
        }
      ]
    });
  }
});

以上代码仅为示例，具体实现方式可以根据实际需求进行调整。