着色地图一直都是Excel中一个大难题,但是最近我发现,Deepsek竟然可以直接生成着色地图,省份、城市、甚至是区县的都可以生成,还能提供下载为图片的按钮,真的太实用了,跟大家分享下使用的方法
一、获取代码
大家需要要先复制下方的代码,让Deepseek根据下方的代码做仿写,这个代码我整整询问了2个多小时,Deepseek才给出了正确的答案,实在是太艰辛了,这个代码的本质就是编写一个地图的网页,在网页中提供了下载图片的功能
<!DOCTYPE html><html><head> <meta charset='UTF-8'> <title>河南数据地图</title> <script src='https://cdn.staticfile.org/echarts/5.4.0/echarts.min.js'></script> <style> .control-panel { position: absolute; top: 20px; right: 20px; background: white; padding: 15px; box-shadow: 0 2px 8px rgba(0,0,0,0.1); border-radius: 4px; z-index: 1; } .control-group { margin: 10px 0; } label { display: block; margin: 5px 0; color: #666; } #downloadBtn { margin-top: 10px; padding: 8px 15px; background: #2196F3; color: white; border: none; border-radius: 4px; cursor: pointer; } </style></head><body style='margin:0; padding:20px; background:#f0f0f0'> <div id='map' style='width: 1200px;height:800px;margin:0 auto;background:white;box-shadow:0 2px 8px rgba(0,0,0,0.1)'></div> <div class="control-panel"> <div class="control-group"> <label>最小值颜色:</label> <input type="color" id="minColor" value="#ffffff"> </div> <div class="control-group"> <label>最大值颜色:</label> <input type="color" id="maxColor" value="#d20000"> </div> <button id="downloadBtn">下载图片</button> </div> <script> const chart = echarts.init(document.getElementById('map')); let currentOption = { title: { text: '河南着色地图', left: 'center', textStyle: { fontSize: 18 } }, tooltip: { trigger: 'item', formatter: (params) => `${params.name}<br/>数值:${params.value || '无'}` }, visualMap: { min: 806, max: 7935, calculable: true, inRange: { color: ['#FFFFFF', '#D20000'] }, textStyle: { color: '#666' }, left: '30px', bottom: '30px' }, series: [{ type: 'map', map: '河南', roam: true, data: [ {name: '郑州市', value: 7935}, {name: '洛阳市', value: 5802}, {name: '南阳市', value: 4555}, {name: '许昌市', value: 3747}, {name: '周口市', value: 3617}, {name: '新乡市', value: 3464}, {name: '商丘市', value: 3262}, {name: '驻马店市', value: 3257}, {name: '信阳市', value: 3196}, {name: '平顶山市', value: 2824}, {name: '开封市', value: 2677}, {name: '三门峡市', value: 1778}, {name: '濮阳市', value: 1776}, {name: '漯河市', value: 1281}, {name: '鹤壁市', value: 1075}, {name: '济源市', value: 806}, ], label: { show: true, formatter: function(params) { const val = Number(params.value); return (!isNaN(val) && val !== 0) ? `${params.name}\n${val}` : params.name; }, color: '#333', fontSize: 12, lineHeight: 18, rich: { b: { fontSize: 12, lineHeight: 18, align: 'center' } } }, emphasis: { itemStyle: { areaColor: '#a7d5ed' }, label: { color: '#000' } } }] }; // 颜色修改功能 function updateColors() { currentOption.visualMap.inRange.color = [ document.getElementById('minColor').value, document.getElementById('maxColor').value ]; chart.setOption(currentOption); } // 下载功能 document.getElementById('downloadBtn').addEventListener('click', () => { const img = new Image(); img.src = chart.getDataURL({ type: 'png', pixelRatio: 2, backgroundColor: '#fff' }); img.onload = () => { const a = document.createElement('a'); a.download = '河南数据地图.png'; a.href = img.src; a.click(); }; }); // 绑定颜色修改事件 document.getElementById('minColor').addEventListener('change', updateColors); document.getElementById('maxColor').addEventListener('change', updateColors); // 加载地图数据 fetch('https://geo.datav.aliyun.com/areas_v3/bound/410000_full.json') .then(r => r.json()) .then(geoJson => { echarts.registerMap('河南', geoJson); chart.setOption(currentOption); }) .catch(err => alert('地图加载失败:' + err)); </script></body></html>
二、代码仿写
首先我们需要将代码复制给Deepseek,然后将自己的数据放在下方,并且告诉Deepseek来做数据的替换,生成对应的图表即可。如果你不会也可以直接使用我的提示词,稍等下就会得到代码
提示词:以上是河南省城市的着色地图,请仿照这个代码,帮我做一份河北省的着色地图,并且将下方的数据代入到代码中,结果以html代码输出给我
三、运行代码
得到代码后,我们需要对代码做一下复制,不能在Deepseek中直接点击运行,因为文件比较大,会渲染失败。
复制后,点击鼠标右键新建一个【文本文档】之后打开文本文档,按下Ctrl+V将代码粘贴到里面保存一下
最后点击文本文档,重命名,将扩展名【txt】更改为【html】确定后双击打开网页,就能看到地图了。
可以在下方修改颜色,显示哪些数据比较大,也可以下载为图片,这个可以根据自己的需要来设置。
省份的,区县的地图,也是一样的操作,制作省份与区县的,记得打开【深度思考】结果会更加的准确,大家可以动手试一下,还是非常好用的!
END