大屏数据可视化 项目中经常会遇到需要渲染echarts地图的情况,为了方便不同城市快速实现效果,将不同城市的echarts地图效果整理出来,供大家参考,今天为大家整理的是广元市昭化区echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
echarts广元市昭化区geoJson地图添加柱状图
echarts地图渲染时,为了让地图上的数据有一个对比的效果,会在地图上标注柱状图,以便于更直观的看出各个区域的数值.
echarts广元市昭化区geoJson地图定义颜色
echarts地图通过visualMap来事先设置好数据区间,根据区间来来显示地图的颜色,这里的visualMap数据是随机生成的,可以通过实例代码根据自己的需要配置颜色和数据区间.
echarts广元市昭化区geoJson地图地图排行榜效果
echarts地图根据数据渲染不同颜色的地图,并根据数据大小显示前10名的排序效果,属于地图map类型和柱状图bar类型混合效果
threejs广元市昭化区geoJson地图3d地图css2d标签
通过threejs绘制的3d地图css2d标签实例,CSS2D面向摄像机,不随场景缩放而缩放 vue3 threejs实现在3d地图中绘制css2d地名,如果对threejs感兴趣,可以观看threejs视频 Three.js前端3D可视化教程
threejs广元市昭化区geoJson地图3d地图添加描边效果
通过threejs绘制3d地图使用outlinePass 实现发光描边效果
广元市昭化区 下辖有 丁家乡,梅树乡,青牛乡,香溪乡,拣银岩社区街道,元坝镇,卫子镇,大朝乡,太公镇,文村乡,射箭乡,张家乡,明觉乡,昭化镇,晋贤乡,朝阳乡,柳桥乡,沙坝乡,清水乡,王家镇,白果乡,紫云乡,红岩镇,磨滩镇,虎跳镇,陈江乡,黄龙乡,柏林沟镇,石井铺乡
广元市昭化区下辖区域坐标
{"丁家乡":[105.72914638672673,32.05886035426863],"梅树乡":[105.83837822256172,32.2530461734713],"青牛乡":[105.73081013299704,31.93525403675155],"香溪乡":[105.82228508797293,31.96765656368793],"拣银岩社区街道":[105.99891308569092,32.32397830684744],"元坝镇":[105.96293253460914,32.31996261268515],"卫子镇":[105.87404291420431,32.16655336595115],"大朝乡":[105.60650904303219,32.29533910344554],"太公镇":[105.81140720291606,32.07919666224782],"文村乡":[105.96970173027819,32.05386063600044],"射箭乡":[105.74692613237491,32.31308415953472],"张家乡":[105.81162758287434,32.01933842255893],"明觉乡":[105.76548363682862,32.27428869369992],"昭化镇":[105.69633580423435,32.35195818825102],"晋贤乡":[105.94653161626647,32.19605364081087],"朝阳乡":[105.67794548940746,32.27486528699154],"柳桥乡":[106.01771794330732,32.28751303628746],"沙坝乡":[105.63346863219311,32.22280116165132],"清水乡":[105.9049109974164,32.02857370852053],"王家镇":[105.96886671137361,32.12372685860385],"白果乡":[105.74805725259824,32.18450060075865],"紫云乡":[105.92461441562929,32.26016431820203],"红岩镇":[105.72314235952354,32.21446554192732],"磨滩镇":[106.05076324526765,32.15879900761105],"虎跳镇":[105.74937924878952,31.98483002861809],"陈江乡":[105.69326164726267,32.00047969192114],"黄龙乡":[105.7477673281488,32.10524693423997],"柏林沟镇":[105.89614279109799,32.08266850799113],"石井铺乡":[105.84239972986818,32.15163149249079]}
广元市昭化区行政划分代码
[{"name":"丁家乡","code":""},{"name":"梅树乡","code":""},{"name":"青牛乡","code":""},{"name":"香溪乡","code":""},{"name":"拣银岩社区街道","code":""},{"name":"元坝镇","code":"510811100000"},{"name":"卫子镇","code":"510811101000"},{"name":"大朝乡","code":""},{"name":"太公镇","code":"510811105000"},{"name":"文村乡","code":""},{"name":"射箭乡","code":""},{"name":"张家乡","code":""},{"name":"明觉乡","code":""},{"name":"昭化镇","code":"510811108000"},{"name":"晋贤乡","code":""},{"name":"朝阳乡","code":""},{"name":"柳桥乡","code":""},{"name":"沙坝乡","code":""},{"name":"清水乡","code":""},{"name":"王家镇","code":"510811102000"},{"name":"白果乡","code":""},{"name":"紫云乡","code":""},{"name":"红岩镇","code":"510811107000"},{"name":"磨滩镇","code":"510811103000"},{"name":"虎跳镇","code":"510811106000"},{"name":"陈江乡","code":""},{"name":"黄龙乡","code":""},{"name":"柏林沟镇","code":"510811104000"},{"name":"石井铺乡","code":""}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规,本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据,属性齐全,各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。
4、当前除了包含有关键地区的geoJson地图信息外还包含有28个echarts地图效果,以及13个threejs地图实例效果,限于篇幅不一一展示,可以通过更多echarts和threejs地图效果实例查看