新手上路,勿喷,有问题可讨论
主要参考和修改了百度地图路书的方法,修改为普通方法使用
项目原本是每10秒获取一次gps,所以返回的两个位置会间隔比较大,所以在这两个位置之间参考并修改了路书的方法,在它们之间做了一些平滑的移动,还有修改方向,该文章参考了另外一位博主的文章,传送门:https://www.cnblogs.com/peixuanzhihou/p/6540086.html
主要一些方法如下:
//移动车辆,count两点间要移动的次数,timer,每次移动的时间,毫秒
function moveCar(prvePoint, newPoint, timer,marker,count) {
var _prvePoint = new BMap.Pixel(0,0);
var _newPoint = new BMap.Pixel(0,0);
//当前帧数
var currentCount = 0;
//初始坐标
_prvePoint = map.getMapType().getProjection().lngLatToPoint(prvePoint);
//获取结束点的(x,y)坐标
_newPoint = map.getMapType().getProjection().lngLatToPoint(newPoint);
//两点之间匀速移动
var intervalFlag = setInterval(function() {
//两点之间当前帧数大于总帧数的时候,则说明已经完成移动
if (currentCount >= count) {
clearInterval(intervalFlag);
} else {
//动画移动
currentCount++;//计数
//console.log(currentCount);
var x = linear(_prvePoint.x, _newPoint.x, currentCount,
count);
var y = linear(_prvePoint.y, _newPoint.y, currentCount,
count);
//根据平面坐标转化为球面坐标
var pos = map.getMapType().getProjection().pointToLngLat(new BMap.Pixel(x, y));
//console.log(pos);
marker.setPosition(pos);
//调整方向
setRotation(prvePoint, newPoint, marker);
}
}, timer);
//marker.removeOverlay(marker);
}
//
function linear(initPos, targetPos, currentCount, count) {
var b = initPos, c = targetPos - initPos, t = currentCount, d = count;
return c * t / d + b;
}
//设置方向
function setRotation(curPos, targetPos, marker) {
var deg = 0;
curPos = map.pointToPixel(curPos);
targetPos = map.pointToPixel(targetPos);
if (targetPos.x != curPos.x) {
var tan = (targetPos.y - curPos.y) / (targetPos.x - curPos.x), atan = Math
.atan(tan);
deg = atan * 360 / (2 * Math.PI);
if (targetPos.x < curPos.x) {
deg = -deg + 90 + 90;
} else {
deg = -deg;
}
marker.setRotation(-deg);
} else {
var disy = targetPos.y - curPos.y;
var bias = 0;
if (disy > 0){
bias = -1;
}
else{
bias = 1;
}
marker.setRotation(-bias * 90);
}
return;
}
欢迎来这讨论