随着开发 数据可视化大屏 项目越来越多,对地图的需求也各不相同,除了百度地图和高德地图外还会遇到echarts和threejs的需要,对地图的效果以及城市也各不相同,今天为大家整理濮阳市清丰县echarts地图和threejs地图效果实例供大家参考。地图基于geoJson数据绘制。
清丰县,隶属河南省濮阳市,位于河南省东北部,地理坐标:东经114°47′—115°23′;北纬35°45′—36°05′,全县总面积约828平方公里,属温带大陆性季风气候。截至2019年,总面积828平方公里,耕地面积85万亩,辖8镇9乡,是河南省扩权县之一 。根据第七次人口普查数据,截至2020年11月1日零时,清丰县常住人口592425人。
echarts濮阳市清丰县geoJson地图点击跳转到指定页面
为图标添加点击事件,点击图标,跳转到指定页面
echarts濮阳市清丰县geoJson地图 tooltip轮播
echarts地图实现类似tooltip轮播效果,通过effectScatter实现浮窗,并通过定时修改effectScatter的data来实现浮窗的移动.
echarts濮阳市清丰县geoJson地图定义颜色
echarts地图通过visualMap来事先设置好数据区间,根据区间来来显示地图的颜色,这里的visualMap数据是随机生成的,可以通过实例代码根据自己的需要配置颜色和数据区间.
threejs濮阳市清丰县geoJson地图3d地图自定义贴图加CSS2D标签
通过threejs绘制3d地图并添加CSS2D标签和自定义贴图,如果想系统的学习threejs的话,可以观看threejs视频教程 WebGL前端3D可视化教程
threejs濮阳市清丰县geoJson地图3d地图
通过threejs绘制的3d地图实例,如果想系统的学习threejs的话,可以观看threejs教程视频 Three.js 3D可视化
threejs濮阳市清丰县geoJson地图3d地图添加描边效果
通过threejs绘制3d地图使用outlinePass 实现发光描边效果,如果想系统的学习threejs的话,可以观看threejs视频教程 WebGL/Three.js前端3D可视化教程
濮阳市清丰县下辖有仙庄镇,纸房乡,马庄桥镇,古城乡,城关镇,六塔乡,双庙乡,固城乡,大屯乡,大流乡,巩营乡,柳格镇,阳邵乡,韩村乡,马村乡,高堡乡,瓦屋头镇
濮阳市清丰县下辖区域坐标
{"仙庄镇":[115.31067994875914,35.91967790255094],"纸房乡":[115.18292879311674,35.88919646805691],"马庄桥镇":[115.07124015092475,35.83086037361423],"古城乡":[115.06936181423919,35.98362091492217],"城关镇":[115.10835632453805,35.90477661673212],"六塔乡":[115.25306148843488,35.83324407513],"双庙乡":[115.1938286222557,35.82813521596338],"固城乡":[115.0270264595515,35.86864627947641],"大屯乡":[115.04136860181416,35.94978369517104],"大流乡":[115.1159909606275,35.98975528709146],"巩营乡":[115.32332154964155,35.98534842949867],"柳格镇":[115.12675100454402,35.84308249038777],"阳邵乡":[114.99291692075533,36.02902172289767],"韩村乡":[115.02637547159816,35.91084497888485],"马村乡":[115.22534236154902,35.95326810663949],"高堡乡":[115.16621230051854,35.96657674238404],"瓦屋头镇":[115.31197072125003,35.83365793072775]}
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规,本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据,属性齐全,各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。