可视化数据大屏 项目中会有渲染地图的需要,除了百度地图以及高德地图外，也会需要echarts或者threejs效果的地图,今天为大家整理襄阳市枣阳市echarts地图和threejs地图效果实例供大家参考。地图基于geoJson数据绘制。
枣阳市，位于中国湖北省中部，是襄阳市下辖的一个县级市。这里地理位置优越，东邻随州市，南接襄阳主城区，北靠荆门市，西界宜城市，是襄阳市的重要组成部分。枣阳历史悠久，文化底蕴深厚，曾是古代楚国的重要城市之一。现代枣阳以工业为主，尤其是汽车制造业和冶金工业发展迅速。此外，枣阳还拥有丰富的旅游资源，如古迹遗址和美丽的自然风光，吸引着众多游客。农业方面，枣阳盛产水稻和小麦，是一个典型的农业城市。
动态效果
echarts襄阳市枣阳市geoJson地图根据经纬度显示自定义html弹窗
echarts地图我们可以通过像素坐标来将我们自定义的html弹窗定位到echarts地图指定位置,如果是固定的宽高的话,这没什么问题直接定位就可以了,如果是自适应宽高的地图我们可能没办法控制精度,我们可以使用经纬度来控制,当echarts地图渲染完成以后,我们可以通过convertToPixel将经纬度转为像素坐标,然后再渲染自定义弹窗,这样精度就比较准确了,而且也不会因为窗体宽高变化而导致弹窗出现偏移.
echarts襄阳市枣阳市geoJson地图阴影
echarts地图阴影效果实例,通过shadowColor控制阴影的颜色,通过shadowBlur控制范围,通过shadowOffsetX和shadowOffsetY控制偏移.
echarts襄阳市枣阳市geoJson地图自定义引导线
echarts地图渲染中,会遇到多个地名凑到一块导致名称重叠的情况,这时候我们可以通过一条线指向对应的位置并通过label来进行标注的效果.
threejs襄阳市枣阳市geoJson地图3d地图自定义贴图加CSS2D标签
通过threejs绘制3d地图并添加CSS2D标签和自定义贴图,如果想系统的学习threejs的话，可以观看threejs视频教程 WebGL/Three.js前端高薪3D可视化
threejs襄阳市枣阳市geoJson地图3d地图CSS3D标签
通过threejs绘制的3d地图CSS3D标签实例，CSS3D不面向摄像机，跟随场景缩放,可以通过rotateY调整角度,通过scale调整大小 Vue3 threejs 在3d地图中绘制css3d标签标注省份
threejs襄阳市枣阳市geoJson地图3d地图
通过threejs绘制的3d地图实例 vue3 threejs 在vue3项目中绘制3d地图效果实例
襄阳市枣阳市 下辖有 随阳农场,刘升镇,七方镇,兴隆镇,吴店镇,太平镇,杨当镇,平林镇,新市镇,车河农场,熊集镇,王城镇,枣阳经济开发区,琚湾镇,鹿头镇,北城街道,南城街道,环城街道
襄阳市枣阳市下辖区域坐标
{"随阳农场":[112.94308787234371,32.03733546436946],"刘升镇":[112.9447611603266,32.15454728331459],"七方镇":[112.57332684964105,32.22046608972848],"兴隆镇":[112.90170950575327,32.02720503674194],"吴店镇":[112.79993102768154,31.91123277803054],"太平镇":[112.7733155752737,32.30018798024228],"杨当镇":[112.58889823285253,32.34135960371951],"平林镇":[112.6965113235783,31.76008515463447],"新市镇":[112.9853543959234,32.32687858687639],"车河农场":[112.63857886617178,31.80781224432576],"熊集镇":[112.61710920051816,31.93847929836706],"王城镇":[112.9232627735758,31.90599857538308],"枣阳经济开发区":[112.72557064171977,32.12844307428438],"琚湾镇":[112.56291053411623,32.05528646911669],"鹿头镇":[112.89698177758672,32.23065988968135],"北城街道":[112.76211157174819,32.13467132815116],"南城街道":[112.70621526804197,32.0562787358401],"环城街道":[112.75770931571326,32.15073426135168]}
襄阳市枣阳市行政划分代码
[{"name":"随阳农场","code":"420683500000"},{"name":"刘升镇","code":"420683106000"},{"name":"七方镇","code":"420683101000"},{"name":"兴隆镇","code":"420683107000"},{"name":"吴店镇","code":"420683109000"},{"name":"太平镇","code":"420683103000"},{"name":"杨当镇","code":"420683102000"},{"name":"平林镇","code":"420683111000"},{"name":"新市镇","code":"420683104000"},{"name":"车河农场","code":"420683501000"},{"name":"熊集镇","code":"420683110000"},{"name":"王城镇","code":"420683108000"},{"name":"枣阳经济开发区","code":"420683402000"},{"name":"琚湾镇","code":"420683100000"},{"name":"鹿头镇","code":"420683105000"},{"name":"北城街道","code":"420683001000"},{"name":"南城街道","code":"420683002000"},{"name":"环城街道","code":"420683003000"}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规，本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据，属性齐全，各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。
