Web项目中完成百度地图GPS定位

最新推荐文章于 2024-07-27 16:53:56 发布

zuofengnihao

最新推荐文章于 2024-07-27 16:53:56 发布

阅读量4k

点赞数

本文链接：https://blog.csdn.net/zuofengnihao/article/details/80060107

版权

本文记录了如何在Web项目中实现百度地图的GPS定位功能，通过从数据库获取GPS坐标，然后在地图上展示车辆位置。主要包括地图初始化、判断车辆状态、绘制车辆、车辆轨迹和数据标签等步骤。

摘要由CSDN通过智能技术生成

前一个星期公司要求完成车载系统的实时定位功能，并在web页面显示，其实只是从数据库获取GPS坐标，然后在百度地图上画出来而已，在此记录以下。

准备工作：

准备Map工具类

var Util = window.Util || {};

/**
 * 数据库的格式 12121.212   ddmmm.mm
 * 处理经纬度信息121.21212 dd.mm.mmm  转化为 dd.dddddd
 * 如果是 -300 非法值,则直接返回原值.
 */
Util.formatSBYCoords = function(lnglat) {
    if (lnglat === -300) {
 return lnglat;}
    var l = lnglat  ;
    var lq = parseInt(l/100) ;
    var lqq = (l-lq*100)/60 ;
    var lqqq = lq +lqq ;
    return lqqq ;
}

/**
 * 真实的GPS坐标转换成百度的坐标.
 * @param lng GPS 经度
 * @param lat GPS 纬度
 * @param callback 转换成功后执行的回调函数,如果成功时返回的对象里面 x  代表经度  y 代表纬度.
 */
Util.transferGPS2BD = function(lng, lat, callback) {
    var callbackName = 'cbk_' + Math.round(Math.random() * 10000);
    var arr = lng + ',' + lat;
    var PositionUrl = "http://api.map.baidu.com/geoconv/v1/?coords="+arr+"&from=1&to=5&ak=gxB9Y6SdvED78vddAYI3psLH&callback=BMap." + callbackName;
    var script = document.createElement('script');
    script.src = PositionUrl;
    document.getElementsByTagName("head")[0].appendChild(script);
    BMap[callbackName] = fun