腾讯地图 异步获取经纬度，进行回调定位。

1、html代码

 <style>
        .map {
            width: 100%;
            height: 300px;
        }

        .maptxt {
            width: 100%;
            margin: 20px 0px;
            text-align: center;
            font-size: 15px;
            font-weight: bold;
            color: #3C7CC2;
            background: #fff;
        }
    </style>
    
    /*此处为地图展示*/
 <a id="aToMap" href="">
 	<div class="map" id="map-container"></div>
 </a>
 /*此处在微信内置浏览器中可以进行，点击按钮跳转到移动端内置地图软件中进行导航*/
 <input type="submit" name="button" id="gets" value="导航路线" class="maptxt" /> 

2、引入JS

	/*微信内置浏览器中使用*/
    <script src="https://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
    /*地图使用*/
    <script charset="utf-8" src="https://map.qq.com/api/js?v=2.exp&key=YouKey"></script>

3、Js写法

 <script>
        var citylocation, map, marker = null;
        //给外层的a标签加上url，方便一会点击小地图的时候直接跳转。
        function newMapGo(id, lat, lng) {
            var markUrl = 'https://apis.map.qq.com/tools/poimarker' +
                '?marker=coord:' + lat + ',' + lng +
                '&key=YouKey&referer=myapp';
            //给位置展示组件赋值
            document.getElementById(id).href = markUrl;
        }
        //需要外层元素id和对应地址的经纬度
        function newMap(id, lat, lng) {
            var center = new qq.maps.LatLng(lat, lng);
            var map = new qq.maps.Map(document.getElementById(id), {
                center: center,
                zoom: 18
            });
            //调用城市服务信息
            citylocation = new qq.maps.CityService({
                complete: function (results) {
                    map.setCenter(results.detail.latLng);
                    if (marker != null) {
                        // marker.setMap(null);
                    }
                    //设置marker标记
                    marker = new qq.maps.Marker({
                        map: map,
                        position: results.detail.latLng
                    });
                }
            });
            citylocation.searchCityByLatLng(center);
            newMapGo('aToMap', lat, lng);
        }
 </script>

4、使用方法

//给id,经纬度
 newMap('map-container', lat, lng);
 /*此时为点击导航按钮进行跳转，进行的config注入行为*/
$.post('/handlers/WxSharesParamList.ashx', function (data) {
       var dates = JSON.parse(data);
        //设置JSApi配置
         wx.config({
                  debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
                  appId: dates.APPID, // 必填，公众号的唯一标识
                  timestamp: dates.timestamp, // 必填，生成签名的时间戳
                  nonceStr: dates.nonceStr, // 必填，生成签名的随机串
                  signature: dates.signature, // 必填，签名，见附录1
                  jsApiList: ['onMenuShareTimeline',  'onMenuShareWeibo', 'openLocation']});
                              wx.ready(function () {
                                $(".maptxt").click(function () {
                                    wx.openLocation({
                                       latitude: parseFloat(array[0]), // 纬度，浮点数，范围为90 ~ -90
                                       longitude: parseFloat(array[1]), // 经度，浮点数，范围为180 ~ -180。
                                       name: '', // 位置名
                                       address: '', // 地址详情说明
                                       scale: 28, // 地图缩放级别,整形值,范围从1~28。默认为最大
                                       infoUrl: '', // 在查看位置界面底部显示的超链接,可点击跳转
                                                });
                                            })
                                        });
                                    });