数据可视化大屏 项目中会有渲染地图的需要,除了百度地图以及高德地图外，也会需要echarts或者threejs效果的地图,今天为大家整理忻州市五寨县echarts地图和threejs地图效果实例供大家参考。地图基于geoJson数据绘制。
五寨县位于 山西省 忻州市 西部，总面积1387.6平方千米，五寨县辖3镇7乡107个行政村。县人民政府驻砚城镇。地势东南高，西部低。东南为石山区，主峰芦芽山海拔2736米，为县境最高峰。中部为“丁“字形盆地，以三岔为最低海拔1300米。北部与西北部为黄土丘陵。 五寨县境内主要河流是朱家川河及其支流清连河。年均气温4.3℃，一月零下14℃，七月19℃。年降雨量500毫米，无霜期120天。
echarts忻州市五寨县geoJson地图飞线图
echarts迁徙图实例,可以根据自己的需要配置飞线的颜色大小以及方向
echarts忻州市五寨县geoJson地图点击弹出自定义弹窗
我们可以通过scatter来设置自定义样式,但是这种自定义局限性很大,如果要求的样式很复杂的话,scatter就不能很好的实现了,所以我们可以通过鼠标点击获取横纵坐标,然后通过css来定位到对应的位置.
echarts忻州市五寨县geoJson地图tooltip自定义html
echarts tooltip演示自定义,通过toolTip的formatter方法以html+css的方式实现自己想要的样式效果,鼠标移上去就可以看到我们想要的效果了,也可以通过css自定义为自己需要的样式.
threejs忻州市五寨县geoJson地图3d地图添加描边效果
通过threejs绘制3d地图使用outlinePass 实现发光描边效果,如果想系统的学习threejs的话，可以观看threejs教程视频 WebGL/Three.js前端3D可视化教程
threejs忻州市五寨县geoJson地图3d地图红色描边闪烁警报
通过threejs绘制3d地图使用outlinePass 实现发光描边闪烁效果 以实现警报功能
threejs忻州市五寨县geoJson地图3d地图鼠标移入显示标签并高亮
通过threejs绘制的3d地图鼠标移入显示标签并高亮
忻州市五寨县 下辖有 三岔镇,胡会乡,前所乡,梁家坪乡,新寨乡,砚城镇,孙家坪乡,东秀庄乡,小河头镇,李家坪乡,杏岭子乡,韩家楼乡,三岔镇,胡会乡,前所乡,梁家坪乡,新寨乡,砚城镇,孙家坪乡,东秀庄乡,小河头镇,李家坪乡,杏岭子乡,韩家楼乡
忻州市五寨县下辖区域坐标
{"三岔镇":[111.68008207708198,39.17399736376289],"胡会乡":[111.79634715773078,38.99170234963768],"前所乡":[111.8952411864704,38.85681751214636],"梁家坪乡":[111.71956320793885,38.88200440029919],"新寨乡":[111.73278735240439,39.09647590466354],"砚城镇":[111.83420760580944,38.91650024881076],"孙家坪乡":[111.78982208395428,38.86994464292765],"东秀庄乡":[111.66497919234493,39.03154342279077],"小河头镇":[111.79287055101413,39.04992904742753],"李家坪乡":[111.93207878356937,38.98580150221747],"杏岭子乡":[111.58066496147492,38.97884005282782],"韩家楼乡":[111.55223309812993,39.11284125613494]}
忻州市五寨县行政划分代码
[{"name":"三岔镇","code":"140928102000"},{"name":"胡会乡","code":"140928204000"},{"name":"前所乡","code":"140928200000"},{"name":"梁家坪乡","code":""},{"name":"新寨乡","code":""},{"name":"砚城镇","code":"140928100000"},{"name":"孙家坪乡","code":"140928202000"},{"name":"东秀庄乡","code":"140928207000"},{"name":"小河头镇","code":"140928101000"},{"name":"李家坪乡","code":"140928201000"},{"name":"杏岭子乡","code":"140928208000"},{"name":"韩家楼乡","code":"140928206000"}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规，本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据，属性齐全，各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。
