可视化大屏 项目中会有渲染地图的需要,除了百度地图以及高德地图外,也会需要echarts或者threejs效果的地图,今天为大家整理周口市淮阳区echarts地图和threejs地图效果实例供大家参考。地图基于geoJson数据绘制。
淮阳区,隶属于河南省周口市,位于河南省东南部、周口市中部,行政区划面积1334.56平方千米, 根据第七次全国人口普查结果,截至2020年11月1日零时,淮阳区常住人口1022322人。淮阳区下辖2个街道、8个镇、9个乡,区人民政府驻羲皇大道中段。
echarts周口市淮阳区geoJson地图点击地图插小旗
echarts地图渲染点击地图显示自定义效果实例,效果类似点击插小旗的效果,通过scatter实现.
echarts周口市淮阳区geoJson地图地图排行榜效果
echarts地图根据数据渲染不同颜色的地图,并根据数据大小显示前10名的排序效果,属于地图map类型和柱状图bar类型混合效果
echarts周口市淮阳区geoJson地图定义颜色
echarts地图通过visualMap来事先设置好数据区间,根据区间来来显示地图的颜色,这里的visualMap数据是随机生成的,可以通过实例代码根据自己的需要配置颜色和数据区间.
threejs周口市淮阳区geoJson地图3d地图自定义贴图加CSS2D标签
通过threejs绘制3d地图并添加CSS2D标签和自定义贴图,如果对threejs感兴趣,可以观看threejs视频 WebGL/Three.js前端3D可视化教程
threejs周口市淮阳区geoJson地图3d地图CSS3D标签
通过threejs绘制的3d地图CSS3D标签实例,CSS3D不面向摄像机,跟随场景缩放,可以通过rotateY调整角度,通过scale调整大小,如果想系统的学习threejs的话,可以观看threejs视频课程 Three.js前端3D可视化
threejs周口市淮阳区geoJson地图3d地图css2d标签
通过threejs绘制的3d地图css2d标签实例,CSS2D面向摄像机,不随场景缩放而缩放,如果想系统的学习threejs的话,可以观看threejs视频教程 Three.js前端3D可视化
周口市淮阳区下辖有王店乡,黄集乡,临蔡镇,曹河乡,冯塘乡,朱集乡,四通镇,大连乡,白楼镇,安岭镇,新站镇,葛店乡,豆门乡,郑集乡,鲁台镇,齐老乡,刘振屯乡,城关回族镇
周口市淮阳区下辖区域坐标
{"王店乡":[114.86172839797797,33.66605265447036],"黄集乡":[115.02765634722432,33.82553274059929],"临蔡镇":[114.94250043796674,33.85559310294182],"曹河乡":[114.70544331323563,33.76753332991779],"冯塘乡":[115.00131609082362,33.59578029020302],"朱集乡":[114.94162672135047,33.5322776188906],"四通镇":[115.00221405286274,33.88922054707754],"大连乡":[114.9618828601049,33.70756177585733],"白楼镇":[114.88840312046221,33.78381078097533],"安岭镇":[114.84502130345334,33.85806432321088],"新站镇":[114.86139918874164,33.55228730235757],"葛店乡":[115.01706297421589,33.76372420051514],"豆门乡":[114.95603091041664,33.45225295125599],"郑集乡":[114.7837416822899,33.72509318985664],"鲁台镇":[115.01870951325515,33.49738034847067],"齐老乡":[114.76820523540891,33.84816266535155],"刘振屯乡":[114.91137793055,33.62778064692188],"城关回族镇":[114.87656907634592,33.74392256153338]}
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规,本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据,属性齐全,各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。