大屏数据可视化 项目中经常需要渲染echarts地图，为了不同城市快速实现，将不同城市的echarts地图效果整理出来，今天为大家整理朔州市应县echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
应县，隶属 山西省 朔州市。地处山西省北部、大同盆地南端，东望恒山之险，南扼雁门之要，北连大同煤海，西依朔州电都。地跨东经112°58’—113°37’，北纬39°17’—39°45’之间，全县平面图呈平行四边形。东邻浑源县，西向平朔邻山阴县，北邻怀仁市，南毗繁峙县、代县。全县国土面积1708平方千米，辖3镇9乡、298个行政村。根据第七次人口普查数据，截至2020年11月1日零时，应县常住人口为243970人。县政府驻金城镇。
echarts朔州市应县geoJson地图点击跳转到指定页面
为图标添加点击事件,点击图标,跳转到指定页面
echarts朔州市应县geoJson地图label自定义样式
echarts通过scatter实例可以配置自己想要的图标,以及label文字的样式效果
echarts朔州市应县geoJson地图根据经纬度显示自定义html弹窗
echarts地图我们可以通过像素坐标来将我们自定义的html弹窗定位到echarts地图指定位置,如果是固定的宽高的话,这没什么问题直接定位就可以了,如果是自适应宽高的地图我们可能没办法控制精度,我们可以使用经纬度来控制,当echarts地图渲染完成以后,我们可以通过convertToPixel将经纬度转为像素坐标,然后再渲染自定义弹窗,这样精度就比较准确了,而且也不会因为窗体宽高变化而导致弹窗出现偏移.
threejs朔州市应县geoJson地图3d地图指定区域闪烁
通过threejs绘制3d地图并让指定区域闪烁,如果想系统的学习threejs的话，可以观看threejs教程视频 Three.js视频教程3D可视化
threejs朔州市应县geoJson地图3d地图添加金色效果
通过threejs绘制3d地图使用outlinePass实现金色描边效果,并通过edgeStrength增加强度,让描边更清晰
threejs朔州市应县geoJson地图3d地图鼠标移入显示标签并高亮
通过threejs绘制的3d地图鼠标移入显示标签并高亮
朔州市应县 下辖有 义井乡,南泉乡,南河种镇,镇子梁乡,下社镇,下马峪乡,大临河乡,大黄巍乡,白马石乡,杏寨乡,藏寨乡,金城镇,义井乡,南泉乡,南河种镇,镇子梁乡,下社镇,下马峪乡,大临河乡,大黄巍乡,白马石乡,杏寨乡,藏寨乡,金城镇
朔州市应县下辖区域坐标
{"义井乡":[113.26263676038846,39.66544729533091],"南泉乡":[113.22138881342073,39.37523086820714],"南河种镇":[113.23656887137422,39.4515087904521],"镇子梁乡":[113.27341728029444,39.57723766418547],"下社镇":[113.29531475218201,39.51656775893048],"下马峪乡":[113.13719879370679,39.36480099701853],"大临河乡":[113.41044794123003,39.5593719579435],"大黄巍乡":[113.06082558311195,39.5434977120213],"白马石乡":[113.43047851605587,39.40125577411291],"杏寨乡":[113.07505498030936,39.45765511848764],"藏寨乡":[113.07815214508132,39.63222643187785],"金城镇":[113.17512121671652,39.56775117921545]}
朔州市应县行政划分代码
[{"name":"义井乡","code":"140622201000"},{"name":"南泉乡","code":"140622206000"},{"name":"南河种镇","code":"140622101000"},{"name":"镇子梁乡","code":"140622200000"},{"name":"下社镇","code":"140622102000"},{"name":"下马峪乡","code":"140622205000"},{"name":"大临河乡","code":"140622207000"},{"name":"大黄巍乡","code":"140622203000"},{"name":"白马石乡","code":"140622208000"},{"name":"杏寨乡","code":"140622204000"},{"name":"藏寨乡","code":""},{"name":"金城镇","code":"140622100000"}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规，本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据，属性齐全，各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。
