数据大屏可视化 项目中经常需要渲染echarts地图,为了不同城市快速实现,将不同城市的echarts地图效果整理出来,今天为大家整理绍兴市上虞区echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
echarts绍兴市上虞区geoJson地图点击跳转到指定页面
为图标添加点击事件,点击图标,跳转到指定页面
echarts绍兴市上虞区geoJson地图自定义引导线
echarts地图渲染中,会遇到多个地名凑到一块导致名称重叠的情况,这时候我们可以通过一条线指向对应的位置并通过label来进行标注的效果.
echarts绍兴市上虞区geoJson地图局部颜色渐变
echarts地图渲染,通过echarts.graphic.LinearGradient线性渐变来实现地图区域颜色的渐变效果
threejs绍兴市上虞区geoJson地图3d地图CSS3D标签
通过threejs绘制的3d地图CSS3D标签实例,CSS3D不面向摄像机,跟随场景缩放,可以通过rotateY调整角度,通过scale调整大小 Vue3 threejs 在3d地图中绘制css3d标签标注省份,如果想系统的学习threejs的话,可以观看threejs视频课程 3D可视化Three.js视频教程
threejs绍兴市上虞区geoJson地图3d地图
通过threejs绘制的3d地图实例 vue3 threejs 在vue3项目中绘制3d地图效果实例
threejs绍兴市上虞区geoJson地图3d地图鼠标移入显示标签并高亮
通过threejs绘制的3d地图鼠标移入显示标签并高亮
绍兴市上虞区 下辖有 章镇镇,丁宅乡,上浦镇,下管镇,丰惠镇,小越镇,崧厦镇,永和镇,盖北镇,谢塘镇,道墟镇,长塘镇,陈溪乡,驿亭镇,东关街道,曹娥街道,百官街道,岭南乡,梁湖镇,汤浦镇
绍兴市上虞区下辖区域坐标
{"章镇镇":[120.90035391451352,29.80833099109935],"丁宅乡":[120.97085002298297,29.87430132071021],"上浦镇":[120.8507714346856,29.88481410866948],"下管镇":[121.03300009837804,29.83777373789387],"丰惠镇":[120.96381614819869,29.95164450597449],"小越镇":[120.930609351308,30.06933097185344],"崧厦镇":[120.83988931620789,30.08366522251975],"永和镇":[121.05072719878291,29.96703829656644],"盖北镇":[120.84075312006325,30.19413345126031],"谢塘镇":[120.90719637681288,30.11019141008114],"道墟镇":[120.76626374337494,30.0547088898094],"长塘镇":[120.79167073762346,29.93686737662326],"陈溪乡":[121.06087601639963,29.8047652630574],"驿亭镇":[120.95328022364485,30.02305251646715],"东关街道":[120.80352600592207,29.99540605934506],"曹娥街道":[120.84162255748313,29.99147865400754],"百官街道":[120.87896429406538,30.02043654782063],"岭南乡":[120.97972551284388,29.76825289961707],"梁湖镇":[120.90097435571133,29.95000107157062],"汤浦镇":[120.76806585402568,29.8510148443086]}
绍兴市上虞区行政划分代码
[{"name":"章镇镇","code":"330604104000"},{"name":"丁宅乡","code":"330604202000"},{"name":"上浦镇","code":"330604102000"},{"name":"下管镇","code":"330604105000"},{"name":"丰惠镇","code":"330604106000"},{"name":"小越镇","code":""},{"name":"崧厦镇","code":""},{"name":"永和镇","code":"330604107000"},{"name":"盖北镇","code":"330604112000"},{"name":"谢塘镇","code":"330604111000"},{"name":"道墟镇","code":""},{"name":"长塘镇","code":"330604101000"},{"name":"陈溪乡","code":"330604201000"},{"name":"驿亭镇","code":"330604109000"},{"name":"东关街道","code":"330604003000"},{"name":"曹娥街道","code":"330604002000"},{"name":"百官街道","code":"330604001000"},{"name":"岭南乡","code":"330604200000"},{"name":"梁湖镇","code":""},{"name":"汤浦镇","code":"330604103000"}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规,本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据,属性齐全,各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。
4、当前除了包含有关键地区的geoJson地图信息外还包含有28个echarts地图效果,以及13个threejs地图实例效果,限于篇幅不一一展示,可以通过更多echarts和threejs地图效果实例查看