数据大屏 项目中经常需要渲染echarts地图,为了不同城市快速实现,将不同城市的echarts地图效果整理出来,今天为大家整理张家界市永定区echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
echarts张家界市永定区geoJson地图点击地图获取经纬度
echarts地图渲染后,有时候会需要点击后获取到经纬度信息,通过经纬度信息来查询一些内容,这里我们可以通过convertFromPixel来获取经纬度.
echarts张家界市永定区geoJson地图圆形波纹状气泡图
echarts地图渲染时,会通过effectScatter实现一个圆形外加波纹扩散效果的气泡来使页面看起来更酷炫.
echarts张家界市永定区geoJson地图点击跳转到指定页面
为图标添加点击事件,点击图标,跳转到指定页面
threejs张家界市永定区geoJson地图3d地图鼠标移入显示标签并高亮
通过threejs绘制的3d地图鼠标移入显示标签并高亮,如果对threejs感兴趣,可以观看threejs视频课程 WebGL前端3D可视化教程
threejs张家界市永定区geoJson地图3d地图css2d标签
通过threejs绘制的3d地图css2d标签实例,CSS2D面向摄像机,不随场景缩放而缩放 vue3 threejs实现在3d地图中绘制css2d地名
threejs张家界市永定区geoJson地图3d地图添加旋转棱锥
通过threejs绘制3d地图并在指定经纬度上添加带波纹效果不停旋转的棱锥效果实例
张家界市永定区 下辖有 旱科所,谢家垭乡,天门山镇,新桥镇,茅岩河镇,合作桥乡,沅古坪镇,大庸桥街道,桥头乡,崇文街道,猪石头林场,南庄坪街道,罗水乡,四都坪乡,三家馆乡,尹家溪镇,教字垭镇,永定街道,王家坪镇,罗塔坪乡,西溪坪街道,茅溪水库管理所,原种场,官黎坪街道
张家界市永定区下辖区域坐标
{"旱科所":[110.22864779032568,29.17306023881635],"谢家垭乡":[110.64569812102302,28.99792160635315],"天门山镇":[110.51420178663889,29.02890993987364],"新桥镇":[110.5148093312225,29.22911462319835],"茅岩河镇":[110.18258142162057,29.24939931858809],"合作桥乡":[110.57878267405727,29.24809703336623],"沅古坪镇":[110.7386398884947,28.99297277689227],"大庸桥街道":[110.39195486590847,29.18372524800133],"桥头乡":[110.26573600855578,29.3353656526516],"崇文街道":[110.55940322644113,29.16570741918403],"猪石头林场":[110.19481391091534,29.27622232322202],"南庄坪街道":[110.38601930071783,29.07242959207954],"罗水乡":[110.26301317564415,29.27438376269011],"四都坪乡":[110.43288751006946,28.95137457910522],"三家馆乡":[110.292939190267,29.14891237511099],"尹家溪镇":[110.35245603072298,29.18489460290663],"教字垭镇":[110.34646563212203,29.29722637978086],"永定街道":[110.46988295999867,29.13591820510421],"王家坪镇":[110.81451453531892,29.03109677109389],"罗塔坪乡":[110.1249154749886,29.20085281102241],"西溪坪街道":[110.57320556599859,29.12814648630219],"茅溪水库管理所":[110.32256875007113,29.22846763456544],"原种场":[110.45044439755196,29.1253913038174],"官黎坪街道":[110.41238799093298,29.04913757877456]}
张家界市永定区行政划分代码
[{"name":"旱科所","code":""},{"name":"谢家垭乡","code":"430802206000"},{"name":"天门山镇","code":"430802103000"},{"name":"新桥镇","code":"430802100000"},{"name":"茅岩河镇","code":"430802101000"},{"name":"合作桥乡","code":"430802204000"},{"name":"沅古坪镇","code":"430802104000"},{"name":"大庸桥街道","code":"430802002000"},{"name":"桥头乡","code":"430802210000"},{"name":"崇文街道","code":"430802005000"},{"name":"猪石头林场","code":""},{"name":"南庄坪街道","code":"430802006000"},{"name":"罗水乡","code":"430802209000"},{"name":"四都坪乡","code":"430802212000"},{"name":"三家馆乡","code":"430802201000"},{"name":"尹家溪镇","code":"430802105000"},{"name":"教字垭镇","code":"430802102000"},{"name":"永定街道","code":"430802001000"},{"name":"王家坪镇","code":"430802108000"},{"name":"罗塔坪乡","code":"430802208000"},{"name":"西溪坪街道","code":"430802003000"},{"name":"茅溪水库管理所","code":""},{"name":"原种场","code":"430802404000"},{"name":"官黎坪街道","code":"430802004000"}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规,本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据,属性齐全,各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。
4、当前除了包含有关键地区的geoJson地图信息外还包含有28个echarts地图效果,以及13个threejs地图实例效果,限于篇幅不一一展示,可以通过更多echarts和threejs地图效果实例查看