大屏数据可视化 项目中经常会遇到需要渲染echarts地图的情况，为了方便不同城市快速实现效果，将不同城市的echarts地图效果整理出来，供大家参考，今天为大家整理的是甘南藏族自治州临潭县echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
临潭县 隶属 甘南藏族自治州，古称洮州，位于甘肃省南部，甘南藏族自治州东部，地处青藏高原东北边缘，是农区与牧区、藏区与汉区的结合部。临潭县总面积1557.68平方公里，境内属高山丘陵地带，海拔在2209—3926米之间，平均海拔2825米。全县辖16个乡（镇）、141个行政村，根据第七次人口普查数据，截至2020年11月1日零时，临潭县常住人口为127387人。有汉族、回族、藏族、蒙古族等10个民族，少数民族人口占总人口的26%。
echarts甘南藏族自治州临潭县geoJson地图添加柱状图
echarts地图渲染时,为了让地图上的数据有一个对比的效果,会在地图上标注柱状图,以便于更直观的看出各个区域的数值.
echarts甘南藏族自治州临潭县geoJson地图地图下钻展示
地图下钻展示,点击地图后,只显示当前选中的区域,可点击返回显示全部地图.
echarts甘南藏族自治州临潭县geoJson地图区域闪烁
echarts地图有时候为了突出某一块区域的重要性,会进行两个颜色的交替变化来告诉用户这一块需要重点关注,我们可以通过echarts的dispatchAction来实现我们想要的效果.
threejs甘南藏族自治州临潭县geoJson地图3d地图红色描边闪烁警报
通过threejs绘制3d地图使用outlinePass 实现发光描边闪烁效果 以实现警报功能,如果对threejs感兴趣，可以观看threejs视频课程 Three.js前端3D可视化
threejs甘南藏族自治州临潭县geoJson地图3d地图指定区域闪烁
通过threejs绘制3d地图并让指定区域闪烁
threejs甘南藏族自治州临潭县geoJson地图3d地图CSS3D标签
通过threejs绘制的3d地图CSS3D标签实例，CSS3D不面向摄像机，跟随场景缩放,可以通过rotateY调整角度,通过scale调整大小
甘南藏族自治州临潭县 下辖有 新城镇,洮滨乡,店子乡,三岔乡,八角乡,初布乡,城关镇,流顺乡,羊永乡,卓洛回族乡,长川回族乡,王旗乡,石门乡,羊沙乡,冶力关镇,古战回族乡
甘南藏族自治州临潭县下辖区域坐标
{"新城镇":[103.61371581403965,34.6800631103016],"洮滨乡":[103.6714562616435,34.55515418554908],"店子乡":[103.68655376118633,34.62957915504941],"三岔乡":[103.77724437857836,34.58608712768283],"八角乡":[],"初布乡":[],"城关镇":[103.35619593011397,34.69135270946006],"流顺乡":[103.54730569540305,34.66107369073855],"羊永乡":[103.4765942804969,34.66786377002445],"卓洛回族乡":[],"长川回族乡":[103.44216717687902,34.68963402682975],"王旗乡":[103.79007881769334,34.68168919828625],"石门乡":[103.70115100274545,34.75529324769641],"羊沙乡":[103.71555454964249,34.83748513352387],"冶力关镇":[103.64473793262863,34.93992568566365],"古战回族乡":[103.29900465783027,34.67765133859741]}
甘南藏族自治州临潭县行政划分代码
[{"name":"新城镇","code":"623021101000"},{"name":"洮滨乡","code":""},{"name":"店子乡","code":""},{"name":"三岔乡","code":"623021208000"},{"name":"八角乡","code":""},{"name":"初布乡","code":""},{"name":"城关镇","code":"623021100000"},{"name":"流顺乡","code":""},{"name":"羊永乡","code":""},{"name":"卓洛回族乡","code":""},{"name":"长川回族乡","code":""},{"name":"王旗乡","code":""},{"name":"石门乡","code":"623021210000"},{"name":"羊沙乡","code":""},{"name":"冶力关镇","code":"623021102000"},{"name":"古战回族乡","code":""}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规，本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据，属性齐全，各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。
