高德地图

用高德地图做了定位:

准备工作就不多说了,就是注册登录账号获得key值,然后在main.js里引入
// 高德地图
import AMap from ‘vue-amap’;
Vue.use(AMap);
// 初始化vue-amap
AMap.initAMapApiLoader({
// 高德的key
key: ‘申请的key’,
// 插件集合 (插件按需引入)
plugin: [‘AMap.Autocomplete’, ‘AMap.PlaceSearch’, ‘AMap.Scale’, ‘AMap.OverView’, ‘AMap.ToolBar’, ‘AMap.MapType’, ‘AMap.PolyEditor’, ‘AMap.CircleEditor’]
});
然后就是使用,我需要获得的只有定位,所以对ui不做太多修整。

 var that = this;
           var mapObj = new AMap.Map('mapDemo');
            mapObj.plugin('AMap.Geolocation', function () {
               var geolocation = new AMap.Geolocation({
                    enableHighAccuracy: true,//是否使用高精度定位,默认:true
                    timeout: 10000,          //超过10秒后停止定位,默认:无穷大
                    maximumAge: 0,           //定位结果缓存0毫秒,默认:0
                    convert: true,           //自动偏移坐标,偏移后的坐标为高德坐标,默认:true
                    showButton: true,        //显示定位按钮,默认:true
                    buttonPosition: 'LB',    //定位按钮停靠位置,默认:'LB',左下角
                    buttonOffset: new AMap.Pixel(10, 20),//定位按钮与设置的停靠位置的偏移量,默认:Pixel(10, 20)
                    showMarker: true,        //定位成功后在定位到的位置显示点标记,默认:true
                    showCircle: true,        //定位成功后用圆圈表示定位精度范围,默认:true
                    panToLocation: true,     //定位成功后将定位到的位置作为地图中心点,默认:true
                    zoomToAccuracy:true      //定位成功后调整地图视野范围使定位位置及精度范围视野内可见,默认:false
                });
                mapObj.addControl(geolocation);
                geolocation.getCityInfo(function(status,result){
                    that.adress = result.country + result.province + result.city;
                })
            });

adress就是最终得到的地址,格式为中华人民共和国广东省深圳市。

高德开放平台:https://lbs.amap.com/
定位文档:https://lbs.amap.com/api/javascript-api/guide/services/geolocation

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值