Ищете подход к использованию данных GraphQL для отображения маркеров в MapBox

Question

Я создаю простое ReactJS веб-приложение, которое будет отображать карту с маркерами внутри. Веб-приложение построено с использованием проекта Gatsby JS и данных из WordPress с использованием GraphQL. Данные из Wordpress - это отдельные сообщения, содержащие координаты широты и долготы. Я хотел бы отобразить каждую из этих точек из WordPress в качестве маркера в Mapbox. Поскольку я получил более 1.000 маркеров, я решил, что оптимальным является загрузка объекта geo json в качестве источника данных моей карты вместо индивидуальной визуализации каждого маркера в качестве компонента реакции.

Я хотел бы собрать данные через GraphQL с помощью запроса stati c, а затем построить объект geo json с использованием этих данных. Затем гео json принимается в качестве реквизита моим компонентом карты и воспроизводится.

На практике это кажется правильным подходом или вы предложите мне другой способ?

Answer 1

Этот подход работает, но вы, вероятно, захотите использовать запрос в gatsby-node.js для создания файла stati c из данных во время сборки, а не использовать запрос stati c. Это позволяет вам использовать либо прямой оператор import для включения данных geo json как часть ваших блоков веб-пакетов, либо реализовать отложенное загруженное решение, в котором вы визуализируете скелет или состояние «загрузки» при выдаче отдельного запроса на получение. файл geo json.