可视化大屏 项目中经常需要渲染echarts地图,为了不同城市快速实现,将不同城市的echarts地图效果整理出来,今天为大家整理巴音郭楞蒙古自治州尉犁县echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
尉犁县,隶属新疆维吾尔自治区 巴音郭楞蒙古自治州。位于天山南麓,塔里木盆地东北缘,地处新疆维吾尔自治区东南部,总面积5.92万平方千米,下辖5乡3镇50个行政村、12个社区,有第二师驻县团场及州直驻县单位5个(第二师31团、33团、34团、恰拉水管处,塔河巴音郭楞管理局孔雀河下游管理站)。 2019年,尉犁县户籍人口107487人。
echarts巴音郭楞蒙古自治州尉犁县geoJson地图指定区域高亮
echarts让指定区域变为选中高亮状态
echarts巴音郭楞蒙古自治州尉犁县geoJson地图自定义引导线
echarts地图渲染中,会遇到多个地名凑到一块导致名称重叠的情况,这时候我们可以通过一条线指向对应的位置并通过label来进行标注的效果.
echarts巴音郭楞蒙古自治州尉犁县geoJson地图自定义label样式
echarts通过scatter实例可以配置自己想要的图标,以及label文字的样式效果
threejs巴音郭楞蒙古自治州尉犁县geoJson地图3d地图自定义贴图加CSS2D标签
通过threejs绘制3d地图并添加CSS2D标签和自定义贴图,如果想系统的学习threejs的话,可以观看threejs教程视频 Three.js前端3D可视化教程
threejs巴音郭楞蒙古自治州尉犁县geoJson地图3d地图CSS3D标签
通过threejs绘制的3d地图CSS3D标签实例,CSS3D不面向摄像机,跟随场景缩放,可以通过rotateY调整角度,通过scale调整大小 Vue3 threejs 在3d地图中绘制css3d标签标注省份
threejs巴音郭楞蒙古自治州尉犁县geoJson地图3d地图红色描边闪烁警报
通过threejs绘制3d地图使用outlinePass 实现发光描边闪烁效果 以实现警报功能
巴音郭楞蒙古自治州尉犁县 下辖有 墩阔坦乡,古勒巴格乡,喀尔曲尕乡,兵团三十一团,兵团三十四团,兴平乡,团结乡,尉犁镇,塔里木乡,阿克苏普乡,农二师三十三团
巴音郭楞蒙古自治州尉犁县下辖区域坐标
{"墩阔坦乡":[85.87936125367594,41.1581404140413],"古勒巴格乡":[],"喀尔曲尕乡":[],"兵团三十一团":[],"兵团三十四团":[87.67576387237337,40.6423507648629],"兴平乡":[86.17007945727109,41.43523062512995],"团结乡":[],"尉犁镇":[86.26245397957457,41.35198259436175],"塔里木乡":[86.33534463808499,41.18153193313196],"阿克苏普乡":[86.67616130923537,41.20431039572047],"农二师三十三团":[87.1689150074615,40.77839676177319]}
巴音郭楞蒙古自治州尉犁县行政划分代码
[{"name":"墩阔坦乡","code":"652823203000"},{"name":"古勒巴格乡","code":"652823206000"},{"name":"喀尔曲尕乡","code":"652823204000"},{"name":"兵团三十一团","code":"652823501000"},{"name":"兵团三十四团","code":"652823503000"},{"name":"兴平乡","code":""},{"name":"团结乡","code":""},{"name":"尉犁镇","code":"652823100000"},{"name":"塔里木乡","code":"652823200000"},{"name":"阿克苏普乡","code":"652823205000"},{"name":"农二师三十三团","code":""}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规,本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据,属性齐全,各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。