百度地图开发:H5获取GPS-wg84经纬度与百度定位API的偏差测试

简介: 百度地图开发:H5获取GPS-wg84经纬度与百度定位API的偏差测试

HTML容器

<div id="map" style="width: 100%;height: 450px;"></div>
<div id="gps" style="width: 100%;height: 20px;"></div>
<div id="bd" style="width: 100%;height: 20px;"></div>
<div id="geo" style="width: 100%;height: 20px;"></div>

异步加载地图

    /*百度地图经纬度选择插件*/
    var centerCords = "113.503484,27.652063";
    function map_load() {
        var load = document.createElement("script");
        load.src = "//api.map.baidu.com/api?v=3.0&ak=11Z8uiP8kIz6AG0**&callback=map_init";
        document.body.appendChild(load);
    }
    window.onload = map_load;


初始化地图

//初始化地图;
    var map;
    function map_init() {
        map = new BMap.Map("map", {enableMapClick: false});
        var point = new BMap.Point(centerCords.split(",")[0], centerCords.split(",")[1]);
        map.centerAndZoom(point, 15);
        map.enableScrollWheelZoom();
        // 添加定位控件;
        var geolocationControl = new BMap.GeolocationControl();
        map.addControl(geolocationControl);
        //H5定位;
        navigator.geolocation.getCurrentPosition(function (position) {
            var x = position.coords.longitude;
            var y = position.coords.latitude;
            $("#gps").html("GPS坐标:" + x + "," + y);
            var ggPoint = new BMap.Point(x, y);
            //GPS标注;
            var markergg = new BMap.Marker(ggPoint);
            map.addOverlay(markergg); //添加GPS marker
            var labelgg = new BMap.Label("GPS坐标", {offset: new BMap.Size(20, -10)});
            markergg.setLabel(labelgg); //添加GPS label
            //BD转换;
            var convertor = new BMap.Convertor();
            var pointArr = [];
            pointArr.push(ggPoint);
            convertor.translate(pointArr, 1, 5, translateCallback);
        }, function (err) {
            console.log(err.code);
            // code:返回获取位置的状态
            //0:不包括其他错误编号中的错误
            //1:用户拒绝浏览器获取位置信息
            //2:尝试获取用户信息,但失败了
            //3:设置了timeout值,获取位置超时了
        }, {
            enableHighAcuracy: true, //位置是否精确获取
            timeout: 5000,//获取位置允许的最长时间
            maximumAge: 0 //多久更新获取一次位置
        })
        //坐标转换完之后的回调函数
        translateCallback = function (data) {
            if (data.status === 0) {
                var marker = new BMap.Marker(data.points[0]);
                map.addOverlay(marker);
                $("#bd").html("百度坐标:" + data.points[0].lng + "," + data.points[0].lat);
                var label = new BMap.Label("百度坐标", {offset: new BMap.Size(20, -10)});
                marker.setLabel(label);
                map.setCenter(data.points[0]);
            }
        }
        //百度地图自动定位;
        bdGeo();
        function bdGeo() {
            var geolocation = new BMap.Geolocation();
            geolocation.getCurrentPosition(function (r) {
                if (this.getStatus() == BMAP_STATUS_SUCCESS) {
                    //var mk = new BMap.Marker(r.point);
                    //map.clearOverlays();
                    map.panTo(r.point);
                    //alert('您的位置:' + r.point.lng + ',' + r.point.lat);
                    $("#geo").html("定位坐标:"+r.point.lng + "," + r.point.lat)
                    var marker = new BMap.Marker(points);
                    map.addOverlay(marker);
                  /*  var points = new BMap.Point(r.point.lng, r.point.lat);
                    //返回当前中心点;
                    map.centerAndZoom(points, 17);
                    //添加标注;
                    var marker = new BMap.Marker(points);
                    map.addOverlay(marker);
                    marker.enableDragging();
                    marker.addEventListener('dragend', function () {
                        //console.log(marker.getPosition().lat);
                        $("#L_lnglat").val(marker.getPosition().lng + "," + marker.getPosition().lat)
                    })*/
                } else {
                    alert('failed' + this.getStatus());
                }
            }, function (error) {
                console.log(error);
            }, {
                enableHighAccuracy: true,//是否要求高精度的地理位置信息
                timeout: 1000,//对地理位置信息的获取操作做超时限制
                maximumAge: 0//设置缓存有效时间
            });
        }
    }


lockdatav Done!

