数据大屏 项目中经常需要渲染echarts地图,为了不同城市快速实现,将不同城市的echarts地图效果整理出来,今天为大家整理新乡市卫滨区echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
卫滨区,隶属于 河南省 新乡市 ,位于新乡市区西南部,处于东经113°78′—113°89′,北纬35°22′—35°32′之间,北部以卫河为界与新乡市牧野区相邻,东部以胜利路至化工路至和平路中心线为界与新乡市红旗区相邻,西部、南部以辖区平原镇自然界为界与新乡县相邻,总面积约52平方千米。卫滨区地质构造为新华夏系和北西向构造体系,属暖温带大陆性季风气候,辖区过境河流3条。根据全国第七次人口普查数据显示,截至2020年11月1日零时,卫滨区常住人口239956人。
echarts新乡市卫滨区geoJson地图热力图
echarts通过heatmap实现热力图效果
echarts新乡市卫滨区geoJson地图添加柱状图
echarts地图渲染时,为了让地图上的数据有一个对比的效果,会在地图上标注柱状图,以便于更直观的看出各个区域的数值.
echarts新乡市卫滨区geoJson地图圆形波纹状气泡图
echarts地图渲染时,会通过effectScatter实现一个圆形外加波纹扩散效果的气泡来使页面看起来更酷炫.
threejs新乡市卫滨区geoJson地图3d地图
通过threejs绘制的3d地图实例,如果想系统的学习threejs的话,可以观看threejs视频教程 WebGL/Three.js前端3D可视化教程
threejs新乡市卫滨区geoJson地图3d地图添加旋转棱锥
通过threejs绘制3d地图并在指定经纬度上添加带波纹效果不停旋转的棱锥效果实例,如果想系统的学习threejs的话,可以观看threejs视频课程 WebGL/Three.js前端3D可视化教程
threejs新乡市卫滨区geoJson地图3d地图CSS3D标签
通过threejs绘制的3d地图CSS3D标签实例,CSS3D不面向摄像机,跟随场景缩放,可以通过rotateY调整角度,通过scale调整大小,如果对threejs感兴趣,可以观看threejs教程视频 Three.js前端3D可视化
新乡市卫滨区下辖有中同街街道,健康路街道,铁西街道,解放路街道,平原乡,南桥街道,胜利路街道,自由路街道
新乡市卫滨区下辖区域坐标
{"中同街街道":[113.81331583477149,35.30823552599709],"健康路街道":[113.85875669415768,35.30029909017768],"铁西街道":[113.83509406449197,35.30210635294829],"解放路街道":[113.86284173559808,35.30896500192245],"平原乡":[113.83100686387678,35.27425628649544],"南桥街道":[113.85853292880543,35.28507666705646],"胜利路街道":[113.86496382488826,35.26987093597616],"自由路街道":[113.85587988146995,35.31004826536152]}
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规,本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据,属性齐全,各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。