Кодинг-челлендж №109: Визуализация 500 000 подписчиков

В честь достижения отметки в 500 000 подписчиков я создаю карту с визуализацией местоположения подписчиков Coding Train по всему миру! Код: https://thecodingtrain.com/challenges... 🕹️ Веб-редактор p5.js Sketch: https://editor.p5js.org/codingtrain/s... 🎥 Предыдущее видео:    • Coding Challenge 108: Barnsley Fern   🎥 Следующее видео:    • Coding Challenge #110: Recamán's Sequence ...   🎥 Все видео:    • Coding Challenges   Ссылки: 🔗 Простая карта Mappa.js: https://mappa.js.org/docs/simple-map.... 🔗 Карты, карты, карты!:   / maps-maps-maps   🔗 Широта и долгота стран: https://gist.github.com/sindresorhus/... 🔗 Leaflet: https://leafletjs.com/ 🔗 Карта 500 тыс. подписчиков: https://github.com/CodingTrain/500k-S... 🔗 Специальный выпуск CodingTrain к 500 тыс. подписчиков: https://codingtrain.github.io/500k-Su... Архив прямых трансляций: 🔴 Coding Train Live 144:    • Coding Train Live #144: Map Visualization ...   Временные метки: 0:00 Введение в задачу по программированию 0:42 Описание Mappa.js 1:07 Введение в набор данных YouTube 2:42 Ссылка на библиотеку Mappa.js и руководство 3:38 Предварительная загрузка данных YouTube 5:30 Отладка функции загрузки 8:12 Анализ файла .csv 9:20 Извлечение значений данных 11:57 Загрузка Mappa.js 12:48 Упоминание интеграции с Leaflet 13:55 Описание типов карт: статическая и тайловая 14:38 Создание тайловой карты 15:25 Наложение карты на холст 17:07 Отладка Mappa.js 17:38 Добавление тайлы карты 18:34 Уточнение исходной карты 19:06 Рисование круга с фиксированным положением 20:10 Рисование круга с учетом долготы и широты 21:20 Ссылка на набор данных с координатами стран мира 22:48 Загрузка данных о странах 23:48 Сопоставление данных YouTube по идентификатору страны 24:26 Извлечение долготы и широты 25:20 Рисование круга с координатами 27:27 Отображение карты подписчиков 28:15 Обновление диаметра кругов 31:12 Анализ обновления карты 32:30 Учет уровня масштабирования 34:25 Предварительная обработка данных YouTube 36:22 Определение минимального и максимального количества подписчиков 37:10 Обновление логики отрисовки 39:20 Диаметр карты с учетом минимального и максимального значений 40:35 Отладка значения диаметра 42:22 Преобразование количества подписчиков в число 43:58 Обновление масштаба в соответствии со значением масштабирования 46:28 Загрузка другого набор данных 47:24 Выделите количество просмотров 48:05 Выделите время просмотра 48:25 Завершение задания по программированию Монтаж: Матье Бланшетт Анимация: Джейсон Хеглунд Музыка: Epidemic Sound 🚂 Веб-сайт: http://thecodingtrain.com/ 👾 Поделитесь своим творением! https://thecodingtrain.com/guides/pas... 🚩 Предложите темы: https://github.com/CodingTrain/Sugges... 💡 GitHub: https://github.com/CodingTrain 💬 Discord: https://thecodingtrain.com/discord 💖 Членство: http://youtube.com/thecodingtrain/join 🛒 Магазин: https://standard.tv/codingtrain 🖋️ Twitter:   / thecodingtrain   📸 Instagram:   / the.coding.train   🎥 Задания по программированию:    • Coding Challenges   🎥 Введение в программирование:    • Start learning here!   🔗 p5.js: https://p5js.org 🔗 Веб-редактор p5.js: https://editor.p5js.org/ 🔗 Processing: https://processing.org 📄 Кодекс поведения: https://github.com/CodingTrain/Code-o... Это описание было сгенерировано автоматически. Если вы обнаружили проблему, пожалуйста, создайте заявку: https://github.com/CodingTrain/thecod... #визуализацияданных #картамира #javascript #p5js