<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>利用ECharts中使用地图热力图展示城市热度</title> <script src="echarts.min.js"></script> </head> <body> <div id="mapContainer" style="width: 800px; height: 600px;"></div> <script> var data = [ {name: '北京', value: 100}, {name: '上海', value: 90}, {name: '广州', value: 80}, // 其他城市数据... ]; // 创建ECharts实例 var myChart = echarts.init(document.getElementById('mapContainer')); // 配置地图热力图 var option = { // 使用中国地图 map: 'china', // 设置地图的放大与缩小的按钮不可见 roam: false, // 配置地图热力图的数据 series: [{ type: 'heatmap', coordinateSystem: 'geo', data: data }] }; // 关联数据与地图文件 myChart.setOption(option); </script> </body> </html>