美文网首页
2018-05-15

2018-05-15

作者: 臣不懂 | 来源:发表于2018-05-15 10:24 被阅读0次

<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>

<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=sfP3Tzge9Y7AMsAqRUb4tSPSMu24KYQb"></script>

(这里引用百度地图的js ,要在百度api申请秘钥)

wx.config({

        //debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。

        //appId: '', // 必填,公众号的唯一标识

        //timestamp: , // 必填,生成签名的时间戳

        //nonceStr: '', // 必填,生成签名的随机串

        //signature: '',// 必填,签名

@Html.Raw(ViewBag.wxJsApiParam) //这里是.net 的后台直接输出以上所需要的json 

        jsApiList: ['getLocation'] // 必填,需要使用的JS接口列表

    });

   wx.ready(function () {

        wx.getLocation({

            type: 'wgs84', // 默认为wgs84的gps坐标,如果要返回直接给openLocation用的火星坐标,可传入'gcj02'

            success: function (res) {

                var latitude = res.latitude; // 纬度,浮点数,范围为90 ~ -90

                var longitude = res.longitude; // 经度,浮点数,范围为180 ~ -180。

                var speed = res.speed; // 速度,以米/每秒计

                var accuracy = res.accuracy; // 位置精度

bdLocationAddress(longitude, latitude); //这里是通过微信获取经纬度

                //alert("经度:" + longitude + "纬度:" + latitude);

                //经度:113.2381

                //纬度:23.1949

                //转换后

                //var x = 113.24997769358316;

                //var y = 23.198141278002385;

            }

        });

    });

    function bdLocationAddress(x, y) {

        //以下获取地理位置

        // 百度地图API功能

        //GPS坐标

        //var x = 113.2381;

        //var y = 23.1949;

var ggPoint = new BMap.Point(x, y);//将微信获取的经纬度转换成百度的经纬度,才可以用实际的位置去显示

        //地图初始化

        //var bm = new BMap.Map("allmap");

 distance(x, y);//这里将转换后的中心点坐标作为参数回调计算两点之间的距离

        //坐标转换完之后的回调函数

        translateCallback = function (data) {

            if (data.status === 0) {

                var marker = new BMap.Marker(data.points[0]);

                //返回位置

                var geoc = new BMap.Geocoder();

                var pt = new BMap.Point(marker.point.lng, marker.point.lat);

                geoc.getLocation(pt, function (rs) {

$(".locationAddress").text(rs.surroundingPois[0].title);//取出第0个json数据的title就是当前的所在位置

                }, { poiRadius: 300, numPois: 1 });

            }

        }

        var convertor = new BMap.Convertor();

        var pointArr = [];

        pointArr.push(ggPoint);

        convertor.translate(pointArr, 1, 5, translateCallback)

    }

function distance(x1, y1) {

        var list = $(".getPoint");

        var map = new BMap.Map("allmap");

var pointA = new BMap.Point(x1, y1);;//这里是由微信坐标转换为百度地图坐标的中心点的位置

        for (var i = 0, x2, y2; i <= list.length; i++) {

x2 = $(list[i]).attr("data-longitude");//后台返回的百度地图的经度

y2 = $(list[i]).attr("data-latitude");;//后台返回的百度地图的纬度

            //map.centerAndZoom("重庆", 12);  //初始化地图,设置城市和地图级别。

              // 创建点坐标A--大渡口区

var pointB = new BMap.Point(x2, y2); //这里是后台返回的各个店铺的坐标位置

var value = map.getDistance(pointA, pointB) <= 1000 ? parseInt(map.getDistance(pointA, pointB)) + '米' : (map.getDistance(pointA, pointB)/1000).toFixed(1) + 'Km';//获取各个店铺到中心点的距离

$(".distance:eq("+i+") ").html(value)//将值放入对应的html

   //alert((map.getDistance(pointA, pointB)).toFixed(2) + ' 米。')//获取两点距离,保留小数点后两位

        }

    }

    //$(function () {

    //    distance(113.2499994, 23.19860)

    //})

相关文章

  • 12306

    train.py 最后更新时间:2018-05-15 0:15:23

  • 随想——源于公园、校园、家园

    葱兰朵朵 2018-05-15 17:21 · 字数 1538 · 阅读 1 · 日记本 邀...

  • http理解(中)

    title: http 理解(中)date: 2018-05-15 14:53:22tags: http 确保We...

  • 2018-05-16

    日式 就这么装! 梵客家装青岛公司2018-05-15 日本和式建筑 又称“和样建筑”或...

  • Python递归优化

    博客文章迁移: 2018-05-15 11:17 在codewars上做题时遇到的坑(https://www.co...

  • 日精进打卡(第312天)

    2018-05-15 姓名:李义 公司:........ 组别:259期利他二组 【知~学习】 背诵 六项精进大纲...

  • 2018-05-15

    网海情缘 郝代弟 2018-05-15 17:23 · 字数 1408 · 阅读 0 · 日记本 冥冥之中有...

  • 享受豪华(转录)

    享受豪华(转录) 2018-05-15 10:43:19|分类: 博友芳香 享受豪华 王正方 (作者简介:王正方,...

  • 2018年的电影记录.中

    81. 2018-05-15「杀手乔」Killer Joe,豆瓣评分6.6:被推荐了这个,看完只觉得全片都好病态。...

  • 王霞感恩功课第162

    王霞感恩功课第162天 王霞王夏 2018-05-15 23:26 · 字数 6217 · 阅读 29 · 日记本...

网友评论

      本文标题:2018-05-15

      本文链接:https://www.haomeiwen.com/subject/mfhedftx.html