Класс критического создания
Развлечения с Mapbox и Strapi
На этой неделе я попробовал Mapbox GL JS и Strapi, которые, как я думал, было бы полезно изучить в качестве строительных блоков для моей окончательной идеи проекта. Mapbox GL JS - это библиотека JavaScript для создания интерактивных карт. Strapi - это система управления контентом, в которой вы можете структурировать и отформатировать свои данные, а затем создать API для их экспорта с использованием JSON. Моя великая идея на этой неделе заключалась в том, чтобы добавить кучу данных в мой менеджер контента Strapi, а затем создать API для размещения данных на карте.
Я не совсем зашел так далеко.
Я долго изучал Strapi и экспериментировал с различными способами структурирования моей информации (автор, название книги, жанр, страна и т. Д.).
Затем я потратил много времени на изучение того, как добавить Mapbox GL JS в свой код для веб-сайта практики. Я также использовал JavaScript для добавления функциональности кнопкам стран. Когда вы нажимаете одну из кнопок страны, карты масштабируются до центра этой страны.
После того, как я выяснил, как включить Mapbox, у меня не было достаточно энергии, чтобы попытаться экспортировать мои данные из Strapi, поэтому вместо этого я потратил некоторое время, пытаясь добавить всплывающее окно на мою карту, используя эти инструкции из Mapbox. Но я не мог заставить его работать.
Я подумал, что было бы круто, если бы вы открыли окно-другую книгу, когда вы увеличили масштаб страны на сайте ниже. Я буду продолжать попытки.
Поэтому вместо этого я изменил формулировку заголовков, чтобы не вселять у моих заядлых последователей ложную надежду. Теперь на сайте просто нажимайте кнопки и увеличивайте масштаб по разным странам. Это хорошее начало.
Чтобы сделать карту центром страны одним нажатием кнопки, я создал функцию JS ниже и нашел координаты, перетащив булавки на карты Google. Координаты на картах Google отформатированы (широта, долгота), а координаты в Mapbox GL или отформатированы (долгота, широта), что сначала сбивало с толку.
Учитывая все это, я очень горжусь тем, как далеко я продвинулся!
Репозиторий Github для моей практики, сайт Mapbox находится здесь.
