html调用高德地图得到城市,高德地图API获取行政区域

高德地图API提供的行政区划查询，可以获取到行政区域的区号、城市编码、中心点、边界、下辖区域的详细信息。基于该工具进行扩展，对边界数据做转换处理，保存为GeoJson格式文件，方便使用。现已可以单个城市的边界数据下载。

ToDo

下载整个省、市的边界数据

火星坐标转换

现在就去下载

😏想知道具体的实现，就往下看，不想就点上面的链接吧！

Vue项目中使用高德地图

什么？？？Vue？别慌，完全是因为我高兴！！！其实是想试试Vue，看看上上篇文章就知道了。

引入高德地图

文件index.html中引入高德地图JavaScript API入口脚本。

配置webpack

文件webpack.base.conf.js中，找到module.exports项，添加：

externals: {

'AMap': 'AMap'

}

创建地图

在需要的页面中引入

import AMap from 'AMap'

export default {

name: 'AMapDemo',

methods: {

initMap(){

const map = new AMap.Map('map-container', {

center: [116.397428, 39.90923],

zoom: 14

})

}

},

mounted(){

this.initMap()

}

}

#map-container {

width: 800px;

height: 600px;

}

复制代码

获取流程

生成的GeoJson怎么保存到本地？

npm install file-saver --save

复制代码

var blob = new Blob(["Hello, world!"], {type: "text/plain;charset=utf-8"});

FileSaver.saveAs(blob, "hello world.txt");

复制代码

打赏

微信支付

支付宝

本文作者：huangli

版权声明：本博客所有文章除特别声明外，均采用 CC BY-NC-SA 4.0 许可协议。转载请注明出处！