百度地图Marker平滑移动

本文介绍如何实现在百度地图上,根据实时位置数据使Marker平滑移动。通过将大步长分解为小步长,避免Marker在移动过程中的跳跃。通过经纬度到平面坐标的转换,并使用定时请求更新位置,确保Marker平滑过渡。文中提到了在转换过程中遇到的问题及解决方案,参考了三位博主的文章。
摘要由CSDN通过智能技术生成

代码参考了三位大佬的文章,文章末尾会附链接

功能要求:实时从后台获取位置数据,然后标注在地图上,Marker从一个点到另个点之间要平滑移动,不能出现蹦蹦跳跳的情况。

实现思想:之所以会出现Marker跳动的情况,是因为每次迈的步子过大,或者说是距离过长,如果能把每段的距离都分成更多段更小的距离,这样Marker可以慢慢地小碎步移动过去,这样从视觉上来看就是平滑地移动过去。既然是要把两点之间的距离分成更多更小的距离,那么就存在一个问题:获取到的经纬度是球面坐标,而我要划分更多段,那就需要把获取到的经纬度先转换成平面坐标。

定时请求位置数据,每次取两个点,比如,第一个点和第二个点,第二个点和第三个点,第三个点和第四个点.............

实现代码如下

/**
     * 两点之间平滑移动
     * gaoxingzhu
     * @param prvePoint 起点坐标
     * @param newPoint 终点坐标
     * @param timer 两点之间要移动的次数
     * @param marker Marker图标
     * @param count 每次移动的时间(毫秒)
     */
    function moveCar(prvePoint, newPoint, timer,marker,count){
        var _prvePoint = new BMap.Pixel(0,0); //Pixel表示地图上的一个点,单位为像素
        var _newPoint = new BMap.Pixel(0,0);
        var currentCount = 0;//当前帧数
        var proje
  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值