Web компонент для добавления OpenStreetMap на сайт #easyit #openstreetmap #js @EasyITChannel

Изучаем как написать веб компонент интегрирующий работу с OpenStreetMap и библиотекой OpenLayer. Как разместить маркер на карте, как добавить всплывающее информационное окно, как найти точку на карте по адресу и наоборот. Рабочий сайт с этим примером здесь: Тайм коды: 00:11 Вступление 01:20 Чем будем пользоваться при работе 02:19 Инициализация проекта и установка пакетов 03:11 Создаем файл компонента и подключаем его к проекту 03:30 Импортируем необходимые модули в компоненте 05:35 Константы для атрибутов компонента 06:00 Класс компонента, конструктор 10:13 Метод жизненного цикла connectedCallback 15:05 Создаем объект карты 18:15 Обработчик для события singleclick для объекта map 18:55 Получение всех fetures на которых кликнул пользователь и отображение оверлея 19:55 Вывод широты и долготы точки клика в консоль. 20:28 Вызов функции обратного геокодирования 20:50 Добавление слоя маркеров на карту 21:10 Добавляем обработчик для запуска поиска точки по заданному адресу (прямое геокодирование) 22:12 Пишем статический геттер observedAttributes 22:37 Пишем метод жизненного цикла attributeChangedCallback 24:16 Пишем метод обновления компонента после изменения атрибутов 25:21 Регистрируем web компонент 25:39 Модифицируем файл index.html для работы с web компонентом 29:30 Добавляем файл маркера 29:59 Первый запуск и просмотр полученного результата 30:15 Поиск и устранение ошибок 33:05 Рабочая версия после исправления ошибок 33:44 Первое знакомство с движком для прямого и...