由于最近在写一个数据可视化页面,由于地图不规则,有的省份是比较长,有的省份比较宽,就会导致将地图放到页面上去时显得div盒子左右比较空旷,显得不好看所以就要将地图进行旋转在显示,如下图是旋转之前的效果:
下面是放到项目中没有做旋转处理的效果
1.下载需要转换的全国各地省市的地图JSON数据:阿里云 DataV - 数据可视化平台
2.将转换后的地图JSON数据复制到geojson.io编辑器( geoJson编辑器)中查看旋转处理后的地图样子,处理后的地图JSON数据显示效果如下图:
这是做了旋转之后的效果,没有放到项目中
实现思路:
网上的geoJson数据其实就是一个字段标准化的json数据,地图轮廓就是一个个经纬度坐标点绘出来的,既然是数据,那就可以获取地图的中心点(就是所有数据的中心点,这个我是通过百度地图瓦片下载器软件来快速定位的,也可以经纬度查询,这个就只能手动定位,不够精准,但是快速。还有通过一些gis服务api来获取中心点,不过这个更麻烦,难度更高),获取到中心点后,通过公式可以让所有轮廓坐标绕中心点进行旋转一定角度获得新的坐标点,这就是你要的geoJson数据了。
项目需求:
我的项目需要使用echart展示地图,但