Контролировать скорость settimeout в вызове Ajax

Я пытаюсь контролировать скорость объекта холста с помощью ползунка. Проблема в том, что холст считывает данные из вызова ajax, и я не могу получить доступ к переменной времени ожидания, чтобы изменить скорость с помощью ползунка на странице.

Я удалил весь код, который не работает. У меня он вернулся к последней рабочей версии без значения ползунка с жестко закодированными значениями для скорости settimeout.

$.ajax({

url: "/static/Data/test.txt",
dataType: "text",
cache: false,
async: true,
success: function (data) {
    var arr =   data.split(/,/g).slice(0);
    function drawShape(x , y,colour){
        context.strokeRect(p + gridX,p,gridX,gridY);
        context.fillStyle = colour;
        context.fillRect(p + gridX * x,p+ gridY * y,gridX,gridY);
    }

    for(let i=0; i<arr.length -2; i+=2){
        window.setTimeout(function () {
            x1 = arr[i];
            y1 = arr[i+1];

            context.clearRect(0, 0, 650, 650);

            drawBoard();
            if (grid_type == "grid_standard") {
                drawShape(5, 0, 'green');
                drawShape(5, 1, 'red');
                drawShape(4, 3, 'red');
                drawShape(4, 4, 'red');
                drawShape(2, 2, 'red');
                drawShape(2, 3, 'red');
                drawShape(y1, x1, 'yellow');
            }
            if (grid_type == "grid_cliff") {
                drawShape(5, 5, 'green');
                drawShape(4, 5, 'red');
                drawShape(3, 5, 'red');
                drawShape(2, 5, 'red');
                drawShape(1, 5, 'red');
                drawShape(y1, x1, 'yellow');
            }
            //  $("body").append("Pos: " + x1 + "  "+y1);
        }, i * 50);

    }


    //console.info($.unique(position));
    // $("#div1").text(data);
}

});

Любые указатели будут очень признательны.