数据大屏 项目中经常需要渲染echarts地图，为了不同城市快速实现，将不同城市的echarts地图效果整理出来，今天为大家整理黄冈市蕲春县echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
蕲春县，隶属湖北省黄冈市，位于湖北省东南部，长江中游以北。蕲春建县于公元前201年，距今有2200多年的历史，历为州、路、府所在地，以州领县长达1080余年。明朝在蕲州设荆王府，历十代，传198年。蕲春县是武汉城市圈的重要组成部分，被誉为著名的“教授县”，以人才辈出著称。县域面积2398平方公里，东至武穴市境界5公里，北临省级黄标公路，南与独山相望，西至蕲春县城区、京九铁路蕲春火车站3公里。
动态效果
echarts黄冈市蕲春县geoJson地图全局颜色渐变
echarts地图渲染时,除了局部区域渐变外也会遇到整个地图的颜色渐变效果,我们可以通过areaColor的linear-gradient来实现我们想要的效果
echarts黄冈市蕲春县geoJson地图定义颜色
echarts地图通过visualMap来事先设置好数据区间,根据区间来来显示地图的颜色,这里的visualMap数据是随机生成的,可以通过实例代码根据自己的需要配置颜色和数据区间.
echarts黄冈市蕲春县geoJson地图点击地图插小旗
echarts地图渲染点击地图显示自定义效果实例,效果类似点击插小旗的效果,通过scatter实现.
threejs黄冈市蕲春县geoJson地图3d地图
通过threejs绘制的3d地图实例 vue3 threejs 在vue3项目中绘制3d地图效果实例,如果对threejs感兴趣，可以观看threejs视频 Three.js前端3D可视化
threejs黄冈市蕲春县geoJson地图3d地图鼠标移入显示标签并高亮
通过threejs绘制的3d地图鼠标移入显示标签并高亮
threejs黄冈市蕲春县geoJson地图3d地图CSS3D标签
通过threejs绘制的3d地图CSS3D标签实例，CSS3D不面向摄像机，跟随场景缩放,可以通过rotateY调整角度,通过scale调整大小 Vue3 threejs 在3d地图中绘制css3d标签标注省份
黄冈市蕲春县 下辖有 青石镇,八里湖农场,刘河镇,向桥乡,狮子镇,管窑镇,张榜镇,彭思镇,株林镇,横车镇,檀林镇,漕河镇,大同镇,蕲州镇,赤东镇,李时珍医药工业园区
黄冈市蕲春县下辖区域坐标
{"青石镇":[115.74145990349436,30.28995072417713],"八里湖农场":[115.33431992724579,30.11991800311505],"刘河镇":[115.60966421274614,30.28554744732096],"向桥乡":[115.82269531688462,30.3312530803308],"狮子镇":[115.63591608292204,30.43913796987203],"管窑镇":[115.29673300116067,30.19189123041296],"张榜镇":[115.80665093393844,30.4217148616409],"彭思镇":[115.27904475635361,30.24926492896252],"株林镇":[115.51287823472825,30.40208849301011],"横车镇":[115.36525187312654,30.31280961515009],"檀林镇":[115.80834797904602,30.56158144196333],"漕河镇":[115.48842499340147,30.24569991457575],"大同镇":[115.77437066956425,30.52773410256191],"蕲州镇":[115.40153210896338,30.07583402294963],"赤东镇":[115.4237253869795,30.15862353790773],"李时珍医药工业园区":[115.44462535510311,30.22324833201133]}
黄冈市蕲春县行政划分代码
[{"name":"青石镇","code":"421126109000"},{"name":"八里湖农场","code":""},{"name":"刘河镇","code":"421126107000"},{"name":"向桥乡","code":"421126200000"},{"name":"狮子镇","code":"421126108000"},{"name":"管窑镇","code":"421126103000"},{"name":"张榜镇","code":""},{"name":"彭思镇","code":"421126104000"},{"name":"株林镇","code":"421126106000"},{"name":"横车镇","code":"421126105000"},{"name":"檀林镇","code":"421126112000"},{"name":"漕河镇","code":"421126100000"},{"name":"大同镇","code":"421126111000"},{"name":"蕲州镇","code":"421126102000"},{"name":"赤东镇","code":"421126101000"},{"name":"李时珍医药工业园区","code":""}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规，本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据，属性齐全，各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。
