数据大屏可视化 项目中经常需要渲染echarts地图,为了不同城市快速实现,将不同城市的echarts地图效果整理出来,今天为大家整理周口市西华县echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
西华县,别称娲皇故都,隶属河南省周口市,位于河南省中部偏东,黄淮平原中部,属黄河冲积平原,东西长57千米,南北平均宽21千米,总面积1194平方千米。西华县地处豫东平原、黄淮流域,属暖温带半湿润季风气候,四季分明,光照充足,冬季干冷少雪,夏季炎热多雨,春秋温和而时间较短。截至2021年10月,西华县辖4个街道、9个镇、8个乡,另辖2个乡级单位。县政府驻娲城街道。根据第七次全国人口普查结果,截至2020年11月1日零时,西华县常住人口692846人。
echarts周口市西华县geoJson地图迁徙图
echarts飞线图实例,可以根据自己的需要配置飞线的颜色大小以及方向
echarts周口市西华县geoJson地图添加柱状图
echarts地图渲染时,为了让地图上的数据有一个对比的效果,会在地图上标注柱状图,以便于更直观的看出各个区域的数值.
echarts周口市西华县geoJson地图水滴状气泡图
echarts地图渲染时,会通过一个水滴状小气泡来将数值渲染到地图上,我们可以可以通过scatter来实现我们想要的效果.
threejs周口市西华县geoJson地图3d地图css2d标签
通过threejs绘制的3d地图css2d标签实例,CSS2D面向摄像机,不随场景缩放而缩放,如果想系统的学习threejs的话,可以观看threejs课程视频 WebGL 3D可视化教程
threejs周口市西华县geoJson地图3d地图鼠标移入显示标签并高亮
通过threejs绘制的3d地图鼠标移入显示标签并高亮,如果想系统的学习threejs的话,可以观看threejs视频 WebGL/Three.js前端高薪3D可视化
threejs周口市西华县geoJson地图3d地图添加金色效果
通过threejs绘制3d地图使用outlinePass实现金色描边效果,并通过edgeStrength增加强度,让描边更清晰,如果对threejs感兴趣,可以观看threejs教程视频 WebGL/Three.js前端3D可视化教程
周口市西华县下辖有皮营乡,田口乡,迟营乡,址坊镇,聂堆镇,奉母镇,艾岗乡,大王庄乡,五二农场,逍遥镇,东夏亭镇,东王营乡,叶埠口乡,昆山街道,李大庄乡,清河驿乡,黄土桥乡,红花集镇,西夏亭镇,西华营镇,黄泛区农场,娲城街道,箕子台街道
周口市西华县下辖区域坐标
{"皮营乡":[114.62332556743459,33.78962437113123],"田口乡":[114.55622631573996,33.8441875986435],"迟营乡":[114.51705391684216,33.74086512966741],"址坊镇":[114.15642663468111,33.68872056478329],"聂堆镇":[114.54149134923952,33.90863415327806],"奉母镇":[114.16035836891213,33.7537297129163],"艾岗乡":[114.34337253660158,33.81720699145792],"大王庄乡":[114.56095162199956,33.70067839615626],"五二农场":[114.55623856511406,33.8130369522311],"逍遥镇":[114.25138982538903,33.74121010113005],"东夏亭镇":[114.65823120019387,33.87594506069873],"东王营乡":[114.61001423627908,33.7236298609397],"叶埠口乡":[114.45593767731339,33.69086593355009],"昆山街道":[114.54177222368068,33.80396060343304],"李大庄乡":[114.55478129193273,33.64936408200022],"清河驿乡":[114.65948261709717,33.8094480916576],"黄土桥乡":[114.445734562818,33.76320926651662],"红花集镇":[114.45725997023862,33.85000096448487],"西夏亭镇":[114.3694287311875,33.73932551460684],"西华营镇":[114.63928624646272,33.92501670153138],"黄泛区农场":[114.50565369251457,33.72353262948405],"娲城街道":[114.51862053224816,33.77686119419118],"箕子台街道":[114.5142421759734,33.80968027668265]}
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规,本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据,属性齐全,各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。