Заполнение объектов в промежутке

появился вопрос касательно three js, имеется вот такой вот навес: введите сюда описание изображения

Задача заключается в том, чтобы в промежутке между началом и концом по длине навеса, заполнить промежутки столбами с определëнным шагом, который можно менять (input), то же самое и с длиной (input). Как это возможно решить?

P.s. столбы моделенные, GLTFloader

код:

var width = parseFloat(document.getElementById("x_pos_id_1").value);
    var height = parseFloat(document.getElementById("x_pos_id_3").value);
    var length = parseFloat(document.getElementById("x_pos_id_5").value);
    var xOffset = parseFloat(document.getElementById("x_pos_id_7").value);

    var score_of_stolb = width/xOffset;

    for(var i = 0; i < score_of_stolb; i++){
      scene.remove(arr[i]);
      arr.splice(i, 1);

      //alert('remove');
    };
    

    //initial offset so does not start in middle.
    for(var i = 0; i < score_of_stolb; i++){

      
      var mesh  = new THREE.Mesh(geometry, material);
      mesh.position.x = i * xOffset;
      arr.push(mesh);
      scene.add(mesh);
    };

весь код реализуется по нажатию на кнопку*


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

Автор решения: Leobuildru

код оказался на деле весьма простым, имеется длина, её делим на шаг столба, далее подставляем это значение в цикл под ограничение цикла. А если хотим удалить всё, просто берём и релоадаем страницу, либо отдельно канвас, чтобы сбросить все добавленные элементы на 3Д холст.

→ Ссылка