Как получить данные из Django Rest Framework в GoogleMaps в JS

Я пытаюсь создать веб-приложение, которое должно получать данные из Django Rest Framework (используя Serializer), передавать их в JavaScript и генерировать маркеры GoogleMaps.

Когда я получаю данные из Django API, JS возвращает мне 'Promise'. Для создания маркеров на GoogleMaps мне нужен объект GeoJson. Пожалуйста, подскажите, где моя ошибка.

Django serializer:

class LocationList(generics.ListAPIView):
    model = Homes
    queryset = Homes.objects.all()
    serializer_class = LocationSerializer

API url:

HTTP 200 OK

Разрешить: GET, HEAD, OPTIONS Content-Type: application/json Vary: Accept

{ "type": "FeatureCollection", "features": [ { "id": 7, "type": "Feature", "geometry": { "тип": "Точка", "координаты": [ 19.2800748, 50.2004355 ] }, "properties": { "property_type": 1, "name": "Zagłoby", "surface": 140.0, "цена": 5600000.0, "домашний_номер": "11", "улица": "Zagłoby", "post_code": "43-600", "город": "Jaworzno", "страна": "Polska", "lat_maps": 50.2004355, "lng_maps": 19.2800748, "add_date": "2022-04-17T15:05:18.274352Z", "active": 2 } },

Мой JS код:

    var endpoint = 'api/location'

async function getLocalization() {
    try {
        const response = await fetch(endpoint);
        return await response.json();
    } catch (error) {
        console.log(error);
    }
}

async function renderLocalization() {
    let address = await getLocalization();
    return address
};


function initMap() {
  // The location of Uluru
  const uluru = { lat: -25.344, lng: 131.031 };
  // The map, centered at Uluru
  const map = new google.maps.Map(document.getElementById("map"), {
    zoom: 4,
    center: uluru,
  });
//
  map.data.addGeoJson(renderLocalization())

  // The marker, positioned at Uluru
  const marker = new google.maps.Marker({
    position: uluru,
    map: map,
  });
}

window.initMap = initMap;

Пожалуйста, помогите мне, как правильно получить данные, чтобы я мог передать их в GoogleMaps.

Вернуться на верх