大屏数据可视化 项目中经常需要渲染echarts地图,为了不同城市快速实现,将不同城市的echarts地图效果整理出来,今天为大家整理太原市尖草坪区echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
尖草坪区,隶属于 山西省 太原市,位于太原市主城区北部,前身为原北郊区,三山环抱、一水中分,辖9个街道、2个镇、2个乡,71个社区、77个行政村;总面积285.6平方千米,其中建成区面积41.6平方千米。根据第七次人口普查数据,截至2020年11月1日零时,尖草坪区常住人口为530499人。
echarts太原市尖草坪区geoJson地图定义颜色
echarts地图通过visualMap来事先设置好数据区间,根据区间来来显示地图的颜色,这里的visualMap数据是随机生成的,可以通过实例代码根据自己的需要配置颜色和数据区间.
echarts太原市尖草坪区geoJson地图3d地图实例旋转动画
使用的是echarts-gl结合echarts实现的3d地图效果实例
echarts太原市尖草坪区geoJson地图自定义引导线
echarts地图渲染中,会遇到多个地名凑到一块导致名称重叠的情况,这时候我们可以通过一条线指向对应的位置并通过label来进行标注的效果.
threejs太原市尖草坪区geoJson地图3d地图css2d标签
通过threejs绘制的3d地图css2d标签实例,CSS2D面向摄像机,不随场景缩放而缩放,如果想系统的学习threejs的话,可以观看threejs视频 Three.js视频教程3D可视化
threejs太原市尖草坪区geoJson地图3d地图红色描边闪烁警报
通过threejs绘制3d地图使用outlinePass 实现发光描边闪烁效果 以实现警报功能
threejs太原市尖草坪区geoJson地图3d地图添加旋转棱锥
通过threejs绘制3d地图并在指定经纬度上添加带波纹效果不停旋转的棱锥效果实例
太原市尖草坪区 下辖有 柏板乡,新城街道,马头水乡,光社街道,迎新街道,向阳镇,西焉乡,阳曲镇,上兰街道,南寨街道,古城街道,柴村街道,汇丰街道,尖草坪街道,柏板乡,新城街道,马头水乡,光社街道,迎新街道,向阳镇,西焉乡,阳曲镇,上兰街道,南寨街道,古城街道,柴村街道,汇丰街道,尖草坪街道
太原市尖草坪区下辖区域坐标
{"柏板乡":[112.47113880814175,38.03732576710091],"新城街道":[112.5510552574882,37.96807293757832],"马头水乡":[112.39677050694432,37.95496131910571],"光社街道":[112.55975184084528,37.94287352743592],"迎新街道":[112.51062309013956,37.95248824791383],"向阳镇":[112.49016397369834,37.99620547892807],"西焉乡":[],"阳曲镇":[112.60073561018439,38.00590822307908],"上兰街道":[112.41566581831452,38.01451648311246],"南寨街道":[],"古城街道":[112.52823622329504,37.91391120693866],"柴村街道":[112.47144236738637,37.94431333052826],"汇丰街道":[112.5060445750436,37.89919477534696],"尖草坪街道":[112.54059731066337,37.92334068007122]}
太原市尖草坪区行政划分代码
[{"name":"柏板乡","code":"140108201000"},{"name":"新城街道","code":"140108009000"},{"name":"马头水乡","code":""},{"name":"光社街道","code":"140108002000"},{"name":"迎新街道","code":""},{"name":"向阳镇","code":"140108100000"},{"name":"西焉乡","code":""},{"name":"阳曲镇","code":"140108101000"},{"name":"上兰街道","code":"140108003000"},{"name":"南寨街道","code":"140108004000"},{"name":"古城街道","code":"140108006000"},{"name":"柴村街道","code":"140108008000"},{"name":"汇丰街道","code":"140108007000"},{"name":"尖草坪街道","code":"140108001000"}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规,本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据,属性齐全,各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。