Javascript 如何消除HTML5画布鼠标垫方法中的抖动效应？

我正在做一个基于平铺的游戏项目，它使用一个巨大的HTML5画布来渲染棋盘

目前，我正在消除bug，以创造最佳的用户体验，目前我的鼠标垫脚本在检测何时切换方向时产生了令人遗憾的抖动效果。请查找下面的代码，任何软化效果的方法（这是由（

e.pageX>=oldx

）的苛刻阈值造成的）都将是非常棒的。所有这些都是为了实现平滑的画布鼠标垫脚本

if (e.pageX >= oldx) {
scroll.x -= (e.pageX - this.offsetLeft) / 45;

if (scroll.y < 0) {
    scroll.y = 0;
};

if (scroll.x < 0) {
    scroll.x = 0;
};

} else {

scroll.x += (e.pageX - this.offsetLeft) / 45;

if (scroll.y < 0) {
    scroll.y = 0;
};

if (scroll.x < 0) {
    scroll.x = 0;
};

}

if (e.pageY >= oldy) {
scroll.y -= (e.pageY - this.offsetTop) / 45;

if (scroll.y < 0) {
    scroll.y = 0;
};

if (scroll.x < 0) {
    scroll.x = 0;
};

} else {

scroll.y += (e.pageY - this.offsetTop) / 45;

if (scroll.y < 0) {
    scroll.y = 0;
};

if (scroll.x < 0) {
    scroll.x = 0;
};

}

oldx = e.pageX;
oldy = e.pageY;

if（e.pageX>=oldx）{
scroll.x-=（e.pageX-this.offsetLeft）/45；
如果（滚动y<0）{
滚动y=0；
};
如果（滚动.x<0）{
滚动x=0；
};
}否则{
scroll.x+=（e.pageX-this.offsetLeft）/45；
如果（滚动y<0）{
滚动y=0；
};
如果（滚动.x<0）{
滚动x=0；
};
}
如果（e.pageY>=oldy）{
scroll.y-=（e.pageY-this.offsetTop）/45；
如果（滚动y<0）{
滚动y=0；
};
如果（滚动.x<0）{
滚动x=0；
};
}否则{
scroll.y+=（e.pageY-this.offsetTop）/45；
如果（滚动y<0）{
滚动y=0；
};
如果（滚动.x<0）{
滚动x=0；
};
}
oldx=e.pageX；
oldy=e.pageY；
我不知道你所说的抖动效果是什么意思。我只能猜测，但试着对坐标值进行舍入。
Math.round（（e.pageY-this.offsetop）/45）
你能发布你的动画循环吗？