使用Echarts制作热力图(Excel导入数据方式)

使用ECharts制作热力图通常涉及以下几个步骤：

1. **数据准备**：首先，你需要将Excel的数据导出到适合ECharts使用的格式，例如CSV、JSON或者数组。ECharts支持直接从服务器获取数据，也可以通过JavaScript处理本地文件。

2. **数据预处理**：对于Excel中的数据，可能需要清洗并转换成二维数组。每一行代表一条数据，一列对应一个维度。

[
  [值1_1, 值1_2, ..., 值1_n],
  [值2_1, 值2_2, ..., 值2_n],
  ...,
  [值m_1, 值m_2, ..., 值m_n]
]

3. **创建图表**：使用ECharts的API创建一个新的热力图实例，配置好图表类型(`heatmap`)、数据源以及其它必要的样式选项，如颜色映射、轴标签等。

var myChart = echarts.init(document.getElementById('main'));
myChart.setOption({
    series: [{
        type: 'heatmap',
        data: // 导入的二维数组数据，
        xAxisIndex: 0, // 如果有多个X轴，指定x轴索引
        yAxisIndex: 1, // 如果有多个Y轴，指定y轴索引
        colorAxis: {
            min: 0, max: 100 // 自定义颜色范围
        }
    }]
});

4. **加载数据**：调用`setOption`函数并将数据传递给它，然后通过`load`方法动态加载外部数据文件（如果数据来自Excel）。

echarts.util.request整式({
    url: 'data.xlsx', // Excel文件路径
    complete: function (res) {
        var data = JSON.parse(res.responseText);
        myChart.setOption({ series: [{ data: data }] });
    }
}, 'text');

5. **显示图表**：最后，调用`resize`方法确保图表适应容器大小，并显示出来。

window.addEventListener('resize', function () {
    myChart.resize();
});