数据可视化大屏 项目中经常会遇到需要渲染echarts地图的情况,为了方便不同城市快速实现效果,将不同城市的echarts地图效果整理出来,供大家参考,今天为大家整理的是辽阳市宏伟区echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
echarts辽阳市宏伟区geoJson地图点击弹出自定义弹窗
我们可以通过scatter来设置自定义样式,但是这种自定义局限性很大,如果要求的样式很复杂的话,scatter就不能很好的实现了,所以我们可以通过鼠标点击获取横纵坐标,然后通过css来定位到对应的位置.
echarts辽阳市宏伟区geoJson地图添加柱状图
echarts地图渲染时,为了让地图上的数据有一个对比的效果,会在地图上标注柱状图,以便于更直观的看出各个区域的数值.
echarts辽阳市宏伟区geoJson地图阴影
echarts地图阴影效果实例,通过shadowColor控制阴影的颜色,通过shadowBlur控制范围,通过shadowOffsetX和shadowOffsetY控制偏移.
threejs辽阳市宏伟区geoJson地图3d地图自定义贴图加CSS3D标签
通过threejs绘制3d地图并添加CSS3D标签和自定义贴图,如果想系统的学习threejs的话,可以观看threejs视频课程 WebGL 3D可视化教程
threejs辽阳市宏伟区geoJson地图3d地图CSS3D标签
通过threejs绘制的3d地图CSS3D标签实例,CSS3D不面向摄像机,跟随场景缩放,可以通过rotateY调整角度,通过scale调整大小 Vue3 threejs 在3d地图中绘制css3d标签标注省份
threejs辽阳市宏伟区geoJson地图3d地图
通过threejs绘制的3d地图实例 vue3 threejs 在vue3项目中绘制3d地图效果实例
辽阳市宏伟区 下辖有 工农街道,新村街道,长征街道,兰家镇,曙光镇,光华街道
辽阳市宏伟区下辖区域坐标
{"工农街道":[123.18407645681103,41.20560751916369],"新村街道":[123.20526917399391,41.18662134981935],"长征街道":[123.21694635309348,41.20250174698671],"兰家镇":[123.1683301874661,41.17481754788199],"曙光镇":[123.23640443770647,41.1867559319911],"光华街道":[123.21553347510043,41.21487024628431]}
辽阳市宏伟区行政划分代码
[{"name":"工农街道","code":"211004001000"},{"name":"新村街道","code":""},{"name":"长征街道","code":"211004004000"},{"name":"兰家镇","code":"211004102000"},{"name":"曙光镇","code":"211004101000"},{"name":"光华街道","code":""}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规,本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据,属性齐全,各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。