相关文章
|
10天前
|
缓存 监控 前端开发
顺企网 API 开发实战:搜索 / 详情接口从 0 到 1 落地(附 Elasticsearch 优化 + 错误速查)
企业API开发常陷参数、缓存、错误处理三大坑?本指南拆解顺企网双接口全流程,涵盖搜索优化、签名验证、限流应对,附可复用代码与错误速查表,助你2小时高效搞定开发,提升响应速度与稳定性。
|
2月前
|
人工智能 数据可视化 测试技术
Postman 性能测试教程:快速上手 API 压测
本文介绍API上线后因高频调用导致服务器告警,通过Postman与Apifox进行压力测试排查性能瓶颈。对比两款工具在批量请求、断言验证、可视化报告等方面的优劣,探讨API性能优化策略及行业未来发展方向。
Postman 性能测试教程:快速上手 API 压测
|
2月前
|
测试技术 开发者 Python
Python单元测试入门:3个核心断言方法,帮你快速定位代码bug
本文介绍Python单元测试基础,详解`unittest`框架中的三大核心断言方法:`assertEqual`验证值相等,`assertTrue`和`assertFalse`判断条件真假。通过实例演示其用法,帮助开发者自动化检测代码逻辑,提升测试效率与可靠性。
207 1
|
2月前
|
数据可视化 测试技术 API
从接口性能到稳定性:这些API调试工具,让你的开发过程事半功倍
在软件开发中,接口调试与测试对接口性能、稳定性、准确性及团队协作至关重要。随着开发节奏加快,传统方式已难满足需求,专业API工具成为首选。本文介绍了Apifox、Postman、YApi、SoapUI、JMeter、Swagger等主流工具,对比其功能与适用场景,并推荐Apifox作为集成度高、支持中文、可视化强的一体化解决方案,助力提升API开发与测试效率。
|
2月前
|
人工智能 自然语言处理 机器人
使用 API 编程开发扣子应用
扣子(Coze)应用支持通过 API 编程,将 AI 聊天、内容生成、工作流自动化等功能集成至自有系统。主要 API 包括 Bot API(用于消息交互与会话管理)及插件与知识库 API(扩展功能与数据管理)。开发流程包括创建应用、获取密钥、调用 API 并处理响应,支持 Python 等语言。建议加强错误处理、密钥安全与会话管理,提升集成灵活性与应用扩展性。
609 0
|
17天前
|
API 开发者 数据采集
高效获取淘宝商品详情:API 开发实现链接解析的完整技术方案
2025反向海淘新机遇:依托代购系统,聚焦小众垂直品类,结合Pandabay数据选品,降本增效。系统实现智能翻译、支付风控、物流优化,助力中式养生茶等品类利润翻倍,新手也能快速入局全球市场。
高效获取淘宝商品详情:API 开发实现链接解析的完整技术方案
|
2月前
|
数据采集 缓存 API
小红书笔记详情 API 实战指南:从开发对接、场景落地到收益挖掘(附避坑技巧)
本文详解小红书笔记详情API的开发对接、实战场景与收益模式,涵盖注册避坑、签名生成、数据解析全流程,并分享品牌营销、内容创作、SAAS工具等落地应用,助力开发者高效掘金“种草经济”。
小红书笔记详情 API 实战指南:从开发对接、场景落地到收益挖掘(附避坑技巧)
|
8天前
|
人工智能 自然语言处理 测试技术
Apipost智能搜索:只需用业务语言描述需求,就能精准定位目标接口,API 搜索的下一代形态!
在大型项目中,API 数量庞大、命名不一,导致“找接口”耗时费力。传统工具依赖关键词搜索,难以应对语义模糊或命名不规范的场景。Apipost AI 智能搜索功能,支持自然语言查询,如“和用户登录有关的接口”,系统可理解语义并精准匹配目标接口。无论是新人上手、模糊查找还是批量定位,都能大幅提升检索效率,降低协作成本。从关键词到语义理解,智能搜索让开发者少花时间找接口,多专注核心开发,真正实现高效协作。
|
11天前
|
存储 缓存 算法
淘宝买家秀 API 深度开发:多模态内容解析与合规推荐技术拆解
本文详解淘宝买家秀接口(taobao.reviews.get)的合规调用、数据标准化与智能推荐全链路方案。涵盖权限申请、多模态数据清洗、情感分析、混合推荐模型及缓存优化,助力开发者提升审核效率60%、商品转化率增长28%,实现UGC数据高效变现。
|
14天前
|
存储 缓存 算法
亚马逊 SP-API 深度开发:关键字搜索接口的购物意图挖掘与合规竞品分析
本文深度解析亚马逊SP-API关键字搜索接口的合规调用与商业应用,涵盖意图识别、竞品分析、性能优化全链路。通过COSMO算法解析用户购物意图,结合合规技术方案提升关键词转化率,助力卖家实现数据驱动决策,安全高效优化运营。
下一篇
开通oss服务