数据大屏可视化 项目中经常会遇到需要渲染echarts地图的情况,为了方便不同城市快速实现效果,将不同城市的echarts地图效果整理出来,供大家参考,今天为大家整理的是茂名市高州市echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
高州市,广东省 辖县级市,由 茂名市 代管,位于广东省西南部,茂名市中部,地处粤西桂东之交通要冲,总面积3276平方千米。2021年末,高州市户籍人口186.94万人,全市常住人口133.05万人。 高州市是“广东省教育强市”、广东省“大县域医疗中心”、广东省唯一的“国家级医改示范县(市)”,是广东省直管县财政改革试点 。高州市建成华南地区最大的蛋鸡场、粤西最大的生猪养殖场、全国最大的鳄鱼养殖基地,是著名的荔枝、龙眼、香蕉之乡;高州市是中国民间文化艺术之乡,被评为中国楹联文化城市、广东省十大传统美食之乡;是冼太故里、“三个代表”重要思想发源地。
echarts茂名市高州市geoJson地图局部颜色渐变
echarts地图渲染,通过echarts.graphic.LinearGradient线性渐变来实现地图区域颜色的渐变效果
echarts茂名市高州市geoJson地图水滴状气泡图
echarts地图渲染时,会通过一个水滴状小气泡来将数值渲染到地图上,我们可以可以通过scatter来实现我们想要的效果.
echarts茂名市高州市geoJson地图自定义引导线
echarts地图渲染中,会遇到多个地名凑到一块导致名称重叠的情况,这时候我们可以通过一条线指向对应的位置并通过label来进行标注的效果.
threejs茂名市高州市geoJson地图3d地图CSS3D标签
通过threejs绘制的3d地图CSS3D标签实例,CSS3D不面向摄像机,跟随场景缩放,可以通过rotateY调整角度,通过scale调整大小,如果对threejs感兴趣,可以观看threejs视频课程 WebGL/Three.js前端高薪3D可视化
threejs茂名市高州市geoJson地图3d地图css2d标签
通过threejs绘制的3d地图css2d标签实例,CSS2D面向摄像机,不随场景缩放而缩放
threejs茂名市高州市geoJson地图3d地图添加金色效果
通过threejs绘制3d地图使用outlinePass实现金色描边效果,并通过edgeStrength增加强度,让描边更清晰
茂名市高州市下辖有潘州街道,深镇镇,云潭镇,东岸镇,分界镇,南塘镇,古丁镇,大井镇,大坡镇,平山镇,新垌镇,曹江镇,根子镇,泗水镇,潭头镇,石板镇,石鼓镇,荷塘镇,荷花镇,金山街道,谢鸡镇,镇江镇,石仔岭街道,长坡镇,马贵镇,团结农场,宝光街道,山美街道,火星农场,沙田镇,胜利农场
茂名市高州市下辖区域坐标
{"潘州街道":[110.85789976847452,21.90804134855212],"深镇镇":[111.17280431235062,22.22330935945325],"云潭镇":[111.17639801453721,21.90428776244462],"东岸镇":[110.9961750854594,22.15353436033349],"分界镇":[110.9585575745656,21.7972588766086],"南塘镇":[110.80158485099074,22.04652152936832],"古丁镇":[111.20304491670989,22.1913077007662],"大井镇":[110.84654065459588,22.10392844464433],"大坡镇":[111.2439667958362,22.05691926396813],"平山镇":[111.12574262468809,22.12556433710677],"新垌镇":[111.09475871404146,21.92355400264633],"曹江镇":[110.92416687714729,21.98804931153241],"根子镇":[111.05048259352665,21.81490028999369],"泗水镇":[110.9655639950483,21.84839246500441],"潭头镇":[110.82020036537405,22.17489558471036],"石板镇":[110.71100572715653,22.15369680694835],"石鼓镇":[110.7368705012509,21.80064898794655],"荷塘镇":[110.70284826781324,22.0196028669309],"荷花镇":[110.72060781353716,22.23592863045387],"金山街道":[110.86662332739624,21.82757505077387],"谢鸡镇":[110.98229517692732,21.92767552737449],"镇江镇":[110.6998043841709,21.83942976579882],"石仔岭街道":[110.83092560900381,21.88663725257521],"长坡镇":[111.05895940971351,22.05373815613278],"马贵镇":[111.30951814077945,22.22353567179244],"团结农场":[110.87230968181797,21.87170266562071],"宝光街道":[110.79882666228677,21.95027111236706],"山美街道":[110.89115990643991,21.89865814712858],"火星农场":[110.87567974951486,21.8739175468895],"沙田镇":[110.68252480619013,21.92297410631099],"胜利农场":[110.87450993681733,21.87305989370022]}
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规,本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据,属性齐全,各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。