数据大屏可视化 项目中经常需要渲染echarts地图,为了不同城市快速实现,将不同城市的echarts地图效果整理出来,今天为大家整理梧州市藤县echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
echarts梧州市藤县geoJson地图 tooltip轮播
echarts地图实现类似tooltip轮播效果,通过effectScatter实现浮窗,并通过定时修改effectScatter的data来实现浮窗的移动.
echarts梧州市藤县geoJson地图区域闪烁
echarts地图有时候为了突出某一块区域的重要性,会进行两个颜色的交替变化来告诉用户这一块需要重点关注,我们可以通过echarts的dispatchAction来实现我们想要的效果.
echarts梧州市藤县geoJson地图指定区域高亮
echarts让指定区域变为选中高亮状态
threejs梧州市藤县geoJson地图3d地图CSS3D标签
通过threejs绘制的3d地图CSS3D标签实例,CSS3D不面向摄像机,跟随场景缩放,可以通过rotateY调整角度,通过scale调整大小 Vue3 threejs 在3d地图中绘制css3d标签标注省份,如果想系统的学习threejs的话,可以观看threejs视频教程 WebGL/Three.js前端高薪3D可视化
threejs梧州市藤县geoJson地图3d地图CSS2D外加旋转棱锥
通过threejs绘制3d地图CSS2D外加旋转棱锥效果
threejs梧州市藤县geoJson地图3d地图指定区域闪烁
通过threejs绘制3d地图并让指定区域闪烁
梧州市藤县 下辖有 象棋镇,金鸡镇,藤县宁康乡,和平镇,埌南镇,塘步镇,大黎镇,天平镇,太平镇,岭景镇,平福乡,新庆镇,蒙江镇,藤州镇,同心镇,东荣镇,古龙镇
梧州市藤县下辖区域坐标
{"象棋镇":[110.72796988109928,23.138207586532],"金鸡镇":[110.84948597451945,23.21762010658145],"藤县宁康乡":[110.42672569432433,23.91054573697495],"和平镇":[110.6429977814129,23.55550272645787],"埌南镇":[111.08123681237538,23.25235262211377],"塘步镇":[111.074731073901,23.37183703177482],"大黎镇":[110.50136757901211,23.92097665424313],"天平镇":[110.70176064330894,23.38485601417926],"太平镇":[110.67610701057811,23.65706487647503],"岭景镇":[110.61896333234421,23.1832184639069],"平福乡":[110.78669866424076,23.82992059201724],"新庆镇":[110.71660563064256,23.278013162364],"蒙江镇":[110.7463395430284,23.53999111267512],"藤州镇":[110.90835111444636,23.39617098744285],"同心镇":[110.98792437841911,23.22157319294731],"东荣镇":[110.6331088965224,23.79444190031916],"古龙镇":[110.85776988908418,23.6930693317734]}
梧州市藤县行政划分代码
[{"name":"象棋镇","code":"450422108000"},{"name":"金鸡镇","code":"450422106000"},{"name":"藤县宁康乡","code":""},{"name":"和平镇","code":"450422112000"},{"name":"埌南镇","code":"450422104000"},{"name":"塘步镇","code":"450422103000"},{"name":"大黎镇","code":"450422116000"},{"name":"天平镇","code":"450422110000"},{"name":"太平镇","code":"450422113000"},{"name":"岭景镇","code":"450422109000"},{"name":"平福乡","code":"450422200000"},{"name":"新庆镇","code":"450422107000"},{"name":"蒙江镇","code":"450422111000"},{"name":"藤州镇","code":"450422100000"},{"name":"同心镇","code":"450422105000"},{"name":"东荣镇","code":"450422115000"},{"name":"古龙镇","code":"450422114000"}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规,本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据,属性齐全,各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。
4、当前除了包含有关键地区的geoJson地图信息外还包含有28个echarts地图效果,以及13个threejs地图实例效果,限于篇幅不一一展示,可以通过更多echarts和threejs地图效果实例查看