Запрос данных через fetch, ожидание обработки и использование в JS openLayers для карт OSM

У меня есть массив получаю его по fetch. Далее я его использую для отрисовки иконок на карте OSM через open layers скрипт. Получается так что функции у меня уже выполняются, иконок не появляется так как им нужны данные из массива который еще не обработан получается вот суть проблемы.

Массив:

var pointsStation = [];
async function fetchData() {
    try {
        const response = await fetch('getdata.php');
        const data = await response.json();

        data.forEach(point => {
            var newPoint = {
                id: point.idstation,
                name: point.stationName,
                timearr: point.timearrft,
                timesend: point.timesendft,
                cords: [point.longitude, point.latitude]
            };
            pointsStation.push(newPoint);
        });
    } catch (error) {
        console.error('Error fetching data:', error);
    }
}
fetchData(); 

Далее этот массив использую в функциях вида:

function addMarkerStations() {
    for (var j = 0; j < pointsStation.length; j++) {
        var iconFeature = new ol.Feature({
            geometry: new ol.geom.Point(ol.proj.transform(pointsStation[j].cords, 'EPSG:4326', 'EPSG:3857')),
            name: pointsStation[j].name,
            timearr: pointsStation[j].timearr,
            timedep: pointsStation[j].timedep,
            id: 'station-' + pointsStation[j].id
        });
        var iconStyle = new ol.style.Style({
            image: new ol.style.Icon({
                scale: 0.28,
                opacity: 0.8,
                src: "https://school.stnorbert.org/wp-content/uploads/2018/01/bus-stop-filled-100.png"
            })
        });
        iconFeature.setStyle([iconStyle]);
        iconFeatures.push(iconFeature);
    }
    iconSource = new ol.source.Vector({features: iconFeatures});
}

Я понимаю что нужно вроде как через async/wait делать, я переписал под этот синтаксис код, но дальше не понимаю когда лучше вызывать функции по отрисовке. И не хотелось бы сильно затрагивать эти функции по отрисовке, иначе начинаются проблемы с главным скприптом карты OSM.


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

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

В общем проблему разрешил, все функции для отрисовки карты сделал сразу после обработки запроса, все оказалось проще:

 fetch('getdata.php')
            .then(async response => await response.json())
            .then(async data =>

....в этом then после цикла

→ Ссылка