wechat JS-SKD (getLoaction) 定位显示百度map

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
        <title></title>
        <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
        <script type="text/javascript">
            //通过config接口注入权限验证配置
            wx.config({
                debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
                appId: '', // 必填，公众号的唯一标识
                timestamp: '<?php echo time();?>', // 必填，生成签名的时间戳
                nonceStr: '<?php echo $nonceStr;?>', // 必填，生成签名的随机串
                signature: '<?php echo $signature;?>',// 必填，签名
                jsApiList: [] // 必填，需要使用的JS接口列表
            });
            //通过ready接口处理成功验证
            wx.ready(function(){
                // config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后
            
});
            document.querySelector('#getLocation').onclick = function() {
             wx.getLocation({
             type: 'wgs84',     
             success: function(res) {
             var latitude = res.latitude; // 纬度，浮点数，范围为90 ~ -90
             var longitude = res.longitude; // 经度，浮点数，范围为180 ~ -180。
             
             

             },
            cancel: function(res) {
            alert('用户拒绝授权获取地理位置');
            }
            });
            };
        </script>
    </head>
    <body>
        <input type="button" value="Getloaction" id="getLoaction"/>
        <input type=""

    </body>
</html>

注意：
* 1. 所有的JS接口只能在公众号绑定的域名下调用，公众号开发者需要先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。
* 2. 如果发现在 Android 不能分享自定义内容，请到官网下载最新的包覆盖安装，Android 自定义分享接口需升级至 6.0.2.58 版本及以上。
* 3. 完整 JS-SDK 文档地址：http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html

引入百度地图API

<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&amp;ak=你的key"></script>

  <script type="text/javascript">
       var go = function (a, b) {
           // 百度地图API功能
           var map = new BMap.Map("allmap");
           map.centerAndZoom(new BMap.Point(113.58, 22.25), 12);
           map.enableScrollWheelZoom(true);

           var p1 = new BMap.Point(113.584793, 22.253452);
           var p2 = new BMap.Point(113.582202, 22.252536);
           var p3 = new BMap.Point(113.585175, 22.258135);
           var p4 = new BMap.Point(113.582305, 22.251052);
           var p5 = new BMap.Point(a, b);
           var walking = new BMap.WalkingRoute(map, { renderOptions: { map: map, autoViewport: true } });
           walking.search(p1, p5);
           // switch(type){

           // case 'driving':
           //     var driving = new BMap.DrivingRoute(map, {renderOptions:{map: map, autoViewport: true}});
           //     driving.search(p1, p4);
           //     break;

           // case 'transit':
           // var transit = new BMap.TransitRoute(map, {renderOptions:{map: map, autoViewport: true}});
           // transit.search(p3, p1);
           //     break;

           // case 'walking':
           //     var walking = new BMap.WalkingRoute(map, {renderOptions:{map: map, autoViewport: true}});
           //     walking.search(p1, p2);
           //     break;
           // case 'test':
           //     var walking = new BMap.WalkingRoute(map, {renderOptions:{map: map, autoViewport: true}});
           //     walking.search(p1, p5);
           //     break;
           // }
       }

</script>

最后在WeChat JSSDK

document.querySelector('#getLocation').onclick = function() {
             wx.getLocation({
             type: 'wgs84',     
             success: function(res) {
             var latitude = res.latitude; // 纬度，浮点数，范围为90 ~ -90
             var longitude = res.longitude; // 经度，浮点数，范围为180 ~ -180。
             go(longitude,latitude);
             

             },
            cancel: function(res) {
            alert('用户拒绝授权获取地理位置');
            }
            });
            };

最后在微信上进制定的链接在页面点击getlocation按钮就可以看到你当前位置到你固定好的位置的步行距离了

地图显示的样式

<div id="allmap" style="height: 469px;  569px; max- 100%; overflow:hidden;"></div>

2015-09-11 Stuart