可视化大屏 项目中经常会遇到需要渲染echarts地图的情况,为了方便不同城市快速实现效果,将不同城市的echarts地图效果整理出来,供大家参考,今天为大家整理的是陇南市西和县echarts地图和threejs地图效果实例。地图基于geoJson数据绘制。
西和县,隶属于 甘肃省 陇南市,位于甘肃省东南部、陇南市北端,地处长江流域西汉水上游。东临徽县、成县,南依武都区、康县,西北与礼县交界,东北与礼县、秦州区接壤,总面积1861方公里。截至2021年10月,西和县下辖16个镇、4个乡。384个行政村、10个社区,耕地面积87万亩。根据第七次人口普查数据,截至2020年11月1日零时,西和县常住人口351069人。县人民政府驻汉源镇。
echarts陇南市西和县geoJson地图局部颜色渐变
echarts地图渲染,通过echarts.graphic.LinearGradient线性渐变来实现地图区域颜色的渐变效果
echarts陇南市西和县geoJson地图根据经纬度显示自定义html弹窗
echarts地图我们可以通过像素坐标来将我们自定义的html弹窗定位到echarts地图指定位置,如果是固定的宽高的话,这没什么问题直接定位就可以了,如果是自适应宽高的地图我们可能没办法控制精度,我们可以使用经纬度来控制,当echarts地图渲染完成以后,我们可以通过convertToPixel将经纬度转为像素坐标,然后再渲染自定义弹窗,这样精度就比较准确了,而且也不会因为窗体宽高变化而导致弹窗出现偏移.
echarts陇南市西和县geoJson地图热力图
echarts通过heatmap实现热力图效果
threejs陇南市西和县geoJson地图3d地图添加金色效果
通过threejs绘制3d地图使用outlinePass实现金色描边效果,并通过edgeStrength增加强度,让描边更清晰,如果想系统的学习threejs的话,可以观看threejs课程视频 Three.js前端3D可视化
threejs陇南市西和县geoJson地图3d地图自定义贴图加CSS3D标签
通过threejs绘制3d地图并添加CSS3D标签和自定义贴图
threejs陇南市西和县geoJson地图3d地图添加旋转棱锥
通过threejs绘制3d地图并在指定经纬度上添加带波纹效果不停旋转的棱锥效果实例
陇南市西和县 下辖有 马元乡,太石河乡,西高山乡,何坝镇,六巷乡,兴隆乡,十里乡,卢河乡,大桥乡,姜席镇,晒经乡,汉源镇,洛峪镇,石堡乡,石峡镇,稍峪乡,苏河乡,蒿林乡,西峪乡,长道镇
陇南市西和县下辖区域坐标
{"马元乡":[105.50879336024735,34.05844816338066],"太石河乡":[105.13680481537212,33.68513065841702],"西高山乡":[105.38791049864106,33.71279173401722],"何坝镇":[105.19288140561156,33.91420816266485],"六巷乡":[105.44095577897366,33.86475520614555],"兴隆乡":[105.39893838359589,34.0181352950703],"十里乡":[105.32226346832277,33.91746174570777],"卢河乡":[105.39478513352654,33.96112378179868],"大桥乡":[105.2997102667619,33.7128175950313],"姜席镇":[105.20357728070675,33.99248012461914],"晒经乡":[105.5459872456234,33.98670380543329],"汉源镇":[105.29944281707006,34.00695311368747],"洛峪镇":[105.24270626721794,33.83080026366633],"石堡乡":[105.32498046484277,34.12133772167464],"石峡镇":[105.38161781314732,33.78476018242807],"稍峪乡":[105.38534639708337,34.06836268071304],"苏河乡":[105.23464188488855,34.06336520258255],"蒿林乡":[105.19278067568278,33.79348264552766],"西峪乡":[105.28762627580718,34.04589611191762],"长道镇":[105.38328378401039,34.15928116064678]}
陇南市西和县行政划分代码
[{"name":"马元乡","code":""},{"name":"太石河乡","code":"621225218000"},{"name":"西高山乡","code":""},{"name":"何坝镇","code":"621225102000"},{"name":"六巷乡","code":"621225220000"},{"name":"兴隆乡","code":""},{"name":"十里乡","code":""},{"name":"卢河乡","code":""},{"name":"大桥乡","code":""},{"name":"姜席镇","code":"621225103000"},{"name":"晒经乡","code":"621225208000"},{"name":"汉源镇","code":"621225100000"},{"name":"洛峪镇","code":"621225105000"},{"name":"石堡乡","code":""},{"name":"石峡镇","code":"621225104000"},{"name":"稍峪乡","code":""},{"name":"苏河乡","code":""},{"name":"蒿林乡","code":"621225217000"},{"name":"西峪乡","code":""},{"name":"长道镇","code":"621225101000"}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规,本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据,属性齐全,各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。