腾讯地图通过地址获取经纬度

腾讯地图通过地址获取经纬度

第一步先引入JS

如果是 vue 项目,在 index.html 文件中引入 js 文件。不是 vue 项目,直接在 html 页面中引入 js 文件。

<script charset="utf-8" src="https://map.qq.com/api/js?v=2.exp&key=your key"></script>

第二步封装方法并使用

如果不是 vue 项目:

<script>
	var geocoder = new qq.maps.Geocoder();
	function getLal (address) {
		//对指定地址进行解析
		geocoder.getLocation(address);
		//设置服务请求成功的回调函数
		geocoder.setComplete((res) => {
            console.log(address + '成功回调数据',res);
		});
		//若服务请求失败,则运行以下函数
		geocoder.setError((err) => {
			console.log(address + '地址输入错误',err)
		})
	}
	getLal('广东省佛山市')
	//getLal('广东省')
</script>

在这里插入图片描述
在这里插入图片描述
如果是 vue 项目:
1、新建一个 js 文件,封装一个方法

export const commonMethods = {
    //根据地址获取经纬度
    getLal: (address,cb) => {
      var geocoder = new qq.maps.Geocoder();
      geocoder.getLocation(address);
      geocoder.setComplete(function(res) {
          cb(res)
      });
      geocoder.setError(function(err) {
          cb(err)
      });
    }
}

在文件中引入方法

commonMethods.getLal('广东省佛山市',(res) => {
	console.log('res',res)
})

在这里插入图片描述

commonMethods.getLal('广东省',(res) => {
	console.log('res',res)
})

在这里插入图片描述

  • 2
    点赞
  • 23
    收藏
    觉得还不错? 一键收藏
  • 6
    评论
评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值