Почему при перетаскивании картинка не сохраняет своего предыдущего положения JavaScript?

Нужно сделать перетаскивание картинки внутри канваса. Но почему-то она при каждом новом нажатии на канвас, ее положение после предыдущего перемещения не сохраняется и перемещение происходит с начального положения. Что тут не так?

let dragging = false;
let moveXAmount = 0;
let moveYAmount = 0;
let prevX = 0;
let prevY = 0;

canvas.onmousedown = function() {
    dragging = true;
}

canvas.onmouseup = function() {
    dragging = false;
}

canvas.onmouseout = function() {
    dragging = false;
}

canvas.addEventListener('mousemove', function(e) {
    if (dragging)
    {
        if( prevX > 0 || prevY > 0)
        {
            moveXAmount += e.pageX - prevX;
            moveYAmount += e.pageY - prevY;
            make_pic();
        }
        prevX = e.pageX;
        prevY = e.pageY;
    }
}, false);

function make_pic() {
    ctx.clearRect(0, 0, 1000, 1000);
    ctx.drawImage(image, moveXAmount, moveYAmount, image.width, image.height);
}

Ответы (0 шт):