大屏数据可视化 项目中经常需要渲染echarts地图，为了不同城市快速实现，将不同城市的echarts地图效果整理出来，今天为大家整理济宁市汶上县echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
汶上地处山东省西南部，东临古城兖州，西接水泊梁山，南依微山湖，北枕东岳泰山。东经116°40′—116°18′、北纬35°31′—35°36′，大部分地区处于平原地带，汶上县属北温带大陆性季风湿润气候区。总面积889平方千米。根据第七次人口普查数据，截至2020年11月1日零时，汶上县常住人口为687544人。
echarts济宁市汶上县geoJson地图自定义引导线
echarts地图渲染中,会遇到多个地名凑到一块导致名称重叠的情况,这时候我们可以通过一条线指向对应的位置并通过label来进行标注的效果.
echarts济宁市汶上县geoJson地图根据经纬度显示自定义html弹窗
echarts地图我们可以通过像素坐标来将我们自定义的html弹窗定位到echarts地图指定位置,如果是固定的宽高的话,这没什么问题直接定位就可以了,如果是自适应宽高的地图我们可能没办法控制精度,我们可以使用经纬度来控制,当echarts地图渲染完成以后,我们可以通过convertToPixel将经纬度转为像素坐标,然后再渲染自定义弹窗,这样精度就比较准确了,而且也不会因为窗体宽高变化而导致弹窗出现偏移.
echarts济宁市汶上县geoJson地图阴影
echarts地图阴影效果实例,通过shadowColor控制阴影的颜色,通过shadowBlur控制范围,通过shadowOffsetX和shadowOffsetY控制偏移.
threejs济宁市汶上县geoJson地图3d地图添加旋转棱锥
通过threejs绘制3d地图并在指定经纬度上添加带波纹效果不停旋转的棱锥效果实例,如果想系统的学习threejs的话，可以观看threejs课程视频 WebGL前端3D可视化教程
threejs济宁市汶上县geoJson地图3d地图自定义贴图加CSS2D标签
通过threejs绘制3d地图并添加CSS2D标签和自定义贴图
threejs济宁市汶上县geoJson地图3d地图CSS3D标签
通过threejs绘制的3d地图CSS3D标签实例，CSS3D不面向摄像机，跟随场景缩放,可以通过rotateY调整角度,通过scale调整大小 Vue3 threejs 在3d地图中绘制css3d标签标注省份
济宁市汶上县 下辖有 刘楼镇,南旺镇,苑庄镇,郭仓镇,义桥镇,军屯乡,南站镇,汶上街道,寅寺镇,康驿镇,杨店镇,次丘镇,白石镇,郭楼镇,中都街道
济宁市汶上县下辖区域坐标
{"刘楼镇":[116.39921839320192,35.60259890623261],"南旺镇":[116.37411360877547,35.5698160290351],"苑庄镇":[116.56850482774996,35.7423090401554],"郭仓镇":[116.48848622330627,35.79987789580798],"义桥镇":[116.56674804603904,35.6573816879164],"军屯乡":[116.61609567298648,35.88760927311354],"南站镇":[116.5046378102687,35.64672021085016],"汶上街道":[116.5035245609544,35.74778274044913],"寅寺镇":[116.4010493620201,35.73051495125402],"康驿镇":[116.51624217709721,35.57251259018179],"杨店镇":[116.55007228775722,35.83976552970609],"次丘镇":[116.39521195161913,35.67693368508615],"白石镇":[116.61684147600594,35.80151774834965],"郭楼镇":[116.38337834313302,35.77595653807298],"中都街道":[116.49841981045859,35.7251346502395]}
济宁市汶上县行政划分代码
[{"name":"刘楼镇","code":"370830112000"},{"name":"南旺镇","code":"370830102000"},{"name":"苑庄镇","code":"370830107000"},{"name":"郭仓镇","code":"370830109000"},{"name":"义桥镇","code":"370830108000"},{"name":"军屯乡","code":"370830205000"},{"name":"南站镇","code":""},{"name":"汶上街道","code":"370830002000"},{"name":"寅寺镇","code":"370830104000"},{"name":"康驿镇","code":"370830106000"},{"name":"杨店镇","code":"370830111000"},{"name":"次丘镇","code":""},{"name":"白石镇","code":"370830110000"},{"name":"郭楼镇","code":"370830105000"},{"name":"中都街道","code":"370830001000"}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规，本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据，属性齐全，各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。
4、当前除了包含有关键地区的geoJson地图信息外还包含有28个echarts地图效果,以及13个threejs地图实例效果,限于篇幅不一一展示
