Tencent Maps API calls, high moral map API to get the current location, latitude and longitude

Tencent Maps API calls, high moral map API to get the current location, latitude and longitude

web development, will in many cases need to get the latitude and longitude of the current position of the Internet to find several different map, eventually find a compatible good Tencent Maps API

1, Tencent Maps API call to get the current location, latitude and longitude

The first step: go to Tencent Maps API official website registered account, apply for key
Tencent map
Front alignment assembly
second step: the introduction of more js address: https: //3gimg.qq.com/lightmap/components/geolocation/geolocation.min.js

Step Three: Write on the bin

getTXLocation:function (){
       var _this =this;
       var geolocation = new qq.maps.Geolocation("QNHBZ-55RKF-OMFJJ-NPU7O-EPSDH-ACBAA", "myapp");
       var options = {timeout: 8000};
       var latitude,longitude;
       geolocation.getLocation(showPosition, showErr, options);
       function showPosition(position) {
           console.log(position);
           latitude = position.lat;		
           longitude = position.lng;
           _this.getShopmsg(latitude,longitude);		//获取到经纬度后的操作
       }
       function showErr() {
           console.log(position);
       }
},

Then share a high moral map method

2, high moral map API call to get the current location, latitude and longitude

The first step: go to high moral map API official website registered account, apply for key
Application key
second step: introducing js:<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=您申请的key值"></script>
Here Insert Picture Description

Step Three: Write on the bin

getGDLocation:function () {
    let _this = this;
    var map, geolocation;
    mapObj = new AMap.Map('iCenter');
    map = new AMap.Map('container', {
    });
    mapObj.plugin('AMap.Geolocation', function() {
        geolocation = new AMap.Geolocation({
            enableHighAccuracy: true, //是否使用高精度定位,默认:true
            timeout: 10000, //超过10秒后停止定位,默认:无穷大
            maximumAge: 0, //定位结果缓存0毫秒,默认:0
            convert: true, //自动偏移坐标,偏移后的坐标为高德坐标,默认:true
            buttonOffset: new AMap.Pixel(10, 20),//定位按钮与设置的停靠位置的偏移量,默认:Pixel(10, 20)
        });
        mapObj.addControl(geolocation);
        geolocation.getCurrentPosition();
        AMap.event.addListener(geolocation, 'complete', onComplete);//返回定位信息
        //解析定位结果
        function onComplete(data) {
            console.log(data);
            console.log(data.formattedAddress);
            let getLat = data.position.getLat();
            let getLng = data.position.getLng();
            console.log('纬度:' + getLat + '   经度:' + getLng);
            _this.getShopmsg(getLat,getLng);	//获取到经纬度后的操作
        }
        AMap.event.addListener(geolocation, 'error', onError); //返回定位出错信息
        // 解析定位错误信息
        function onError(data) {
            console.log(data);
            alert('定位失败');
        }
    });
}

Use browser to open web API high moral map will be displayed on the PC side positioning failure , the success on the phone, it could be my method is wrong.
Pro-test using Tencent map Mobile pc are OK, micro letter, Alipay open are OK ~

Published 18 original articles · won praise 4 · Views 4870

Guess you like

Origin blog.csdn.net/xiaojun201593/article/details/100536248