随着开发 数据大屏 项目越来越多,对地图的需求也各不相同,除了百度地图和高德地图外还会遇到echarts和threejs的需要,对地图的效果以及城市也各不相同,今天为大家整理晋中市祁县echarts地图和threejs地图效果实例供大家参考。地图基于geoJson数据绘制。
祁县（qí xiàn），隶属于 山西省 晋中市，位于山西省 中部。2021年，祁县下辖6个镇、1个乡：昭馀镇、东观镇、古县镇、贾令镇、城赵镇、来远镇、峪口乡。有117个行政村，16个社区。总面积854平方千米。 根据第七次人口普查数据，截至2020年11月1日零时，祁县常住人口为254535人。
echarts晋中市祁县geoJson地图水滴状气泡图
echarts地图渲染时,会通过一个水滴状小气泡来将数值渲染到地图上,我们可以可以通过scatter来实现我们想要的效果.
echarts晋中市祁县geoJson地图根据经纬度显示自定义html弹窗
echarts地图我们可以通过像素坐标来将我们自定义的html弹窗定位到echarts地图指定位置,如果是固定的宽高的话,这没什么问题直接定位就可以了,如果是自适应宽高的地图我们可能没办法控制精度,我们可以使用经纬度来控制,当echarts地图渲染完成以后,我们可以通过convertToPixel将经纬度转为像素坐标,然后再渲染自定义弹窗,这样精度就比较准确了,而且也不会因为窗体宽高变化而导致弹窗出现偏移.
echarts晋中市祁县geoJson地图 tooltip轮播
echarts地图实现类似tooltip轮播效果,通过effectScatter实现浮窗,并通过定时修改effectScatter的data来实现浮窗的移动.
threejs晋中市祁县geoJson地图3d地图css2d标签
通过threejs绘制的3d地图css2d标签实例，CSS2D面向摄像机,不随场景缩放而缩放,如果对threejs感兴趣，可以观看threejs课程视频 WebGL/Three.js前端3D可视化教程
threejs晋中市祁县geoJson地图3d地图鼠标移入显示标签并高亮
通过threejs绘制的3d地图鼠标移入显示标签并高亮
threejs晋中市祁县geoJson地图3d地图
通过threejs绘制的3d地图实例
晋中市祁县 下辖有 祁县经济开发区管理委员会,麓台城区管理委员会,城赵镇,西六支乡,丹枫城区管理委员会,昌源城区管理委员会,东观镇,古县镇,峪口乡,昭馀镇,来远镇,贾令镇,祁县经济开发区管理委员会,麓台城区管理委员会,城赵镇,西六支乡,丹枫城区管理委员会,昌源城区管理委员会,东观镇,古县镇,峪口乡,昭馀镇,来远镇,贾令镇
晋中市祁县下辖区域坐标
{"祁县经济开发区管理委员会":[112.44037681027282,37.42721133628643],"麓台城区管理委员会":[112.3223589312138,37.34989032434681],"城赵镇":[112.27300329740805,37.37401277404005],"西六支乡":[112.37689112530707,37.36397027872547],"丹枫城区管理委员会":[],"昌源城区管理委员会":[112.33954854701294,37.36058146649259],"东观镇":[],"古县镇":[112.3781075180948,37.27507891093742],"峪口乡":[112.54403819422811,37.28613613736249],"昭馀镇":[],"来远镇":[112.55004210903252,37.17226479299127],"贾令镇":[112.35881673117487,37.43290161154015]}
晋中市祁县行政划分代码
[{"name":"祁县经济开发区管理委员会","code":""},{"name":"麓台城区管理委员会","code":""},{"name":"城赵镇","code":"140727104000"},{"name":"西六支乡","code":""},{"name":"丹枫城区管理委员会","code":""},{"name":"昌源城区管理委员会","code":""},{"name":"东观镇","code":"140727101000"},{"name":"古县镇","code":"140727102000"},{"name":"峪口乡","code":"140727201000"},{"name":"昭馀镇","code":"140727100000"},{"name":"来远镇","code":"140727105000"},{"name":"贾令镇","code":"140727103000"}]
说明
1、根据《地图审核管理规定》、《互联网地图服务专业标准》等法规，本地图不作为境界线勘界等用处。使用中请查阅《中华人民共和国地图编制出版管理条例》、各地地图编制出版管理办法等地图规定按程序应用。
2、本数据是目前市面上较齐全、精度较高的数据，属性齐全，各大高校科研均在用此数据。
3、本数据仅用于echarts threejs地图效果展示。
